标签指定式选择器、后代选择器、并集选择器_urs ph的博客-程序员宅基地_标签指定式选择器

技术标签: css  前端学习笔记  

标签指定式选择器

用法:
       标签名.选择器名{属性:值; 属性:值;}
或者,
       标签名#选择器名{属性:值;}

       特点关系:既…又…

<DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">

		<style type="text/css">
		
			p.one{
    
				color:yellow;
			}
		</style>
	</head>
		<body>
			<p class="one">文字</p>
			<p class="two">文字2</p>
			<p class="one">文字3</p>
		</body>
</html>
		

或者

<DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">

		<style type="text/css">
		
			div#div1{
    
			color: red;
					}
		</style>
	</head>
		<body>
			<div id="div1">文字</div>
		</body>
</html>

后代选择器

特点:

       标签之间必须属于嵌套关系。

用法

       选择器+空格+选择器{属性:值; 属性:值;…}

       注意:选择器之间必须有空格
关系:

       父与子的关系

并集选择器

用法:

       选择器,选择器,选择器{属性:值;}

作用:

       将样式集体声明,css样式初始化

特点:

       并集选择器之间必须用逗号隔开

div,p,span{
    
			color: red;
		}
版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/weixin_45591028/article/details/104282354

智能推荐

标签指定式选择器、后代选择器、并集选择器

标签指定式选择器 用法: &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;标签名.选择器名{属性:值; 属性:值;} &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;特点关系:既…又… &lt;DOCTYPE html&gt; &lt;html&gt; &lt...

HTML &CSS之复合选择器中的交集选择器、并集选择器、后代选择器、子元素选择器、相邻兄弟选择器、属性选择...

复合选择器是通过基本选择器进行组合后构成的,常用的复合选择器有:交集选择器、并集选择器、后代选择器、子元素选择器、相邻兄弟选择器和属性选择器等。 1. 交集选择器 交集选择器由两个选择器直接构成,其中...

006---css复合选择器(交集选择器,并集选择器,后代选择器,子元素选择器,属性选择器,伪元素选择器)

复合选择器是由两个或读个基础选择器,通过不同的方式组合成的,目的是为了可以选择更准确的目标元素。一、交集选择器例如:&amp;lt;div class=&quot;orange&quot;&amp;gt;I am P1&amp;lt;/div&amp;gt; &amp;lt;p ...

css高级特性(“交集”, “并集”选择器, “后代”选择器,“子”选择器 ,继承特性 ,层叠特性)

