美文网首页
【前端学习笔记】CSS 的选择符有哪些?哪些属性可以继承?优先级

【前端学习笔记】CSS 的选择符有哪些?哪些属性可以继承?优先级

作者: 花上 | 来源:发表于2018-11-18 17:44 被阅读3次

    CSS拥有的CSS选择符有如下。

    1、id选择器(#myid)

    2、类选择器(.myclassname)

    3、标签选择器(div,h1,p)

    4、相邻选择器(h1+p)

    5、子选择器(ul>li)

    6、后代选择器(li a)

    7、通配符选择器(*)

    8、属性选择器(a[rel="external"])

    9、伪类选择器(a:hover,li:nth-child)

    一、ID选择器

    语法:#myid

    说明:1、用于定义唯一ID属性值元素样式;2、格式:#选择符名称{样式列表};3、选择符名称必须和元素ID属性值完全相同,且区分大小写。

    二、类选择器

    语法:.className

    说明:1、用于选择特定类选择器;2、可以选择一个或以上的类选择;3、区分大小写。


    可继承的样式

    font-size、font-family、color、text-indent

    不可继承的样式

    border、padding、margin、width、height

    优先级

    优先级采用就近原则,同权重情况下样式定义以最近者为准

    载入样式

    载入样式以最后载入的定位为准


    优先级

    !important > id > class > tag

    !important 比内联优先级高,但内联比id要高。


    CSS 3新增伪类举例

    P:first-of-type 选择属于其父元素的首个 <p> 元素的每个 <p> 元素 

    p:last-of type选择属于其父元素的最后 <p> 元素的每个 <p> 元素

    p:only-of-type选择属于其父元素唯一的 <p> 元素的每个 <p> 元素

    p:only-child 选择属于其父元素的唯一子元素的每个 <p> 元素

    p:only-child(2)选择属于其父元素的第二个子元素的每个 <p> 元素

    :enabled :disabled 控制表单控件的禁用状态

    :checked 单选框或复选框被选中




    学习一门技能,就是一个自我成长的过程。我们必须经过反复练习和重重挫折,最终强壮起来。

    这个过程如果是成长,那么一定就是让自己满足的。

    时代在变化。如果有不变的东西,那就是变化本身。

    变化是我们时代的主旋律,我们也处在互联网巨变的前夜。

    保持自己改变的精神,是未来的第一竞争力。

    如果可以,请你和我同行!!一起探索互联网知识的边界!

    ——950307435—— 前端开发学习工作小屋——扫一扫,我们结伴而行——

    相关文章

      网友评论

          本文标题:【前端学习笔记】CSS 的选择符有哪些?哪些属性可以继承?优先级

          本文链接:https://www.haomeiwen.com/subject/shpgfqtx.html