一天搞定CSS---终篇CSS总结

时间:2021-07-02 11:52:05

虽然说是一天搞定CSS,实际上也没有那么简单。只能说让你快速了解常见的CSS知识,解决基本的页面样式布局和设置。

每个独立的CSS知识点都比较简单,但是它们的应用非常灵活,特别是在综合应用中。

粗略说,大概也就十几个知识点:


1.CSS基本概念,以及分类

http://blog.csdn.net/baidu_37107022/article/details/71249345


2.表框border—粗细,样式,颜色

http://blog.csdn.net/baidu_37107022/article/details/71250059


3.背景background—背景颜色、背景图片以及定位、滚动、重复

http://blog.csdn.net/baidu_37107022/article/details/71250182


4.字体font—颜色、大小、字体类别、行高、粗细

http://blog.csdn.net/baidu_37107022/article/details/71271837


5.盒模型box—content、padding、border、margin

http://blog.csdn.net/baidu_37107022/article/details/71272900


6.文本text–颜色、缩进、单词间距

http://blog.csdn.net/baidu_37107022/article/details/71272560


7.CSS选择器—class、id、标签、群组、包含、通配符

http://blog.csdn.net/baidu_37107022/article/details/71440686


8.CSS选择器优先级–行间>id>class>标签>通配符

http://blog.csdn.net/baidu_37107022/article/details/71440766


9.样式初始化—淘宝样式初始化

http://blog.csdn.net/baidu_37107022/article/details/71440877


10.浮动float–left、right、none

http://blog.csdn.net/baidu_37107022/article/details/71515984


11.清除浮动float—浮动的缺点、浮动与inline-block区别

清除浮动:http://blog.csdn.net/baidu_37107022/article/details/71557806

浮动(float)的副作用:http://blog.csdn.net/baidu_37107022/article/details/71554283

浮动(float)与inline-block的区别:http://blog.csdn.net/baidu_37107022/article/details/71516634


12.overflow—子级溢出父级的问题处理,auto、hidden、visible、scroll

http://blog.csdn.net/baidu_37107022/article/details/71617407


13.两种布局—BFC和Layout

BFC布局与普通文档流布局比较:

http://blog.csdn.net/baidu_37107022/article/details/71634396

支持IE的Layout布局:http://blog.csdn.net/baidu_37107022/article/details/71640304


14.定位position—fixed,relative,absolute,static

http://blog.csdn.net/baidu_37107022/article/details/71642147


15.层级z-index

http://blog.csdn.net/baidu_37107022/article/details/71642885


16.表格table—table、thead、tbody、tfoot、tr、th、td

http://blog.csdn.net/baidu_37107022/article/details/71713281


17.表单form—input、label、textarea

http://blog.csdn.net/baidu_37107022/article/details/71713723