-
2019-12-20 23:54:06
类选择器前面使用符号.
(1)基本使用
为了将类选择器的样式与元素关联,必须将 class 指定为一个适当的值。例如:<h1 class="important">This heading is very important.</h1> <p class="important">This paragraph is very important.</p > <div class="box"></div > <style> .important {color:red;} </style>
这样定义后,class为important的h1和p标签的字体颜色也就都是红色。
在样式表中定义:(2)结合元素选择器
类选择器可以结合元素选择器来使用。例如,您可能希望只有段落显示为红色文本:
p.important {color:red;}
这个样式表示的是,所有class为important ,且为p标签的元素中的字体为红色。其他标签的无效。
(3)CSS 多类选择器
一个标签可以定义多class,则这个标签有这多个class的所有属性,例如:<p class="important warning">This paragraph is a very important warning.</p > <style> .important {font-weight:bold;} .warning {color:red;} </style>
例子中为p标签定义了important和warning两个class,所以p标签的字体是加粗且字体颜色是红色的。
更多相关内容 -
类选择器和ID选择器的区别
2020-12-24 18:01:18与类不同,在一个 HTML 文档中,ID 选择器会使用一次,而且仅一次。 下面代码是正确的: <p> 三年级时,我还是一个 <span class="stress">胆小如鼠</span> 的小女孩,上课从来不敢回答老师提出的...区别 1:
与类不同,在一个 HTML 文档中,ID 选择器会使用一次,而且仅一次。
下面代码是正确的:
<p> 三年级时,我还是一个 <span class="stress">胆小如鼠</span> 的小女孩,上课从来不敢回答老师提出的问题,生怕回答错了老师会批评我。就一直没有这个 <span class="stress">勇气</span> 来回答老师提出的问题。 </p>
而下面代码是错误的:
<p> 三年级时,我还是一个 <span id="stress">胆小如鼠</span> 的小女孩,上课从来不敢回答老师提出的问题,生怕回答错了老师会批评我。就一直没有这个 <span id="stress">勇气</span> 来回答老师提出的问题。 </p>
区别 2:
不同于类选择器,ID 选择器不能结合使用,因为 ID 属性不允许有以空格分隔的词列表。
下面代码正确:
.stress{ color:red; } .bigsize{ font-size:25px; } <p>到了<span class="stress bigsize">三年级</span>下学期时,我们班上了一节公开课...</p>
而下面代码是错误的:
#stressid{ color:red; } #bigsizeid{ font-size:25px; } <p>到了<span id="stressid bigsizeid">三年级</span>下学期时,我们班上了一节公开课...</p>
区别 3:ID 能包含更多含义
类似于类,可以独立于元素来选择 ID。有些情况下,您知道文档中会出现某个特定 ID 值,但是并不知道它会出现在哪个元素上,所以您想声明独立的 ID 选择器。例如,您可能知道在一个给定的文档中会有一个 ID 值为 mostImportant 的元素。您不知道这个最重要的东西是一个段落、一个短语、一个列表项还是一个小节标题。您只知道每个文档都会有这么一个最重要的内容,它可能在任何元素中,而且只能出现一个。在这种情况下,可以编写如下规则:
注意:
标准中说id必须是唯一的,并且不能包含空格。如果加了空格,违反了标准,通过就id获取不到该元素。所以CSS和js都不会起作用。而class则没有这个限制
-
CSS常用选择器(通配符选择器,标签选择器,类选择器,id选择器.....),你知道多少?
2020-03-07 15:20:58CSS常用选择器 CSS选择器的作用是从HTML页面中找出特定的某类元素,而常用的CSS选择器有如下几类,一起来看看吧!...使用该选择器定义样式,清除所有HTML标记的默认边距。 *{ margin:0; /*定义...CSS常用选择器
CSS选择器的作用是从HTML页面中找出特定的某类元素,而常用的CSS选择器有如下几类,一起来看看吧!
一、通配符选择器
通配符选择器常用 ‘*’ 号表示,它是所有选择器里作用范围最广的,能匹配页面中所有的元素。
基本语法格式:*{ 属性1:属性值1;属性2:属性值2;}
例子
使用该选择器定义样式,清除所有HTML标记的默认边距。*{ margin:0; /*定义外边距*/ padding:0; /*定义内边距*/ }
但实际开发中不建议使用通配符选择器,因为它设置的样式对所有的HTML标记都生效,不管标记是否需要该样式,反而降低了代码的执行速度。
二、标签选择器
标签选择器是指用HTML标记名称作为选择器,按标记名称分类,为页面中某一类标签指定统一的CSS样式。
基本语法格式:标签名{ 属性1:属性值1;属性2:属性值2;}
所有的HTML标记名都可以作为标签选择器,例如a、body、p、h1等等。用标签选择器定义的样式对页面中该类型的所有标签都有效。
例子
使用p选择器定义HTML页面中所有段落的样式。p{ font-size: 12px; color: #666; font-family:"微软雅黑"; }
标签选择器最大的优势是能快速为页面中同类型的标签统一样式,同时这也是它的缺点,不能设计差异化样式。
三、类选择器
类选择器使用**‘.’**(英文点号)进行标识,后面紧跟类名。
基本语法格式:.类名{ 属性1:属性值1;属性2:属性值2;}
该语法中,类名即为HTML元素的class属性值,大多数HTML元素都可以定义class属性。
例子
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>类选择器</title> 6 <style type="text/css"> 7 .red{color: red;} 8 .green{color:green;} 9 .font22{font-size:22px;} 10 p{ text-decoration:underline; font- family:"微软雅黑"; } 11 </style> 12 </head> 13 <body> 14 <h2 class="red">二级标题文本</h2> 15 <p class-"green font22">段落文本内容</p> 16 <p class="red font22">段落二文本内容</p> 17 <p>段落三文本内容</p> 18 </body> 19 </html>
类选择器最大的优点是可以为元素对象定义单独或相同的样式,而且多个标记可以使用同一个类名,可以实现为不同类型的标记指定相同的样式。同时,一个HTML元素也可以应用多个class类,设置多个样式,此时多个类名之间需要用空格隔开,如上述代码中的前两个
<p>
标记。注意:类名的第一个字符不能使用数字,并且严格区分大小写。一般采用小写的英文字符。
四、id选择器
id选择器使用**‘#’**进行标识,后面紧跟id名。
基本语法格式:#id名{ 属性1:属性值1;属性2:属性值2;}
该语法中,id名即为HTML元素的id属性值,大多数HTML元素都可以定义id属性,元素的id值是唯一的,只能对应于文档中某一个具体的元素。
例子
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>id选择器</title> 6 <style type="text/css"> 7 #bold{font -weight:bold; } 8 #font24 {font-size:24px; } 9 </style> 10 </head> 11 <body> 12 <pidf"bold">段落1: id="bold",设置粗体文字。</p> 13 <p id="font24">段落2: id="font24", 设置字号为24px。</p> 14 <p id="font24">段落3: id="font24", 设置字号为24px。</p> 15 <pid="bold font24">段落4: id="bold font24",同时设置粗体和字号24px。</p> 16 </body> 17 </html>
注意:同一个id不允许应用于多个标记,虽然很多浏览器并不会报错,但JavaScript等脚本语言调用id时会出错。另外,id选择器不支持像类选择器那样定义多个值。
五、属性选择器
属性选择器可以为拥有指定属性的 HTML 元素设置样式,而不仅限于 class 和 id 属性。
语法格式:[标签名称] { 属性1:属性值1;属性2:属性值2;}
注意:只有在规定了 !DOCTYPE 时,IE7 和 IE8 才支持属性选择器。在 IE6 及更低的版本中,不支持属性选择。
CSS 选择器参考手册:
选择器 描述 [attribute] 用于选取带有指定属性的元素 [attribute=value] 用于选取带有指定属性和值的元素 [attribute~=value] 用于选取属性值中包含指定词汇的元素 [attributeI=value] 用于选取带有以指定值开头的属性值的元素,该值必须是整个单词 [attribute^=value] 匹配属性值以指定值开头的每个元素 [attribute$=value] 匹配属性值以指定值结尾的每个元素 [attribute*=value] 匹配属性值中包含指定值的每个元素 例子
1、为带有 title 属性的所有元素设置样式:
[title] { color:red; }
2、为 title=“W3School” 的所有元素设置样式:
[title=W3School] { border:5px solid blue; }
3、为包含指定值的 title 属性的所有元素设置样式。适用于由空格分隔的属性值:
[title~=hello] { color:red; }
4、为带有包含指定值的 lang 属性的所有元素设置样式。适用于由连字符分隔的属性值:
[lang|=en] { color:red; }
5、设置表单的样式
属性选择器在为不带有 class 或 id 的表单设置样式时特别有用:input[type="text"] { width:150px; display:block; margin-bottom:10px; background-color:yellow; font-family: Verdana, Arial; } input[type="button"] { width:120px; margin-left:35px; display:block; font-family: Verdana, Arial; }
使用属性选择器,可以只指定元素的某个属性,还可以同时指定元素的某个属性和其对应的属性值。
六、并集选择器
并集选择器是同时匹配多个选择器,取多个选择器的并集,选择器之间用逗号隔开,如em,strong{ }。
语法格式:
标签名称1,标签名称2 { 属性1:属性值1;属性2:属性值2;}例子
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta name="author" content="https://www.cnblogs.com/jizuiku"/> <title></title> <style type="text/css"> span,div, .content { color:darkorange; } </style> </head> <body> <span>博客园</span> <div>给最苦</div> <p class="content">网页设计</p> </body> </html>
并集选择器的优点是将多个标签的相同样式 提取出来,集体声明,优化代码,方便阅读。
七、后代选择器
后代选择器也称包含选择器,用来选择特定元素的后代。如.asideNav li{ },表示先匹配第二个选择器的元素,并属于第一个选择器内。
语法格式:
标签名称1 标签名称2{ 属性1:属性值1;属性2:属性值2;}在CSS中,后代是根据HTML文档中的DOM上下文来决定的。当元素发生嵌套时,内层的元素就成为外层元素的后代。如元素B嵌在元素A内部,B就是A的后代。而且,B的后代也是A的后代,就像家族关系。
定义后代选择器时,外层的元素写在前面,内层的元素写在后面,中间用空格分隔。后代选择器会影响到它的各级后代,没有层级限制。如:
div p { color: red; }
上述选择器中,div 为祖先元素,p 为后代元素,其作用就是选择 div 元素的所有后代 p元素,不管 p 元素是 div 元素的子元素、孙辈元素或者更深层次的关系,都将被选中。换句话说,不论 p 是 div 的多少辈的后代,p 元素中的文本都会变成红色。
例子
后代选择器中的空格,是用来表示后代层级的,当然就不限于二级的。根据需要,从任一个祖先元素开始,直到想应用样式的那个元素,都可以被放到后代选择器链中。如:
<ul> <li><a href="/home/">首页</a></li> <li><a href="/new/">新房</a></li> <li><a href="/esf/">二手房</a></li> <ul> <li><a href="/sale/">出售房源</a></li> <li><a href="/buy/">求购房源</a></li> </ul> <li><a href="/rent/">租房</a></li> </ul>
上述导航菜单中,假如希望所有锚文本的字体大小是16px,就可以通过后代选择器ul a来选择 ul 元素的所有后代,因为后代选择器会影响到它的各级后代。如:
ul a { font-size: 16px; }
假如又希望第二级列表项的锚文本的字体大小是12px,就可以通过ul.nav ul a的这种多层后代关系的后代选择器,它只选择第二级列表项的锚文本。
ul li a { font-size: 12px; }
当然,这个后代选择器也可以写成ul、li、ul、li、a,以实现更精准的控制。
注意:
1、后代包括儿子,孙子,只要是放在指定标签的后代都是。
2、也可以不用标签名称1、2,也可以用id和class名,分别用id和class来选择。
3、后代选择器可以无限衍生。八、子代选择器
子代选择器使用**‘>’**表示,如ul>li{ },表示匹配第二个选择器,且为第一个选择器的元素的后代。
语法格式:
标签名称1>标签名称2{ 属性1:属性值1;属性2:属性值2;}例子
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>实例</title> <style> #box>p{ color: darkorange; /*设置颜色为 深橙色*/ font-size: 80px; } </style> </head> <body> <div id="box"> <div> <div> <div> <p> 狸花猫 </p> </div> </div> </div> <p> 大橘猫 </p> </div> </body> </body> </html>
注意:
1、只会查找儿子,不会查找其他被嵌套的标签。
2、子元素选择器也可以用其他的id和class选择器来进行查找。 3、子元素选择器也可以通过>符号一直延续下去。九、兄弟选择器(+和~)
相邻兄弟选择器使用+号表示,如p+a{ },表示匹配紧跟第一个选择器并匹配第二个选择器的元素,如紧跟p元素后的a的元素。
如果需要选择紧接在另一个元素后的元素,而且二者有相同的父元素,可以使用相邻兄弟选择器。语法格式:标签名称1+标签名称2 { 属性1:属性值1;属性2:属性值2;}
例子
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> h1 + p { margin-top:50px; color:red; } </style> </head> <body> <p>This is paragraph.</p> <h1>This is a heading.</h1> <p>This is paragraph.</p> <p>This is paragraph.</p> </body> </html>
兄弟只会影响下面的p标签的样式,不影响上面兄弟的样式。
注意这里的’+’的意义跟’and’意义不一样,兄弟选择器的样式是应用在兄弟元素上,跟参照的元素样式无关,如上例只影响p元素的样式,而不影响h1标签的样式。
当两个兄弟元素相同时,会实现一次循环查找:<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> li + li { color:red; } </style> </head> <body> <div> <ul> <li>List item 1</li> <li>List item 2</li> <li>List item 3</li> </ul> </div> </body> </html>
而~ 选择器 :作用是查找某一个指定元素的后面的所有兄弟结点。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> h1 ~ p{ color:red; } </style> </head> <body> <p>1</p> <h1>2</h1> <p>3</p> <p>4</p> <p>5</p> </body> </html>
十、伪选择器
伪选择器是一种特殊的选择器,它分为伪类选择器和伪对象选择器2种。1.伪类选择器:
CSS提供了五种基本伪类选择器,分别对应HTML标记的五种状态。伪类选择器 作用 应用对象 :hover 定义标记在鼠标悬停(划过)时的样式 所有显示标记 :link 定义标记在超链接状态下的样式 a标签 :focus 定义标记在获取焦点时的样式 a标签(IE浏览器不支持) :visited 定义标记被访问过后的样式 a标签 :active 定义标记在选定时刻下的样式 a标签 例子
以下是5个a标签
<a href="#" id="a1">链接1</a> <a href="#" id="a2">链接2</a> <a href="#" id="a3">链接3</a> <a href="#" id="a4">链接4</a> <a href="#" id="a5">链接5</a>
加点CSS样式:
a{ padding: 10px; color:black; /*初始颜色全为黑色*/ font-weight: bold; } #a1:hover{ color:red; /*当鼠标悬停时链接1变成红色*/ } #a2:link{ background-color: blue; /*给链接2添加蓝色的背景色*/ } #a3:focus{ color:yellow; /*当链接3获取焦点时变为黄色,失去焦点时恢复黑色*/ } #a4:visited{ color:green; /*被访问过后的链接4变为绿色*/ } #a5:active{ background-color: blue; /*鼠标点击的那一瞬间给链接5添加蓝色的背景*/ }
除了以上五种基本伪类选择器之外,CSS还支持诸如:”:first-child“首元素选择器和“:lang()”语言选择器等伪类选择器。
2.伪对象选择器
伪对象选择器根据对象内部的局部元素定义其样式。伪对象选择器 作用 :first-letter 定义文本的第一个字符样式 :first-line 定义文本的首行样式 :before 定义对象之前内容的样式 :after 定义对象之后内容的样式 例子
<p>我是文本我是文本我是文本我是文本</p>
使用:before和:after样式后:
p:before{ content:'我说:“';/*在文本前面追加内容*/ color:red; } p:after{ content:'。”我说完了!';/*在文本结尾追加内容*/ color:red; }
以上就是CSS常见的选择器啦,你记住了吗?
^_^
-
HTML中的标签选择器、类选择器、ID选择器等之间的区别
2020-09-07 17:48:58HTML中选择器 1. 标签选择器 一个HTML文件由很多不同的标签组成,利用标签选择器可以统一设置使用...定义类选择器时,需要在类名称前面加一个“.”。 语法如下: .类名{样式属性:取值:样式取值:取值:…} 实例如下HTML中选择器
1. 标签选择器
一个HTML文件由很多不同的标签组成,利用标签选择器可以统一设置使用某类标签定义的元素的外观。
例如:text-align:center; font-size:42px; color:#FF6600;
2.类选择器(class)
使用类选择器可以相同或不同的标签分类设置不同的样式。定义类选择器时,需要在类名称前面加一个“.”。
语法如下:.类名{样式属性:取值:样式取值:取值:…}
实例如下:
<html> <head> <title>class选择器</title> <style type="text/css"> <!-- .one{ /*类名为one的类选择器*/ color:red; /*文字颜色为红色*/ font-size:18px; /*文字大小为18像素*/ } --> </style> </head> <body> <p class="one">精彩阿鑫很6</p> </body> </html>
3.id选择器
id选择器用来对单个元素设置单独的样式,在同一html文件中,id不能重复。定义id选择器时,需要在id名称前面加一个#号。
语法如下:.id名{样式属性:取值:样式属性:取值:…}
<html> <head> <title>class选择器</title> <style type="text/css"> <!-- #one{ /*类名为one的类选择器*/ color:red; /*文字颜色为红色*/ font-size:18px; /*文字大小为18像素*/ } --> </style> </head> <body> <p id="one">精彩阿鑫很6</p> </body> </html>
4.通用选择器
通用选择器是一种特殊类型的选择器,它用星号*来表示选择器是名称,可以定义所有网页元素的显示格式。
如:*{margin:0; padding:0; }
欢迎大家赞赏阿鑫的CSDN博客 喜欢点赞记得关注!!!!!
-
CSS的四种基本选择器和四种高级选择器
2018-07-11 13:48:38CSS的选择器分为两大类:基本选择题和扩展选择器。 基本选择器: 标签选择器:针对一类标签 ID选择器:针对某一个特定的标签使用 类选择器:针对你想要的所有标签使用 通用选择器(通配符):针对所有的标签都... -
【CSS】标签选择器、类选择器和ID选择器的区别
2019-03-26 20:17:241.标签选择器 标签选择器中的“标签”指的是HTML标签,such as:a、span、div、p、li、img等。 格式举例: .... div{backgroud-color:red; font-size:16px;...2.类选择器 class 选择器用于... -
类选择器和ID选择器
2017-01-12 16:46:05什么是选择器? 每一条css样式声明(定义)由两部分组成,形式如下: 选择器{样式;} 在{}之前的部分就是“选择器”,“选择器”指明了{}中的“样式”的作用对象,也...2.类选择器名称可以任意起名(但是不能用中文) -
CSS 三种基础选择器
2020-08-28 13:06:08在 CSS 中三三种最基本的选择器,分别是标签选择器、类选择器(class)、ID选择器。 我们知道在 HTML 页面中引入 CSS 样式最好的方法是引入外部样式,也就是将 CSS 代码单独放置到一个 .css 文件内,然后再引入这个 ... -
类选择器与id选择器的使用与区别
2019-04-01 12:46:28类选择器 ...类选择器最大的优势是可以为元素对象定义单独或相同的样式。 小技巧: 1.长名称或词组可以使用中横线来为选择器命名。 2.不建议使用“_”下划线来命名CSS选择器。 输入的时候少按一个sh... -
CSS3选择器--结构性伪类选择器
2017-01-01 21:51:20在学习结构性伪类选择器... 常用的伪类选择器是使用在a元素上的几种,如a:link|a:visited|a:hover|a:active 2、伪元素选择器:并不是针对真正的元素使用的选择器,而是针对CSS中已经定义好的伪元素使用的选择器 C -
CSS 的 类class选择器 的正确写法
2017-12-01 10:16:59}下面的简写,尽量少用.a_class {color:red;}2.举例举例:p.a_class {}解释为:“其 class 属性值为 a_class 的所有段落”。举例2:*.a_class {}解释为:“其 class 属性值为 a_class 的所有任意标签”。3.多层类... -
选择器的优先级和伪类的顺序
2018-09-20 11:00:401.选择器的优先级 (1)样式的继承 像儿子可以继承父亲的财产一样,在CSS中,祖先元素上的样式也会别后代元素所继承,利用继承可以将一些基本的样式设置给祖先元素,这样所有的后代元素将会继承这些样式。继承时对... -
CSS基础选择器(标签选择器、类选择器、多类名选择器、 id选择器、通配符选择器、属性选择器)
2019-06-06 11:08:05标签选择器是指用HTML标签名称作为选择器,按标签名称分类,为页面中某一类标签指定统一的CSS样式。其基本语法格式如下: 标签名{属性1:属性值1; 属性2:属性值2; 属性3:属性值3; } 或者 元素名{属性1:属性值1; 属性2... -
CSS多类选择器及类的嵌套使用
2019-04-25 21:35:20多类选择器 在下面的例子中,有两个类选择器important和warming <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>class选择器</title> <style type=... -
类名选择器设置对应的元素样式
2019-06-02 22:55:35 -
css选择器是什么?css选择器有哪些类型?
2018-10-15 10:59:49这是我们必须要掌握的,本篇文章将给大家来介绍关于css选择器的基本定义,以及css选择器有哪些类型。 我们话不多说,直接进入正题~~ css选择器是什么? 在百度百科中,我们可以看到css选择器的基本定义是:每一条css... -
CSS3新增的伪类选择器,让你体验使用CSS3的快感。
2018-10-27 13:24:03伪类元素主要用于对已有选择器做进一步的限制,对已有选择器能匹配的元素做进一步的过滤。 伪类选择器 1.UI元素状态伪类选择器 UI元素状态伪类选择器主要用于根据UI元素的状态进行筛选,UI元素状态伪类选择器有... -
HTML中四种选择器
2016-03-13 19:53:501.类选择器class:“.class” 2. id 选择器:“#id” 3.派生选择器:“p strong” 4.属性选择器:“[title] / [title=te]” 代码如下: 选择器的选择 派生选择器 Hello 派生选择器! ... -
标签选择器(元素选择器)
2019-10-02 20:05:36标签器是指用HTML标签名称作为选择器,按标签名称分类,为页面中某一类标签指定统一的CSS样式。其基本语法格式如下: 标签名 {属性1:属性值1; 属性2:属性值2; 属性3:属性值3; ......} 标签选择器最大的优点是能快速... -
CSS:CSS选择器之【伪类/元素选择器】
2016-09-21 16:24:33伪选择器主要分两种:伪元素和伪类。伪元素选择器该类选择器主要用于向指定的选择器添加指定的效果。:first-letter选择“块级元素”文本段落中的首个字符,只能对“块级元素”生效。该选择器可以设置的值有: font... -
这30个CSS选择器,你必须熟记(上)
2019-10-30 07:10:00类选择器的开头用.(点)进行表示。与ID选择器的区别就是可以重用。定义多个元素的样式,好比按组进行归类,同一类的样式统一定义。 . error { color : red ; } 如果把两个类串在一起,选择的就是同时具有两个类名... -
CSS五大选择器
2019-02-21 14:53:40类选择器:用.+名称定义的css样式类型,叫类选择器在class中引用 如: .comment{ background-color: #0bbb15; color: white; margin: 20px; padding: 20px; } <div class=“comment&... -
css选择器有哪些?各种选择器优先级大小顺序
2018-05-14 07:03:521、类型选择器CSS中的一种选择器是元素类型的名称。使用这种选择器(称为类型选择器),可以向这种元素类型的每个实例上应用声明。例如,以下简单规则的选择器是H1,因此规则作用于文档中所有的H1元素。2、简单属性... -
交集选择器与并集选择器
2019-03-27 16:56:331、交集选择器 交集选择器就是在两个标签相交的部分,也就是交集进行修改格式。 对于交集选择器,可以与id和class共同使用。 格式: 标签1标签2 { 属性; } <!DOCTYPE html> <... -
原生js之道——原生js编写类选择器
2016-04-19 21:52:48一、类选择器的概念 类选择器,就是通过class属性获取节点。比如一个html结构中,有三个p标签都具有class=”red”的属性,那么类选择器返回的就是这三个p标签。 在jquery中,我们可以很方便的通过$(“.red”)这种... -
CSS伪选择器
2018-03-13 16:33:15伪选择器伪选择器是一种特殊的选择器,它分为伪类选择器和伪对象选择器2种。1.伪类选择器CSS提供了五种基本伪类选择器,分别对应HTML标记的五种状态。伪类选择器作用应用对象:hover定义标记在鼠标悬停(划过)时的样式... -
CSS选择器及优先级 总结
2018-03-14 22:02:18类选择器 元素选择器 通配符选择器 浏览器自定义或继承 总结排序:!important &amp;gt; 行内样式 &amp;gt; ID选择器 &amp;gt; 类选择器 &amp;gt; 元素 &amp;gt; 通配符 &... -
Python中的类的定义和对象的创建
2018-08-16 17:35:591.类 :对一类事物的描述,是抽象的、概念上的定义。比如做石膏像的模型 2.对象:实际存在的该类事物的每个个体,因而也称实例(instance)。比如石膏像 二者的关系:对象是由类派生的、创建的。一个类可以创建无穷多... -
CSS选择器
2019-11-10 14:33:03根据W3C定义CSS3 选择器: 在 CSS 中,选择器是一种模式,用于选择需要添加样式的元素。 基础选择器 层次选择器 伪类选择器 伪元素选择器 属性选择器 【基础选择器】 元素选择器(选择元素名) \ 如:p{color:... -
CSS中的ID选择器和类选择器区别及用法
2012-06-18 13:41:52控制页面总共有四种方式行内方式、内嵌方式、链接方式、导入方式, 通过这四种 方式就可以实现CSS对HTML页面样式的控制,如果要让这些样式对HTML页面中的元素 实现一对一,一对多或者多对一的控制,这