【css】class选择器基础用法

最新推荐文章于 2024-08-21 11:50:22 发布
最新推荐文章于 2024-08-21 11:50:22 发布
阅读量1k 收藏 5
点赞数
分类专栏： # css 文章标签： css 前端 html
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_31083947/article/details/130877483
版权

class选择器基础用法

.a

解释：class="a"的dom元素可以应用样式
在这里插入图片描述

.a .b （两个class中间有一个空格）

解释：表示class="a"的元素下的class="b"的子元素可以应用样式

在这里插入图片描述

.a.b （两个class中间没有空格）

解释：当前元素的class同时有a和b才能应用样式，即class="a b"的dom元素

在这里插入图片描述

.a,.b （两个class之间是逗号）

解释：class="a"或者class="b"的dom元素可以应用样式
在这里插入图片描述

尤成军军军
关注
专栏目录
css串联选择器和后代选择器使用方法
12-13
串联选择器：作用在同一个标签上 复制代码代码如下:<div class=”a” id =”qq”><span>look at the color</span></div> <p>css: #qq.a{….}   后代选择器：作用在不同标签上 复制代码代码如下:”qq”><span class=...
详解CSS3选择器的使用方法汇总
12-13
4 E.myclass是类class选择符(CSS1)：以class属性包含myclass的E对象作为选择符。5 E F：包含选择符(CSS1)：选择所有被E元素包含的F元素。CSS3新增的通用选择器：同级元素通用选择器：1 通用选择器E~F{}：匹配的是...
CSS-CLASS选择器
我就吃一口的BLOG
12-08 417
CSS-CLASS选择器 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>class类型选择器</title> <style type="text/css"> .class01{ color: blue; font-size: 30px; border: 1px solid yellow; } .class02{
css第三课：class选择器
YY的博客
08-26 8941
class选择器
CSS选择器
最新发布
qq_72013756的博客
08-21 1009
从零开始学前端
零基础CSS入门教程(4)——Class选择器
weixin_61808806的博客
12-07 1030
我们上一节课学习了元素选择器，并了解他的有点和缺点。我们如果有大量的相同元素标签，我们现在想让某一个元素标签出现效果。我们现在学习的元素标签满足不了，我们这小结学习一下我们最常用的class选择器。我们上一节讲到的内部样式，外部样式，行内样式就是对特定标签的选择，给它加上样式，算是标签选择 这一节我们要讲的选择器，就是选择一类标签给他们加上特定的样式，比如我们有6的div标签，我们只想给其中3个加上特定的样式，我们要是像上一节只能用行内样式一个一个加，因为都是div标签，我们要是选择给div标签加的话，那就
html 学习(css class选择器)
常思考->有目标->重实践->善反思
05-17 1010
http://www.jianshu.com/p/802afaab545b 一般情况下，css 根据class修改标签，js根据id修改标签。 .A.B.C 与 .A .B .C 与 .A,.B,.C的区别(ABC分别为标签的class name) .A.B.C 指同时包含三个class的标签.A .B .C 指在class 为A 的标签下的class 为B的标签下的class为C的
CSS .class 选择器
lengqingIT的博客
03-14 309
html用法 &lt;div class="div"&gt;&lt;/div&gt; css用法 .div{ height: 100px; width: 100px; background: red; }
css后代选择器使用方法实例
09-25
在这个例子中，我们将深入理解后代选择器的工作原理并探讨其使用方法。 首先，让我们分析给定的代码片段： ```html .father .child1, .child2 { border: 1px solid red; margin: 5px; } <div class=...
四种CSS常用的选择器使用方法和注意事项
12-04
1. 类选择器（Class选择器） 类选择器通过在元素前加上`.`符号来指定。例如，`.s1`就是一个类选择器，用来给具有该类名的元素应用样式。在CSS中，你可以这样使用： ```css .s1 { background-color: pink; font-...
CSS Class 选择器
weixin_30567471的博客
02-21 113
CSS Class 选择器 再<stype>标签内，通过class属性来对标签进行css样式配置 <html> <head> <!-- style 设置头部标签--> <style> /*.c1 添加样式 */ .c1{ background-c...
CSS class类型选择器
qq_27232945的博客
11-02 204
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style type="text/css"> .class1{ color: blue; font-size: 30px; border: 1px red solid; } .
零基础CSS入门教程(9)–class选择器
程序员大阳
10-17 4622
更多相关博文请查看【JavaWeb学习之路】 本文目录1. 前言2. 场景3. 使用方法4. 整体解析5. class选择器的优点6. 小结 1. 前言 前2片分别介绍了元素选择器、id选择器，其实这两种选择器还不是最常用的选择器。 最常用、使用频率最高、最受前端程序员欢迎的选择器，毫无疑问是class选择器。 为啥呢?因为元素选择器选择元素过于宽松，而id选择器过于严谨，class选择器面向某一类元素进行选择，实现了灵活度和广泛性的良好结合。 说的有点高深了，本篇就带大家伙了解下class选择器。 2.
CSS|类选择器
Alan_Lowe
07-25 758
CSS|类选择器 1.简介 类选择器的声明是一个’.'加上类名，大括号内写上样式，如： .style1{ color: red; background-color: aquamarine; border-radius: 15px; text-align: center; } 这样的话，style1这个类就把字体颜色改为了red，背景颜色改为了aquamarine…… 使用的时候只需要在标签中添加上class属性即可： <h1 class="style1">标题
[css选择器] 类选择器
weixin_36210698的博客
03-10 1767
类选择器 原文链接：类选择器 类选择器允许以一种独立于文档元素的方式来指定样式 类选择器允许以一种独立于文档元素的方式来指定样式。 该选择器可以单独使用，也可以与其他元素结合使用。 提示： 只有适当地标记文档后，才能使用这些选择器，所以使用这两种选择器通常需要先做上些构想和计划。要应用样式而不考虑具体设计的元素，最常用的方法就是使用类选择器。 修改 HTML 代码 在使用类选择器之前，需要修改具体...
css 选择器 详解
2301_76669854的博客
12-12 2272
使用。
CSS选择器2
Antoine__的博客
10-09 979
（入门学习1）（入门学习2）（入门学习3）（CSS选择器1）前面学习文章的链接我给大家放在这里哦，大家可以巩固学习前面我们学习了几个常用的选择器，今天我们一起接着学习。
CSS一个元素同时使用多个类选择器（class selector）
weixin_33982670的博客
12-08 3584
CSS类选择器参考手册 一个元素同时使用多个类选择器 CSS中类选择器用点号表示。实际项目中一个div元素为了能被多个样式表匹配到（样式复用），通常div的class中由好几段组成，如&lt;div class="user login"&gt;能被.user和.login两个选择器选中。如果这两个选择器中有相同的属性值，则该属性值先被改为.user中的值，再被改为.login中的值，即重复的属性以...
class选择器
ZhuaiWuKeTiDai的博客
08-01 473
.h1{ /class/ background:red; opacity :0.5 } h2{ /id/ background:rgba(255,0,0,2); } h3{ /标签选择器/ background:rgba(255,0,0,2); } *{ /全局选择器/ margin:0; padding:0; } div...
CSS选择器详解：基础到高级实例
本篇笔记详细介绍了CSS选择器的基本概念和使用方法，分为三个主要部分： 1. **基本选择器**： - **通用元素选择器(*)**：此选择器匹配文档中的所有元素，可用于清除默认样式或设置全局样式。 - **标签选择器(E)**...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

尤成军军军

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值