2019/9/9学习小结

上午学习内容
- target
- - 锚点定位
  - base 标签
- 无序列表
- 有序列表 ol
总结
下午学习内容

上午学习内容

内容：

认识网页；
html标签分类；

双标签：
<标签名> 内容 </标签名> 单标签： <标签名 />
HTML标签关系

嵌套关系 <head> <title> </title> </head>
.并列关系 <head></head><body></body>

HTML标签的语义化

所谓标签语义化，就是指标签的含义。
链接标签(重点)

单词缩写： anchor 的缩写。基本解释锚, 铁锚的

在HTML中创建超链接非常简单，只需用标签环绕需要被链接的对象即可，其基本语法格式如下：

href：用于指定链接目标的url地址，当为标签应用href属性时，它就具有了超链接的功能。 Hypertext Reference的缩写。意思是超文本引用

target

target用于指定链接页面的打开方式，其取值有_self和_blank两种，其中_self为默认值，_blank为在新窗口中打开方式。

锚点定位

通过创建锚点链接，用户能够快速定位到目标内容。

创建锚点链接分为两步：

1.使用“a href=”#id名>“链接文本"</a>创建链接文本。

2.使用相应的id名标注跳转目标的位置。

base 标签

base 可以设置整体链接的打开状态

base 写到之间

无序列表

无序列表的各个列表项之间没有顺序级别之分，是并列的。其基本语法格式如下：

<ul>
  <li>列表项1</li>
  <li>列表项2</li>
  <li>列表项3</li>
  ......
</ul>

有序列表 ol

有序列表即为有排列顺序的列表，其各个列表项按照一定的顺序排列定义，有序列表的基本语法格式如下：

<ol>
  <li>列表项1</li>
  <li>列表项2</li>
  <li>列表项3</li>
  ......
</ol>

所有特性基本与ul 一致。

总结

总结今天的思路贯穿线：

2019/9/9Day2学习小结上午学习内容总结下午学习内容

下午学习内容

自己做课后作业

效果图：

2019/9/9Day2学习小结上午学习内容总结下午学习内容

源代码：

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<style>
		.header-1{
			width: 100%;
			height: 50px;
			clear:both; 
		}
		.tu1{
			width: 20%;
			float: left;

		}
		.logo{
			width:100px;
			float: left;


		}
		.tu2{
			width: 50%;
			text-align: center;
			float: left;


		}
		.img01{
			height: 50px;

		}
		.header-1 ul li{
			float: right;
		}
		.ul1 {
			float: right;
			width: 20%;
			
		}
		.ul1 ul{
			float: right;
			
		}
		.ul1 ul li{
			list-style: none;
			margin-right: 5px;
		}

		.header-2{
			width: 100%;
			height: 40px;
			background-color:black; 
		}
		.ul2 ul{
			margin: 0;
			padding: 0;
			clear: both;
		}
		.ul2 ul li{
			float: left;
			list-style: none;
			margin-right: 5px;

		}
		.ul2 ul li a{
			color: #fff;
			font-size: 14px;
			text-decoration: none;
			line-height: 30px;
		}
		.bannertu{
			width: 100%;
			height: 500px;
		}
		.shangpin {
			height: 30px;
			width: 100%;
		}
		.shangpin h3{
			float: left;
			margin: 0;
			padding: 0;
		}
		.shangpin img{
			float: left;
			margin-top: 5px
		}
		.zhongjian-1{
			clear: both;
		}
		.zhongjian-1 .left{
			float: left;
		}
		.zhongjian-1 .rigth{
			/*float: left;*/
			height: 480px;
			width: 100%;
			/*clear: both;*/
		}
		.rigth .rigth-top{
			float: left;
			width: 1000px;
			height: 236px;
		}
		.rigth .rigth-top img{
			float: left;
		}
		.rigth .rigth-top ul{
			float: left;
			margin: 0;

		}
		.rigth .rigth-top ul li{
			float: left;
			list-style: none;
			margin-left: 30px; 
			height: 236px;
		}
		.p1{
			padding-top: 20px;
			padding-left: 30px; 
		}
		.p2{
			padding-left: 30px; 
			color: red;
		}
		.rigth .rigth-foot{
			float: left;
			width: 1000px;
			height: 236px;

		}
		.rigth .rigth-foot img{
			float: left;
		}
		.rigth .rigth-foot ul{
			float: left;
			margin: 0;
			padding: 0;

		}
		.rigth .rigth-foot ul li{
			float: left;
			list-style: none;
			margin-left: 30px; 
			height: 236px;
			margin-top: 20px;
		}
		.ad img{
			width: 100%;
		}
		.footertu img{
			width: 100%;
		}
		.footer{
			text-align: center;
		}
		.footer ul{
			list-style: none;

		}
		.footer ul li{
			margin-right: 5px;
			display: inline;
		}
		.p3{
			font-size: 13px;
		}
	</style>
