美文网首页
CSS 的选择器

CSS 的选择器

作者: 醉叶惜秋 | 来源:发表于2018-08-09 10:44 被阅读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

相关文章

  • CSS选择器

    CSS 元素选择器CSS 选择器分组CSS 类选择器详解CSS ID 选择器详解CSS 属性选择器详解CSS 后代...

  • CSS选择器

    目录: CSS派生选择器 CSS元素选择器 CSS Id 和 Class选择器 CSS 属性选择器 CSS 派生选...

  • css选择器

    css选择器】 1.css属性选择器 2.css伪类选择器 3.css层次选择器

  • CSS 选择器

    CSS 选择器 CSS 基本选择器及其扩展 CSS 基本选择器 通配符选择器 * 元素选择器 使用标签的名称...

  • CSS选择器

    CSS选择器的作用 CSS 选择器用于定位我们想要给予样式的 HTML 元素。 CSS选择器的类型 CSS选择器大...

  • Sublime 学习web的css

    html + css + js css引用 css外部样式 css优先级 css的选择器 标签选择器 类选择器 i...

  • JQuery CSS选择器

    CSS普通选择器 选择器函数 CSS伪类选择器

  • CSS-选择器1-概述

    CSS选择器-系列文章 CSS选择器-系列文章下一节 CSS选择器2-类选择器CSS3参考手册

  • web前端面试题

    1.css有哪些选择符,它们的优先关系计算 CSS 元素选择器CSS 类选择器CSS ID 选择器CSS 属性选择...

  • web前端的面试题

    1.css有哪些选择符,它们的优先关系计算 CSS 元素选择器CSS 类选择器CSS ID 选择器CSS 属性选择...

网友评论

      本文标题:CSS 的选择器

      本文链接:https://www.haomeiwen.com/subject/qskqbftx.html