CSS进阶篇——类和ID选择器

Posted feelang

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了CSS进阶篇——类和ID选择器相关的知识,希望对你有一定的参考价值。

CSS 入门篇里,我们学会了如何使用 html 选择器。

这一篇继续讲解另外两种选择器 - classID,有了这两个选择器,我们就可以为同一类 HTML 标签指定不同的样式。

类选择器的名称以 . 开头,ID 选择器以 # 开头。

#top 
    background-color: #ccc;
    padding: 20px


.intro 
    color: red;
    font-weight: bold;

用法如下:

<div id="top">

<h1>Chocolate curry</h1>

<p class="intro">This is my recipe for making curry purely with chocolate</p>

<p class="intro">Mmm mm mmmmm</p>

</div>

ID 选择器和类选择器的不同之处是 ID 作用于某元素,而类 (class) 作用于某元素。

这两种选择可以与 HTML 选择器配合使用,比如 p.jam /* whatever */ ,只作用于 class 为 jam<p> 元素。

以上是关于CSS进阶篇——类和ID选择器的主要内容,如果未能解决你的问题,请参考以下文章

CSS进阶篇——更多选择器 (selectors)

如何在 CSS 选择器中组合类和 ID?

CSS进阶篇——伪类 (pseudo classes)

CSS进阶篇——伪类 (pseudo classes)

2 css篇

CSS--选择器