</head>
<body>
	<div class="header">
		<div class="header-1">
			<div class="tu1">
				<img class="logo" src="day2作业/img/logo2.png" alt="">
			</div>
			<div class="tu2">
				<img class="img01" src="day2作业/img/header.png" alt="">
			</div>
			<div class="ul1">
				<ul>
					<li>
						<a href="#">登录</a>
					</li>
					<li>
						<a href="#">注册</a>
					</li>
					<li>
						<a href="#">购物车</a>
					</li>
				</ul>
			</div>
		</div>
		<div class="header-2">
			<div class="ul2">
				<ul>
					<li>
						<a href="#">首页</a>
					</li>
					<li>
						<a href="#">手机数码</a>
						
					</li>
					<li>
						<a href="#">电脑办公</a>
						
					</li>
					<li>
						<a href="#">鞋靴箱包</a>
						
					</li>
					<li>
						<a href="#">香烟酒水</a>
						
					</li>
				</ul>
			</div>
		</div>
	</div>
	<div class="banner">
		<img  class="bannertu" src="day2作业/img/1.jpg" alt="">
	</div>
	<div class="shangpin">
		<h3>最新商品</h3>
		<img src="day2作业/img/title2.jpg" alt="">
	</div>
	<div class="zhongjian-1">
		<div class="left">
			<img src="day2作业/img/big01.jpg" alt="">
		</div>
		<div class="rigth">
			<div class="rigth-top">
				<img src="day2作业/img/middle01.jpg" alt="">
				<ul>
					<li>
						<img src="day2作业/img/small08.jpg" alt="">
						<p class="p1">高压锅</p>
						<p class="p2">$998</p>
					</li>
					<li>
						<img src="day2作业/img/small08.jpg" alt="">
						<p class="p1">高压锅</p>
						<p class="p2">$998</p>
					</li>
					<li>
						<img src="day2作业/img/small08.jpg" alt="">
						<p class="p1">高压锅</p>
						<p class="p2">$998</p>
					</li>
					
				</ul>
			</div>
			<div class="rigth-foot">
				<ul>
					<li>
						<img src="day2作业/img/small08.jpg" alt="">
						<p class="p1">高压锅</p>
						<p class="p2">$998</p>
					</li>
					<li>
						<img src="day2作业/img/small08.jpg" alt="">
						<p class="p1">高压锅</p>
						<p class="p2">$998</p>
					</li>
					<li>
						<img src="day2作业/img/small08.jpg" alt="">
						<p class="p1">高压锅</p>
						<p class="p2">$998</p>
					</li>
					<li>
						<img src="day2作业/img/small08.jpg" alt="">
						<p class="p1">高压锅</p>
						<p class="p2">$998</p>
					</li>
					<li>
						<img src="day2作业/img/small08.jpg" alt="">
						<p class="p1">高压锅</p>
						<p class="p2">$998</p>
					</li>
					<li>
						<img src="day2作业/img/small08.jpg" alt="">
						<p class="p1">高压锅</p>
						<p class="p2">$998</p>
					</li>
					
				</ul>
			</div>

		</div>
	</div>
	<div class="ad">
		<img src="day2作业/img/ad.jpg" alt="">
	</div>

	<div class="shangpin">
		<h3>最新商品</h3>
		<img src="day2作业/img/title2.jpg" alt="">
	</div>
	<div class="zhongjian-1">
		<div class="left">
			<img src="day2作业/img/big01.jpg" alt="">
		</div>
		<div class="rigth">
			<div class="rigth-top">
				<img src="day2作业/img/middle01.jpg" alt="">
				<ul>
					<li>
						<img src="day2作业/img/small08.jpg" alt="">
						<p class="p1">高压锅</p>
						<p class="p2">$998</p>
					</li>
					<li>
						<img src="day2作业/img/small08.jpg" alt="">
						<p class="p1">高压锅</p>
						<p class="p2">$998</p>
					</li>
					<li>
						<img src="day2作业/img/small08.jpg" alt="">
						<p class="p1">高压锅</p>
						<p class="p2">$998</p>
					</li>
					
				</ul>
			</div>
			<div class="rigth-foot">
				<ul>
					<li>
						<img src="day2作业/img/small08.jpg" alt="">
						<p class="p1">高压锅</p>
						<p class="p2">$998</p>
					</li>
					<li>
						<img src="day2作业/img/small08.jpg" alt="">
						<p class="p1">高压锅</p>
						<p class="p2">$998</p>
					</li>
					<li>
						<img src="day2作业/img/small08.jpg" alt="">
						<p class="p1">高压锅</p>
						<p class="p2">$998</p>
					</li>
					<li>
						<img src="day2作业/img/small08.jpg" alt="">
						<p class="p1">高压锅</p>
						<p class="p2">$998</p>
					</li>
					<li>
						<img src="day2作业/img/small08.jpg" alt="">
						<p class="p1">高压锅</p>
						<p class="p2">$998</p>
					</li>
					<li>
						<img src="day2作业/img/small08.jpg" alt="">
						<p class="p1">高压锅</p>
						<p class="p2">$998</p>
					</li>
					
				</ul>
			</div>

		</div>
	</div>
	<div class="footertu">
		<img src="day2作业/img/footer.jpg" alt="">
	</div>
	<div class="footer">
		<ul>
			<li>
				<a href="#">关于我们</a>
			</li>
			<li>
				<a href="#">联系我们</a>
			</li>
			<li>
				<a href="#">招贤纳士</a>
			</li>
			<li>
				<a href="#">法律声明</a>
			</li>
			<li>
				<a href="#">友情链接</a>
			</li>
			<li>
				<a href="#">支付方式</a>
			</li>
			<li>
				<a href="#">配送方式</a>
			</li>
			<li>
				<a href="#">服务声明</a>
			</li>
			<li>
				<a href="#">广告声明</a>
			</li>
		</ul>
		<p class="p3">Copyrigth &nbsp 2005-2016宁财商城版权所有 </p>
	</div>
