CSS的再一次深入(更新中···)
全面我们学了6个选择器,今天再来学习两个选择器,分别是通配符选择器和并集选择器:
1.通配符选择器:
*{
}
表示body里所有的标签都被选中
2.并集选择器:
选中的标签之间用逗号隔开,表示这几个标签都被选中
*选择器 有好处也有弊端
好处 就是省事,弊端,就是因为太省事了,加大了浏览器的负荷。
解决办法 按需选择。
再来学习几个列表标签
1.无序列表 ul
(1)内部必须有子标签<li></li>
(2)ul天生自带内外边距(天生自带内外边距的还有p,hi-h6,ol)
2.有序列表 ol
(1)内部也必须有子标签<li></li>
(2)ol天生也自带内外边距
无序列表前面符号是形状,有序列表前面符号是序号
ul和ol不同之处就在前面符号的区别
ul想改前面的形状要用list-style:circle(空心圆)/disc(实心圆)/square(正方形)/none(空);
ol想改前面的序号要用标签属性 type 修改,无法使用样式标签修改
3.自定义列表 dl
dl中要用dt和dd(dt是小标题,dd是内容)
列表能做什么?
做二级菜单 做导航
备注
margin和padding问题的探讨
margin:200px;设置一个值 说明top right bottom left 都是200px
margin:200px 100p;设置两个值 上下是200px 左右是100px
margin:200px 50px 100px 上是200px 左右是50px 下是100px
margin:200px 50px 100px 50px; 上是200 右是50px 下是100px 左是50px
padding同上
实际占用的空间大小
通过分析我们发现 一个标签元素实际占用的空间是
width+border*2+padding*2+margin*2
一个标签元素的实际高度是
height+padding-top+padding-bittom+2 x border
同时还有一种情况需要注意:
margin的塌陷现象,即:
相邻两个块级元素同时设置margin是他们的外边距不会叠加,会取最大的外边距的值,这种现象叫做margin塌陷。
- CSS深入研究:display的恐怖故事解密(2) - table-cell
- HTML与CSS_基础 翁恺 笔记(2015 8.10更新)
- 动态加载css方法实现和深入解析
- CSS深入研究:display的恐怖故事解密(2) - table-cell(转)
- 关于CSS伪类first-child的深入理解
- 深入理解CSS中的margin负值
- 自己总结的CSS以及JS各种库的在线CDN引用地址,链接可以直接复制(不定期更新)
- 深入理解css中position属性及z-index属性(推荐)
- jetty无法即时更新html、js、css等静态文件的解决办法
- 前端(各种demo)一:css实现三角形,css实现梯形,pop弹层,css伪类before,after使用,svg使用(持续更新中)
- Styleneat帮助你容易阅读和更新CSS文件
- Spring MVC 教程,快速入门,深入分析――如何访问到静态的文件,如jpg,js,css?
- CSS提高网页的维护更新效率
- CSS(一)有用的CSS技巧(持续更新)
- 深入剖析CIF层通用job(持续更新)
- 常见的css兼容性问题---持续更新!!
- 动态加载css方法实现和深入解析
- css入门及深入了解
- Html/CSS margin的百分比 -》深入探讨
- CSS基础(六):浮动深入