CSS——CSS权重计算测试题

清河大善人

已于 2023-10-11 15:01:21 修改

阅读量4.7k

点赞数 3

CC 4.0 BY-SA版权

分类专栏： # CSS 文章标签： css css3 html

于 2020-06-29 22:32:31 首次发布

本文链接：https://blog.csdn.net/weixin_45525272/article/details/107029892

文章目录

- 1
- 2
- 3
- 4
- 5
- 6
- 答案及解析

1

<title>第1题</title>
		<style type="text/css">

			
			#father #son{
     
       
				color:blue;
			}
			#father p.c2{
     
     
				color:black;
			}
			div.c1 p.c2{
     
     
				color:red;
			}
			#father{
     
     
				color:green !important;  /* 继承的权重为0 */
			}
		</style>
	</head>
	<body>
		<div id="father" class="c1">
			<p id="son" class="c2">
				试问这行字体是什么颜色的？
			</p>
		</div>
	</body>

2

<title>第2题</title>
		<style type="text/css">

最低0.47元/天解锁文章

200万优质内容无限畅学

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

清河大善人

关注关注

3
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
打赏
打赏
打赏举报

举报

专栏目录

css的选择器的权重的练习6个

小黄呀呀呀的博客

04-23

270

方法：（1）修改颜色时，先判断目标元素是否被选中（2）在选中的里面，来依据权重，进行计算注意：div a 表示的是div里的子孙（儿子和孙子） 1、 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title&g...

CSS-样式权重精华6题-前端面试题

乌药ice

01-10

531

第一题代码： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>CSS-样式权重精华6题</title> </head> <style type="te

参与评论您还未登录，请先登录后发表或查看评论

CSS权重练习

WangZhang_521的博客

12-28

232

CSS权重练习一 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <ti

CSS 样式优先级规则与权重系统详解

最新发布

weixin_40682342的博客

06-22

908

CSS 样式优先级是决定当多条规则应用于同一个元素时，哪条规则会最终生效的规则体系。下面我将全面解析 CSS 优先级规则和权重计算方式。

CSS权重叠加计算案例

Yous的博客

03-22

627

第一题 <head> <meta charset="utf-8"> <title>第1题：普通题</title> <style> /* (行内, id, 类, 标签) */ /* !important 最高 */ /* 继承: 最低 */ /* (0, 2, 0, 0) */ #father #son { color:blue; } /* (0, 1, 1, 1) */ #father p.c

CSS权重的叠加练习

CodeDoraemon的博客

02-02

341

文章目录1. CSS权重的叠加2. 示例代码3. 运行结果 1. CSS权重的叠加 2. 示例代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</ti

css权重及计算

前端爆米花

11-23

3784

1). 权重计算公式关于CSS权重，我们需要一套计算公式来去计算标签选择器计算权重公式继承或者 * 0,0,0,0 每个元素（标签选择器） 0,0,0,1 每个类，伪类 0,0,1,0 每个ID 0,1,0,0 每个行内样式 style="" 1,0,0,0 每个!important 重要的 ∞ 无穷大值从左到右，左面的最大，一级大于一级，数位...

html、css、js全阶段试题.rar

10-17

4. CSS层叠规则：理解权重计算和优先级。 5. 响应式设计：媒体查询的使用，适应不同设备的显示。 JavaScript是实现网页动态效果和用户交互的关键。相关的练习题目可能涵盖： 1. 变量、数据类型、运算符：基础概念和...

HTML+CSS测试题

wen110898的博客

08-20

2655

前言近日对HTML与CSS的学习已经告一段落了，htm和css说难不难说易不易，难于记得东西很多，易于操作，而且在布局方面比较锻炼你的斯维逻辑。但是相对于后面js的学习还是算简单了，前两天我们也进行了一次阶段考试，我整理了一下考试的题目与答案详解，考后答案里面我会习惯性的将相关知识一起注解上去，方便复习学习。下面试卷奉上：一、选择题第九题选择题详解： 1.定义和用法 enctype 属性规定在发送到服务器之前应该如何对表单数据进行编码。默认地，表单数据会编码为 “application/x-ww

