首页 > 其他分享 >CSS-层次选择器-2022-12-23

CSS-层次选择器-2022-12-23

时间:2022-12-23 11:11:26浏览次数:37  
标签:body 12 background 23 2022 active 选择器

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>

<style>
/*p{*/
/* background: #61e93e ;*/
/*}*/

/*1.后代选择器*/
/* body p{*/
/* background:red;*/
/* }*/

/*2.子选择器,只有一代*/
/*body>p{*/
/* background: #61e93e;*/
/*}*/

/*3.相邻兄弟选择器 只有一个,对下不对上*/
/* .active + p{*/
/* background: aqua;*/
/* }*/

/*4.通用选择器 当前选中元素的向下的所有兄弟元素*/
.active~p{
background: darkviolet;
}

</style>

</head>
<body>

<p>p0</p>
<p class="active">p1</p>
<p>p2</p>
<p>p3</p>
<ul>
<li>
<p>p4</p>
</li>
<li>
<p>p5</p>
</li>
<li>
<p>p6 </p>
</li>
</ul>
<p class="active">p7</p>
<p>p8</p>
<p>p9</p>

</body>
</html>

标签:body,12,background,23,2022,active,选择器
From: https://www.cnblogs.com/RUI2022/p/17000266.html

相关文章

  • CSS-选择器-2022-12-23
    <!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><title>Title</title><style>/*不遵循就近原则,id选择器>类选择器>标签选择器*/#lr{......
  • Python DevOps运维开发实战集训营【中级班,第8期,2022年12月结课】
    点击下载——​​PythonDevOps运维开发实战集训营【中级班,第8期,2022年12月结课】​​提取码:as28《PythonDevOps运维开发实战集训营【中级班】》,第8期,2022年12月10号结课......
  • 2023年元旦手抄报模板怎么打印?
    进入2022年的12月底,相信有很多人都在期待2023年的第一个法定节假日——元旦。此外也会有很多老师要求学生完成一份特殊的作业,这就是画一张元旦节手抄报。有一些家长就要开......
  • [20221223]每日一题
    简单的模拟classSolution{public:intfinalValueAfterOperations(vector<string>&operations){intans=0;for(autostr:operations){......
  • 12 月做题笔记
    前言开博客记录做题笔记的flag我立过\(n\)遍了,无一例外都倒了。这次一定要坚持下来,一周至少一题不能咕,养成好习惯。【LOJ3124】氪金手游容易发现给定的\((u_i,v_i......
  • 寄语自己-2012
    2012年新年即到,谨写此文自勉:睡早点,多休息,不透支体能;少喝点,多喝水,不藐视养生;吃好点,多运动,不远离健康。豁达点,多宽容,不自寻烦恼;坚强点,多微笑,不牵手脆弱;踏实点,多务实,......
  • Kotlin学习快速入门(12)—— 位运算符
    由于不懂pythod,最近拜托朋友研究下解密live2d模型的解密算法,朋友写出了Java的代码之后我进行改版,在转为kotlin的时候,发现kotlin自动转换有些坑,以及kotlin中的位运算......
  • 双面柔光 照亮你我tā vivo S16系列12月22日正式发布
    2022年12月22日,主题为“双面柔光照亮你我tā”的vivoS系列新品发布会于线上举行,vivoS16以及vivoS16Pro等三款新机正式发布。作为vivoS系列的最新一代产品,vivoS16系列......
  • 12月22日内容总结——django中间件的三个了解要求的方法、基于django中间件的功能设计
    目录一、django中间件三个了解的方法二、django中间件五个方法的执行流程详解三、基于django中间件的功能设计功能设计介绍如何利用字符串导入模块功能模拟四、cookie与ses......
  • HTML-学习表单-2022-12-22
    <!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><title>登录注册</title></head><body><h1>注册</h1><!--表单formaction提交的位置,可以是网站,......