CSS选择器

派生选择器:

  • 派生选择器允许根据文档的上下文关系来确定某个标签的样式,合理地使用派生选择器使 HTML 代码变得更加整洁
    • 例如:
li h {
    font-style: italic;
    font-weight: normal;
  }
 <p>
   <h>
    我是粗体字,不是斜体字,因为我不在列表当中,所以这个规则对我不起作用
   </h></p> 
  <ol> 
   <li>
    <h>
     我是斜体字。这是因为 strong 元素位于 li 元素内。
    </h></li> 
   <li>我是正常的字体。</li> 
  </ol>   

上述代码效果如下:

运行效果

id选择器:

  • id 选择器可以为标有特定 id 的 HTML 元素指定特定的样式。
  • id 选择器以 "#" 来定义。
    例:给id为“red”的元素设置颜色为red
    #red {color:'red';}
    <p id = "red">red<p>

类选择器:

  • 因为类不是唯一的元素标识,类选择器可以同时为拥有同种类名的元素制定特定样式
  • 类选择器用"."来定义
    例:给类名为red的元素设置颜色为red
    .red{color:'red'}
<h1 class = "red">red</h1>
<h2 class = "red">red</h2>
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 1.CSS 元素选择器 最常见的 CSS 选择器是元素选择器。换句话说,文档的元素就是最基本的选择器。如果设置 H...
    饥人谷_小侯阅读 4,330评论 0 1
  • 一,CSS选择器常见的有几种? 答: 基础选择器 组合选择器 属性选择器 伪类选择器 伪元素选择器 基础选择器 组...
    kingBirds阅读 5,780评论 0 0
  • Part 1 :盒模型(box model) "every element in web design is a ...
    野味狼果阅读 4,134评论 1 11
  • 一、元素选择器 文档元素为最基本的选择器示例: 二、id选择器 id 选择器可以为标有特定 id 的 HTML 元...
    heheheyuanqing阅读 4,030评论 0 0
  • CSS选择器常见的有几种? 类型选择器(元素选择器): 后代选择器 上述选择器适用于那些应用范围广的一般样式。 I...
    coolheadedY阅读 3,638评论 1 2