zoukankan      html  css  js  c++  java
  • 2.CSS3选择器

    # 2.CSS3选择器
    - 新增的选择器
    1. 关系选择器
        E+F:下一个满足条件的兄弟元素节点
        E~F:与E元素同级的所有F元素节点
    2. 属性选择器
        E[attr~='val']:attr属性中存在一个独立的val值
        E[attr|='val']:attr属性中val开头或val-开头的
        E[attr^='val']:attr属性中val开头
        E[attr$='val']:attr属性中val结尾
        E[attr*='val']:attr属性存在val值
    3. 伪元素选择器
        //文本框中提示信息
        E::placeholder{//只能设置下面一个属性
            color:#ccc;
        }
        //选中后的效果
        E::selection{//只能设置下面三个属性
            color:#ccc;
            
            text-shadow:1px 2px black;
        }
    4. 伪类选择器:被选中元素的一种状态
        E:not(.demo)  class!='demo'的E元素  
        :root  根标签选择器。在HTML里,选择html节点  
        E:target  目标元素,多用于锚点 
        ----下面都要考虑其他同级元素,所以用的不多。是所有子元素
        E:first-child  子元素中第一个元素且是E元素
        E:last-child  子元素中最后一个元素且是E元素
        E:only-child  子元素中只有一个元素且是E元素
        E:nth-child(n)  子元素中第n个元素且是E元素
        E:nth-last-child(n)  子元素中倒数第n个元素且是E元素
        ----上面都要考虑其他同级元素,所以用的不多
        ----下面不考虑其他同级元素,只考虑匹配的元素
        E:first-of-type  子元素中第一个E元素
        E:last-of-type  子元素中最后一个E元素  
        E:only-of-type  子元素中只有一个E元素  
        E:nth-of-type(n)  子元素中第n个E元素素  
        E:nth-of-last-type(n)  子元素中倒数第n个E元素
        ----上面不考虑其他同级元素,只考虑匹配的元素
        E:empty  E元素中什么节点都没有(可以有注释)  
        E:checked  被选中的E元素  
        E:enabled  可以使用的E元素  
        E:disabled  带有disabled属性的E元素  
        E:read-only  带有readonly属性的E元素  
        E:read-write  带有readwrite属性的E元素  
     
    以上是markdown格式的笔记
  • 相关阅读:
    windows下启动数据库、创建数据表、角色等
    直播流的来源
    win10如何查看已保存的账号信息
    Tomcat+IDEA
    线程安全-Spring Bean 作用域类型(Scope)
    ECMAScript6学习-2.1let与const
    解决Mac上Android开发时adb连接不到手机问题
    8个不可不知的Mac OS X专用命令行工具(转)
    ios 中获得应用程序名称和版本号
    iPhone 6 图像渲染揭秘(转)
  • 原文地址:https://www.cnblogs.com/lanshanxiao/p/12907341.html
Copyright © 2011-2022 走看看