2.1css选择器作用

最新推荐文章于 2023-08-28 14:14:15 发布

这一片月

最新推荐文章于 2023-08-28 14:14:15 发布

阅读量134

点赞数 1

文章标签： CSS选择器样式 HTML标签统一样式差异化设置

本文链接：https://blog.csdn.net/qq_62865634/article/details/126076188

版权

提示：选择某个标签。

（1）、选择器（选对人）

（2）、样式修改（做对事）

选择器指用HTML标签名称作为选择器作用：

可以把选择器某一类标签全部选择出来，比如：

<div>和<span>

优点：

能把同一类型标签设置为统一样式

缺点：

不能只差异化设置，只选择全部当前标签

下面看一下效果：

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>选择器的作用</title>

    <style>
        /* 选择器表示：选择那个标签 */
        
        p {
            /* 这里选择的是段落标签“p” */
            color: green;
            /* 这里在改“p”标签选择器里面的颜色样式 */
            font-size: 30px;
            /* 这里在修改样式文字的像素 */
        }
        
        div {
            /* 这里选择的是独占一行标签“div” */
            color: pink;
            /* 这里在改“div”标签选择器里面的颜色样式 */
            font-size: 30px;
            /* 这里在修改样式文字的像素 */
        }
    </style>
</head>

<body>
    <h1>性别：</h1>
    <p>男孩子</p>
    <p>男孩子</p>
    <p>男孩子</p>
    <p>男孩子</p>


    <div>女孩子</div>
    <div>女孩子</div>
    <div>女孩子</div>
    <div>女孩子</div>

</body>

</html>

显示结果：