本节简介:讲解浮动属性及清除浮动的应用,利用所学知识手动编写代码,制作导航条案例
本节课同学们做的笔记 点击播放按钮可自动定位到对应时间进行播放
可以忽略父级 直接控制子级 .nav li a{ width:120px;height:40px;background:#39C;diaplay:block} 这样才能控制高度
如果父级元素没有添加高度,子集元素的高度和就是父级元素的高度,但是一旦为子元素添加了float属性之后,子元素的高度就不能再撑开父级
text-decoration:none 取消超链接下划线
list-style:none 把 列表的前面小点去掉
text-decoration:none;划去下划线。伪类选择器,当鼠标移至链接上的时候,背景颜色改变,即.a:hover{background:颜色;}
水平居中:text-align:center.垂直居中:line-height(其实就是行高)。
清除浮动的效果是让所加效果的板块排列在下面,不叠加。如果父级元素没有添加高度属性,那么子元素的高度和就是父级元素的高度,但是一旦为子元素添加了float属性,就不能撑开父级元素的高度了。
三个同时加浮动,则排成一列,但要注意宽度。给第一个加浮动,会掩盖第二个,浮动定义其实就是浮动。块元素要排列一行,统一添加float左或者右。
lear:left 清除左浮动 ,可以清除左边的带有浮动的效果。比如排在左上带有左浮动的标签 可以清除
test-decoration:none清除链接下划线
如果父级元素没有添加高度属性,子集元素的高度和就是父集元素的高度,但是一旦为子元素添加了float属性之后,子元素的高度就不能再撑开父级
清除浮动clear:left/right/both
文字在区块中如何居中text-align:center水平居中line-height:行高和高度一样text-decoration下划线
clear both的作用是使当前元素忽略其上方元素的漂浮属性。如果父级元素没有添加高度属性,子集元素的高度就是父级元素的高度,但是一旦为子元素添加了float属性之后,子元素的高度就不能再撑开父级
伪类选择器.nav li a:hover{backgrund:blue}
文字在区块中如何居中text-align:center水平居中line-height:行高和高度一样text-decoration下划线