</body>
</html>

2019/9/9Day2学习小结上午学习内容总结下午学习内容

2019/9/9学习小结

上午学习内容

target

锚点定位

base 标签

无序列表

有序列表 ol

总结

下午学习内容

继续阅读

Spring5学习笔记（十二）—— 事务操作

session与cookie

Run-Time Check Failure #2 - Stack around the variable 'cmd' was corrupted 的可能原因

常用的图像特征有颜色特征、纹理特征、形状特征、空间关系特征。

优秀IT顾问的七大能力之六--宏观把控能力6 宏观把控能力

魔数（代码大全第12章：基本数据类型）

项管行知01--几个经理1 定义2 历史

《电磁学》学习笔记5——磁场强度H分子环流假说

项目管理二三事1、时间2、铁三角 3、PMBOK4、PMBOK版本变更5 小结

安卓学习笔记（2）----LinearLayoutLinearLayout

安卓学习笔记（3）------RelativeLayoutRelativeLayout参考文献

.NET中英文切换常见错误

阅读教材的最佳方法是什么？

标识符的命名规则和规范标识符命名规则标识符命名规范基础版Java代码规范详细版

蓝桥杯单片机比赛蜂鸣器与继电器模块（原理、代码详解）

UE学习笔记：材质错乱排序函数