zoukankan      html  css  js  c++  java
  • CSS选择符总结

    一、类型选择符

    特点:

    1.所有的html标签都可以用作类型选择符

    2.可以选中当前结构里所有指定标签

    例:

    div{}    //选中所有div标签

    .nav a{}    //选中class类名名为"nav"中的所有a标签

    二、id选择符

    特点:

    1.具有唯一性,在一个页面中一个id类名只能对应一个标签    //通常用于搭建网页的外围结构

    例:

    <div id="nav"></div>    //给div标签起了一个id类名

    #nav{}    //选中id类名为"nav"的标签

    三、class选择符

    特点:

    1.一个元素可以有多个类名,多个元素也可以取同一个类名

    2.可以制定一类样式    //需要制定相同样式的标签取同一个class类名

    例:

    <div class="nav-con box"></div>    //给div标签起了两个class类名

    .nav-con{}    //选中class类名为"nav-con"的所有标签

    四、群组选择符

    特点:

    1.将多个选择器以逗号作为分隔的方式组成一组进行统一的样式制定

    例 :

    #nav,.box,p{100px;}    //将id类名为"nav"class类名为"box"和所有p标签的宽度制定为100像素

    五、包含选择器

    特点:

    1.通过父元素确定所要制定的那个子元素

    例:

    .nav .box{height:100px;}    //将class类名为"nav"中class类名为"box"的子元素的高度制定为100像素

    六、伪类选择器

    特点:

    1.满足某个条件则制定某种样式

    2.可用于制定"行为"

    例:

    a:link{color:#000;}    //链接未访问时字体颜色为黑色

    a:visited{color:#fff;}    //链接已访问时字体颜色为白色

    .box:hover{background:#ccc;}    //在鼠标滑到class类名为''box''的标签所占据的空间里时标签背景颜色变为灰色

    .box:active{100px;}    //在鼠标处于''class''类名为box的标签所占据的空间中按下时标签高度变为100像素

    七、通配符

    特点:

    1.可选中页面中的所有标签,通常用于制定统一样式

    例:

    *{margin:0;padding:0;}    //将所有标签的外部间距和内部间距制定为0像素

  • 相关阅读:
    tapestrydomain modelxdocletmaven
    单元测试与GUI
    Bitufo
    纪念
    郁闷的报表问题(2)
    wordpress 列表页脚加广告
    <转>程序员,都去写一写前端代码吧
    <转> 编写超级可读代码的15个最佳实践
    wordpress 如何移除管理后台仪表盘小工具
    php简易页面内调试技巧
  • 原文地址:https://www.cnblogs.com/Celsius-nav/p/12594572.html
Copyright © 2011-2022 走看看