第一章面试题基础篇（HTML+CSS）

欢迎来到我的博客！

08-09

2111

CSS的盒子模型有哪些：标准盒子模型、IE盒子模型CSS的盒子模型区别：标准盒子模型：margin、border、padding、contentIE盒子模型：margin、content（ border + padding + content ）通过CSS如何转换盒子模型：/*标准盒子模型*//*IE盒子模型*/reset.css 是一个css文件，用来重置css样式的。normalize.css 为了增强跨浏览器渲染的一致性，一个CSS 重置样式库。

css权重题

Jy123_的博客

04-28

327

<!DOCTYPE html> <html lang="en"> <head> <meta http-equiv="content-type" content="text/html;charset=utf-8" /> <title>第1题</title> <style type="text/css">...

CSS+DIV练习题

05-07

这是我自己整理出来的CSS+DIV练习题，非常全面，里面有单选、多选、判断、填空、问答、编程题。

CSS经典权重5道题解析

车大棒的博客

06-26

2708

在前端的道路学习过程，CSS的选择器的权重的问题知识点是不可避免的。下面先简单回顾一下三种常用的选择器，id选择器、class选择器、元素选择器（type）。一般为了分方便区分三种选择器的权重，分别以1.0.0、0.1.0、0.0.1来对比这种谁的大小。之后CSS样式中只需要比谁权重数组大就执行谁，可是真的是只需要比权重大小就可以了吗？还是说只是在某种情况下才适合比权重？不要着急，相信通过

css选择器权重测试

lianfengzhidie的博客

07-10

464

问题：如下代码所示，'CCCCCCCCCC'行的背景色是red, blue or yellow?<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <meta http-equiv="content-type" content="t

前端面试题-CSS权重

weixin_30980795的博客

05-25

759

一、选择器优先级由每一种选择器类型的权重决定。二、优先级计算 1.优先级就是分配给指定的CSS声明的一个权重，它由匹配的选择器中的每一种选择器类型的数值决定。 2.当优先级与多个CSS声明中任意一个声明的优先级相等的时候， CSS中最后的那个声明将会被应用到元素上。 3.当同一个元素有多个声明的时候，优先级才会有意义。因为每一个直接作用于元素的CSS规则总是会接管/覆盖（take over）该元素从祖先元素继承而来的规则。三、优先级顺序 3.1 选择器权重值 3.2 从大到小内联样式 >

CSS基础(一)--选择器与权重计算练习

乐观自信爱

09-05

648

一<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style type="text/css"> /*1.选中了标签 * 2.权重是 1 1 1 */ #box1 .hezi2 p {

关于css问题继承、权值问题

Lee_Lei0213的博客

04-25

169

一、Css的继承 .codeClass{color:#000000;}<p class="codeClass"><span>你好</span>世界</p> 　　Span继承了，来自codeClass的color。也就是说，子元素会从父元素继承属性，当然不是所有的CSS属性都有继承性，文本属性（color、font、line-height...

CSS中选择器权重计算的例题

weixin_34029680的博客

10-19

335

第一题：根据以上代码，我们来判断一下P语句中的“文字”到底是什么颜色？#box1 .spec2 p 这是第一个，根据权重判断，我们可以看出有一个id选择器，一个类选择器，一个标签选择器，其权重应该是1,1,1div div #box3 p这是第二个，我们可以看出有一个id选择器，没有类选择器，3个标签选择器，其权重应该为1,0,3div.spec1 div.spec2 di...

帮我找css选择器优先级单选题

03-24

第四题可以测试标签选择器和类选择器的组合权重。第五题可能涉及通配符和继承的优先级比较。需要注意的是，每个选项的权重计算是否符合规则，比如ID的权重是100，类是10，标签是1，但实际中这些数值并不直接相加，...