CSS中的选择器

最新推荐文章于 2024-03-09 13:40:17 发布

罗天旭

最新推荐文章于 2024-03-09 13:40:17 发布

阅读量85

点赞数

分类专栏： CSS

本文链接：https://blog.csdn.net/carrotluotian/article/details/103720385

版权

CSS 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>基础选择器之标签选择器</title>
    <style>
       <!--标签选择器：写上标签-->
        p {
           color: green;
       }
        div {
            color: pink;
        }
    </style>
</head>
<body>
    <p>男生</p>
    <p>男生</p>
    <p>男生</p>
    <div>女生</div>
    <div>女生</div>
    <div>女生</div>
</body>
</html>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>基础选择器之类选择器</title>
    <style>
        .red {
            color: red;
        }
    </style>
</head>
<body>
    <ul>
        <li class="red">冰雨</li>
        <li class="red">来生缘</li>
        <li>李香兰</li>
        <li>生僻字</li>
        <li>江南style</li>
    </ul>
    <div class="red">我也想变红色</div>
</body>
</html>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>基础选择器之id选择器</title>
    <style>
        /*只能调用一次，别人不能使用*/
        #pink{
            color: pink;
        }
    </style>
</head>
<body>
    <div id="pink">迈克尔杰克逊</div>
</body>
</html>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>基础选择器之通配符选择器</title>
    <style>
        * {
            color: pink;
        }
    </style>
</head>
<body>
    <div>我的</div>
    <span>我的</span>
    <ul>
        <li>还是我的</li>
    </ul>
</body>
</html>

罗天旭

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
1
评论
CSS中的选择器

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>基础选择器之标签选择器</title> <style>  p { ...
复制链接

扫一扫