关于Web的学习（18.5.18）——css篇

最新推荐文章于 2018-05-30 15:54:15 发布

转载最新推荐文章于 2018-05-30 15:54:15 发布 · 171 阅读

文章标签：

#CSS

web学习专栏收录该内容

26 篇文章

订阅专栏

本文详细介绍了CSS的标准盒子模型及其与IE盒子模型的区别、各种CSS选择器及可继承属性、CSS优先级算法、CSS3新增伪类等内容。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1.介绍一下标准的CSS的盒子模型？低版本IE的盒子模型有什么不同？

有两种，IE盒子模型、W3C盒子模型；
盒子模型：内容（content）、填充（padding）、边界（margin）、边框（border）；
区别：IE的content部分把border和padding计算了进去；

2.CSS选择符有哪些？哪些属性可以继承？

（1）选择符：（CSS选择器参考手册）

id选择器（#myid）
类选择器（.myclassname）
标签选择器（div，h1，p）
相邻选择器（h1+p）
子选择器（ul>li）
后代选择器（li a）
通配符选择器（*）
属性选择器（a[rel="external"]）
伪类选择器（a:hover，li:nth-child）

（2）可继承的样式：font-size font-family color，UL LI DL DD DT；

（3）不可继承的样式：border padding margin width height；

3.CSS优先级算法如何计算？

优先级就近原则，同权重情况下样式定义最近者为准；
载入样式以最后载入的定位为准;

优先级为：

同权重：内联样式表（标签内部）>嵌入样式表（当前文件中）>外部样式表（外部文件中）。
!important>id>class>tag，!important比内联优先级高

4.CSS3新增伪类有哪些？

举例：

p:first-of-type 选择属于其父元素的首个元素的每个元素。
p:last-of-type 选择属于其父元素的最后元素的每个元素。
p:only-of-type 选择属于其父元素唯一的元素的每个元素。
p:only-child 选择属于其父元素唯一子元素的每个元素。
p:nth-child(2) 选择属于器父元素的第二个子元素的每个元素。
:after 在元素之前添加内容，也可以用来做清除浮动。
:before 在元素之后添加内容
:enabled 选启用的
:disabled 选禁用的
:checked 被选中的