1.标签选择器
解释：是针对一个标签做的样式，它会将匹配的所有标签都发生改变
语法格式：标签名{
             css样式代码
           }
2.类选择器
特点：1.可以给某一个标签标记为一类，设定css样式，比较灵活
     2.类目可以以，字母、数字、下划线、中划线组成，但不能以数字或中划线开头
　　　3.一个标签可以同时有多个类名，用空格隔开即可
　　　4.一个类选择器可以拥有多个标签，效果同时生效
   //使用方法和语法
   <style>

        .red{

            color: red;

        }

        .yellow {

            color: yellow;

        }

        .blue{

            color: blue;

        }

    </style>

</head>

<body>

    <p class="red">红姐</p>

    <p class="yellow">大黄</p>

    <p class="blue">小蓝</p>

</body>

</html>

3.id选择器

特点：1.id是唯一的，一个页面中只能出现一次，类似身份证

2.一个id 号，只能拥有一个标签

使用方法如下：

<style>

        #red{

            color: red;

        }

        #yellow {

            color: yellow;

        }

        #blue{

            color: blue;

        }

    </style>

</head>

<body>

    <p id="red">红姐</p>

    <p id="yellow">大黄</p>

    <p id="blue">小蓝</p>

</body>

</html>

4.通配符选择器

语法:*{

       css语句

      }

通常用在去除padding和margin

　　

　　

css 基础 选择器的使用的更多相关文章

  1. CSS基础选择器(选择器的优先级)，CSS样式块( 长度/颜色/显示方式/文本样式),盒模型组成，盒模型-block，盒模型布局

    CSS基础选择器 (1)id选择器:   #       =>  标签拥有 id="user"  属性 <style> #user { width: 200px; ...

  2. Python 45 长度及颜色单位 、字体样式 、文本样式 、背景样式 、css基础选择器

    一:长度及颜色单位   长度单位       px(像素)        in(英寸)       pt(点),一个标准的长度单位,1pt = 1/72in       mm(毫米)       cm ...

  3. CSS入门（css简介与样式汇总、CSS的使用方式和特征、CSS基础选择器和复杂选择器、边框阴影）

    一.CSS的作用 1.以统一的方式实现样式的定义 2.提高页面样式的可重用性和可维护性 3.实现了内容(HTML)和表示(CSS)的分离 HTML和CSS之间有什么关系? HTML:构建网页的结构 C ...

  4. 0009 CSS基础选择器（ 标签、类、id、通配符）

    typora-copy-images-to: media 第01阶段.前端基础.CSS基础选择器 CSS选择器(重点) 学习目标: 理解 能说出选择器的作用 id选择器和类选择器的区别 应用 能够使用 ...

  5. 2020年12月-第02阶段-前端基础-CSS基础选择器

    CSS选择器(重点) 理解 能说出选择器的作用 id选择器和类选择器的区别 1. CSS选择器作用(重点) 如上图所以,要把里面的小黄人分为2组,最快的方法怎办? 很多, 比如 一只眼睛的一组,剩下的 ...

  6. css 基础---选择器

    1.css基础 selector {property: value} eg: h1 {color:red; font-size:14px;} p { text-align: center; color ...

  7. CSS【03】：CSS 基础选择器与三种引入方式

    基础选择器 选择器:css 选择 html 标签的一个工具,是将 css 与 html 建立起联系,那么 css 就可以控制 html 样式 选择器其实就是给 html 标签起名字 标签选择器 作用: ...

  8. WEB学习-CSS基础选择器

    基础选择器 标签选择器 就是标签的名字. • <h1>前端与移动开发<span>1期班</span>基础班</h1> css: • <style ...

  9. CSS基础选择器总结

    基础选择器 作用 特点 使用情况 用法 标签选择器 可以选出所有相同的标签,比如p 不能差异化选择 较多 p {color:red;} 类选择器 可以选出1个或多个标签 可以根据需求选择 非常多 .n ...

  10. CSS 基础 选择器的使用汇总

    1.后代选择器 html 结构 <div class='father'> <p>小哥哥 小姐姐</p> <div> <p>小帅锅</p ...

随机推荐

  1. ganglia -api

    setup 命令: virtualenv ve source ve/bin/activate pip install -r requirements.txt python ganglia/gangli ...

  2. SpringMVC(2)：JSON

    一,JSON 介绍 JSON (JavaScript Object Notation, JS 对象简谱) 是一种轻量级的数据交换格式.易于人阅读和编写,同时也易于机器解析和生成,并有效地提升网络传输效 ...

  3. Taro 3.5 canary 发布：支持适配 鸿蒙

    一.背景 鸿蒙作为华为自研开发的一款可以实现万物互联的操作系统,一经推出就受到了很大的关注,被国人寄予了厚望.而鸿蒙也没让人失望,今年 Harmony2.0 正式推出供用户进行升级之后,在短短的三个月 ...

  4. JDK的简介，卸载和安装过程

    JDK的简介,卸载和安装过程 JDK JRE JVM JDK:Java Development Kit JRE:Java Runtime Environment JVM:Java Virtual Ma ...

  5. Android: Client-Server communication

    Refer to: http://osamashabrez.com/simple-client-server-communication-in-android/ I was working of an ...

  6. dart系列之:实时通讯,在浏览器中使用WebSockets

    目录 简介 dart:html中的WebSockets 创建一个WebSocket WebSocket的状态 发送消息 处理WebSocket事件 总结 简介 web客户端和服务器端通信有两种方式,一 ...

  7. LuoguP7892 『JROI-3』R.I.P. 题解

    Update \(\texttt{2021.10.11}\) 修改了一处公式错误,麻烦管理重新审核一下这篇已审核通过文章. Content 你在一个无限大的格子平面上,并且有 \(m\) 个长度为 \ ...

  8. CF628B New Skateboard 题解

    Content 有一个长度为 \(n\) 的数字串 \(s\),求出有多少个子串能够被 \(4\) 整除. 数据范围:\(1\leqslant n\leqslant 3\times 10^5\). S ...

  9. CF1076B Divisor Subtraction 题解

    Content 给定一个数 \(n\),执行如下操作: 如果 \(n=0\) 结束操作. 找到 \(n\) 的最小质因子 \(d\). \(n\leftarrow n-d\) 并跳到操作 \(1\). ...

  10. 缓存系统redis操作、mongdb、memeche

    mongdb :默认数据持久化,存在内存的同时也向硬盘写数据. redis:可配置数据持久化,默认数据在内存中 memeche:only support 内存模式 redis操作 https://ww ...