CSS 的选择器

2018-08-09  本文已影响8人  醉叶惜秋

CSS的量大重点

属性
通过属性的复杂叠加才能做出漂亮的网页
选择器
通过选择器找到对应的标签设置样式

标签选择器

根据标签名找到标签

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>CSS常见选择器</title>

    <style>
      /*-标签选择器-*/
        div{
            color: red;
        }
        p{
            color: blue;
        }

    </style>
</head>
<body>
<div>我是容器标签</div>
<div>我是容器标签</div>
<div>我是容器标签</div>

<p>我是段落标签</p>
<p>我是段落标签</p>
<p>我是段落标签</p>

</body>
</html>

类选择器

image.png

id 选择器

image.png

并列选择器

相当于 OC 中的“或”,只要满足一个条件即可


image.png
image.png

复合选择器

相当于 OC 的“与”


image.png

后代选择器

image.png

直接后代选择器

image.png

相邻兄弟选择器

image.png

属性选择器

image.png
image.png
image.png
上一篇下一篇

猜你喜欢

热点阅读