小米网站学习-导航栏

小米网站模仿学习-导航栏

—————————————
此笔记是跟着蝉壳学院学习的
—————————————
说是第二天，其实是好几天了，大概两周。
我本想把每个知识总结一下的，但是emmmmm…
以下是下午3个小时学习的内容，学得慢，而且还有好多不懂的，要回去复习一下。
在实践中找到自己的问题。

• .css和.html不在一个文件夹
  要引用上一级文件夹： 第一级/第二级/**.css
• 导航栏顶部没有顶到最上端
  因为body里自带margin和padding

body{
	margin:0;
	padding:0;
	}

这样就处理好了。

• 方便调试
  为了方便调试，可以先不加背景，先加一个边框。这样容易看很多问题。

• div居中

margin：0 auto；

• 浮动带来的边界塌陷
  通过伪元素解决

/*这一块不太清楚*/
.xx::before,.xx::after{
concent:"  ";
display:table;
}
.xx::after{
clear:both;
}

• 快速包围多行
  光标选中–》emmet–》输入包围个别行

• 去掉默认文本标签的下划线

a{
text-decoration:none;
}

• 鼠标放在标签上颜色的改变

.xx a:hover{
	color:#fff;
	}
.xx a这是什么选择器？关于选择器的问题。

• 文本在div内上下居中

.xx{
height:50px;
line-height:50px;/*行高与高度相同*/

• 行元素变块元素

.xx a{
display:block;
}