zoukankan      html  css  js  c++  java
  • CSS系列(7)CSS类选择器Class详解

    这一篇文章,以笔记形式写。

     

    1,  CSS 类选择器详解

    http://www.w3school.com.cn/css/css_selector_class.asp

    知识点:

    (1)    使用类选择器的前提是给标签添加上类属性,比如<p class="important"></p>

    (2)    类选择器的语法为:*.important {color:red;},不过一般省略前面的通配符选择器,写成 .important {color:red;},这样就会给所有带有class="important"的标签添加样式。

    (3)    给具有某类class的标签应用样式,比如 p.important {color:red;} 这里只会匹配标签为p且class=” important”的元素。

    (4)    给一个标签设置多个类,这些类的样式都会应用到这个标签上。比如:

    <p class="important warning">

    This paragraph is a very important warning.

    </p>

    P标签同时具有类important和warning,不分前后。

    样式为:

    .important {font-weight:bold;}  设置为粗体

    .warning {font-style:italic;}   设置为斜体

    这个段落p就会同时是粗体和斜体。

    (5)讲两个类写到一起,不分前后顺序,就会匹配同时包含两个类的元素,比如:

    .important.warning {background:silver;} 设置背景为银色

    这个选择器会匹配同时具有类important和warning的元素。

    (6)第4和第5就是所谓的”多类选择器”,文章中说, IE7 之前的版本中,不同平台的 Internet Explorer 都不能正确地处理多类选择器。

    不过,我在IE6、7、8上测试过,都没有问题。

    2,  类选择器class和ID选择器的差别

    http://www.w3school.com.cn/css/css_selector_id.asp

    知识点:

    (1)    ID选择器只能在文档中使用一次

    可以搜索文章【为什么html标签的id必须唯一】

     http://jingyan.baidu.com/article/fea4511a732139f7bb912529.html

    (2)    不能使用 ID 词列表,即不能像多类选择器那样 .red.bold 可以选择同时具有类red和bold的标签,#red#bold这是不允许的。

    (3)    ID 能包含更多含义,比如id= “mostImportant” 代表是“最重要的”,这是唯一的;而class=” important” 代表“重要的”,可能有很多。

  • 相关阅读:
    SQLite 的连接串
    输入数组长度大于此表中的列数
    MVC3.0入门学习笔记页面传值ViewData
    MVC3.0入门学习笔记页面传值TempData
    在控制台程序中显示进度
    WCF学习笔记(1) 一个简单的wcf实例
    webBrowser 操作无ID元素
    webBrowser 设置文本框
    cookie总结
    checkbox是否被选择
  • 原文地址:https://www.cnblogs.com/workest/p/3945910.html
Copyright © 2011-2022 走看看