HTML----类

最新推荐文章于 2024-02-09 05:30:00 发布

团子Y

最新推荐文章于 2024-02-09 05:30:00 发布

阅读量833

点赞数 1

分类专栏： HTML

本文链接：https://blog.csdn.net/qq_43778935/article/details/113739000

版权

html

HTML 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

HTML中的类是为了我们在样式设置时，方便使用的。
通过类可以将多个标签设置为相同的样式，也可以将标签中特定的类设置为特定的样式。
1、为不同标签使用相同样式
示例

<!DOCTYPE html>
<html>
<head>
    <style>
        .cities {
            background-color:black;
            color:white;
            margin:20px;
            padding:20px;
        }
    </style>
</head>

<body>

<div class="cities">
    <h2>第一段</h2>
    <p>这是第一段，这是第一段，这是第一段，这是第一段</p>
</div>

    <h2>第二段</h2>
    <p class="cities">这是第二段，这是第二段，这是第二段</p>


<div class="cities">
    <h2>第三段</h2>
    <p这是第三段，这是第三段，这是第三段，这是第三段</p>
</div>

</body>
</html>

在样式中定义对应样式后，在使用标签时指定标签的class即可将标签样式修改为对应的样式。
2、为特定标签设置特定的样式
示例：

<!DOCTYPE html>
<html>
<head>
    <style>
        span.red {color:red;}
        span.green {color:green;}
    </style>
</head>
<body>

<h1>My <span class="red">Important</span> <span class="green">Heading</span></h1>
<span>没有特殊样式的span标签</span>

</body>
</html>