CSS ID选择器

可以针对指定ID的HTML元素设置样式。

注：一个HTML页面，ID不能重复。

1 基本步骤

第1步：定义id样式

#id值{
 样式内容
}

id值前面有#，表示id选择器；

第2步：为HTML元素设置id属性为上述值。

<标签 id="id值">

id值需要与第1步的class值对应，这里不用#；

这两步先后无所谓，id值对应即可。

2 示例

通过id选择器实现歌词标题的样式设置。

代码

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8" >
    <title>css ID选择器  例子 | 关关教程</title>

    <style>
        #title{
            color:#f00;
            font-weight: 700;
        }
    </style>
</head>

<body>

    <h1 id="title">罗刹海市 — 刀郎</h1>
    <div>未曾开言先转腚</div>
    <div>每一日蹲窝里把蛋来卧</div>
    <div>老粉嘴多半辈儿以为自己是只鸡</div>
    <div>那马户不知道他是一头驴</div>
    <div>那又鸟不知道他是一只鸡</div>
    <div>勾栏从来扮高雅</div>
    <div>自古公公好威名</div>    
        
</body>

</html>

❮上一节 CSS 类选择器下一节 CSS 注释❯

第06章 CSS基础教程

CSS ID选择器

1 基本步骤

2 示例

html教程