1.3 “后代”选择器 1.4 “子”选择器 交集选择器 比如: &lt;p class="c"&gt;交集&lt;/p&gt; 即是p标签,class="c"也满足 效果:交集这个文字变红 样式:p.c{ color:red; } 并集选择器(中间用逗号...

【CSS 教程系列第 10 篇】什么是 CSS 中的并集选择器(群组选择器)

并集选择器,指的是可以同时对多个选择器进行相同的操作。 任何形式的选择器(包括元素选择器、 class 选择器、id 选择器等),都可以作为并集选择器的一部分。如果某些选择器定义的样式完全相同或部分相同,就可以...

CSS子类选择器和后代选择器的区别

后代选择器则指的是作用于所有后代元素,通过空格来进行选择。 话不多说,接下来通过代码给大家演示。 二.举例 &amp;lt;ul class=&quot;clothes&quot;&amp;gt; &amp;lt;li&amp;gt;衣服 &amp;l...

jQuery 层级选择器(子代、后代选择器)

名称 用法 描述 子代选择器 ...使用空格,代表后代选择器,获取ul下的所有li元素,包括孙子等 跟CSS的选择器一模一样。 案例: &lt;!DOCTYPE html&gt; &lt;html lang="zh-CN"&gt; &lt;head&g...

jquery基本选择器:id选择器、class选择器、标签选择器、通配符选择器

jquery系列教程1-选择器全解jquery基本选择器jquery基本选择器,包括id选择器、class选择器、标签选择器、通配符选择器,同时配合选择器的空格、逗号等语法,可以实现大部分需要的选择功能。 代码如下:$("#myid");...

【CSS 教程系列第 8 篇】什么是 CSS 中的后代选择器

后代选择器,用来选择元素或元素组的所有后代元素。

jquery 联合选择器,相对选择和层级选择器__多类交集选择器,多属性选择器

1、多条件选择器 用途:使用多个条件同时选择多个标签 用法:$(“条件1,条件2,条件3,……,条件n “); 特征:多个条件在“”内用逗号隔开; 用例:$(“div#id,span.tip,p”); //同时选择id为“id”的div标签,...

【CSS 教程系列第 7 篇】什么是 CSS 中的 class 选择器(类选择器)、多类名选择器

一:什么是 CSS 中的 class 选择器。 二:什么是 CSS 中的多类名选择器。

03-CSS样式表和选择器

CSS几种扩展选择器:后代选择器、交集选择器、并集选择器 CSS样式优先级 前言 现在的互联网前端分三层: HTML:超文本标记语言。从语义的角度描述页面结构。 CSS:层叠样式表。从审美的角度负责页面样式。 JS:...

【jQuery 教程系列第 9 篇】jQuery 中常用的基础选择器

jQuery 选择器有很多,基本兼容了 CSS1 到 CSS3 所有的选择器,除此之外,它也有一些自定义的选择器,在 jQuery 中所有的选择器都是以 $ 符号 开始:$("选择器")。 下面我们仅针对 jQuery 中一些常用的选择器做一下...

JQuery选择器超级详细

基本选择器 id选择器:$("#id的属性值") 获取与指定id属性值匹配的元素 单击按钮,将id为myid的元素背景为绿色 &lt;%@ page contentType="text/html;charset=UTF-8" language="java" %&gt; &lt;html&gt;...

CSS-选择器及其兼容性

标签选择器就是用标签名来当做选择器。 1 、所有标签都能够当做选择器,比如body、h1、dl、ul、span等等 2 、不管这个标签藏的多深,都能够被选择上。 3 、选择的是所有的,而不是某一个。所以是共性,而不是特性...

CSS复合选择器( 交集选择器、 并集选择器、后代选择器、子元素选择器、伪类选择器、 链接伪类选择器)

交集选择器由两个选择器构成,其中第一个为标签选择器,第二个为class选择器,两个选择器之间不能有空格,如h3.special。 记忆技巧: 交集选择器 是 并且的意思。 即…又…的意思 比如: p.one 选择的是: 类名为 ....

css交集选择器、并集选择器、兄弟选择器

一,交集选择器&lt;!DOCTYPE html&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;15-css交集选择器.html&lt;/title&gt; &lt;!-- 交集选择器,相交的部分就是要设置属性值的标签 1,格式: 选择器1选择器2...{ 属性:值

css选择器& 选择器的优先级

一、选择器1.元素选择器 语法,作用给元素名为你设置的那个元素的元素名设置样式 元素名 { 样式列表 } 2.id选择器。通过元素的 id 属性给id赋值, #开始加上id名称。id名称在整个页面里是唯一的 id选择器语法 #...

CSS提高篇(复合选择器)

CSS复合选择器后代选择器交集选择器并集选择器 后代选择器 在CSS选择器中通过嵌套的方式,对特殊位置的HTML标签进行声明,外层的标签写在前面,内层的标签写在后面,之间用空格分隔,标签嵌套时内层的标签成为外层...

jquery多个选择器组合使用语法

基本选择器 多个属性选择器[] 多个过滤选择器:(不含eq) eq 多个选择器 摘要 选择器的组合使用 测试用jquery版本:3.2.1 测试用html &amp;lt;p id=&quot;p1&quot;&amp;gt;1p&amp;lt;/p&amp;gt; &...

交集选择器与并集选择器

1、交集选择器 ...交集选择器就是在两个标签相交的部分,也就是交集进行修改格式。 对于交集选择器,可以与id和class共同使用。 格式: 标签1标签2 { 属性; } &lt;!DOCTYPE html&gt; &lt;...

html选择器

CSS的作用: 就是用来改变文本的样式CSS三大特性 继承性:给父类元素设置一些属性以后,子类也可以使用,叫继承性 如果对父类标签设置样式以后,如果子类标签没有单独设置样式默认继承父类的样式 注意: 1、并...

选择器的优先级和伪类的顺序

1.选择器的优先级 (1)样式的继承 像儿子可以继承父亲的财产一样,在CSS中,祖先元素上的样式也会别后代元素所继承,利用继承可以将一些基本的样式设置给祖先元素,这样所有的后代元素将会继承这些样式。继承时对...

HTML常用选择器

元素选择器、id选择器、类选择器(class)、选择器分组(并集选择器)、通配选择器、复合选择器(交集选择器)。 元素选择器 作用:通过元素选择器可以选择页面中的所有指定元素。 语法:标签名{} &amp;amp;nbsp...

CSS交集选择器和并集选择器

交集选择器是and,并集选择器是or。交集选择器最多只能够交2个,其中第一个是标记,第二个是类选择器或者id选择器,形如:.screen.now。并集选择器可以选择多个,中间需要用“,”隔开。 以下一段代码为简单实例: ...

CSS选择器

根据W3C定义CSS3 选择器: 在 CSS 中,选择器是一种模式,用于选择需要添加样式的元素。 基础选择器 层次选择器 伪类选择器 伪元素选择器 属性选择器 【基础选择器】 元素选择器(选择元素名) \ 如:p{color:...

CSS——CSS的三种书写方式 CSS选择器

行内样式:(内联样式)直接在标签的style属性中书写 style="color:red;"&gt; 页内样式:在本网页的style标签中书写  body {  color:red;  } p外部样式:在单独的CSS文件中书写,然后在网页中用...

随便推点

推荐文章

热门文章

相关标签