选择器的结构关系「建议收藏」

选择器的结构关系「建议收藏」选择器的结构关系

大家好,又见面了,我是你们的朋友全栈君。

 1 <!doctype html>  2 <html lang="en">  3 <head>  4 <meta charset="UTF-8">  5 <meta name="Generator" content="EditPlus®">  6 <meta name="Author" content="">  7 <meta name="Keywords" content="">  8 <meta name="Description" content="">  9 <title>Document</title> 10 <style type="text/css"> 11 /* .box1 .txt1 .tnt1{ 12  background:red; 13  } */ 14 /* .box1 .tnt1{ 15  background:red; 16  } */ 17  .box1 .tnt1{  18  font-size:36px; 19 } 20  .box1>span{  21  background:red; 22 } 23  .box1,.txt1,.tnt1{  24  border:1px solid red; 25 } 26  div.txt1{  27  background:pink; 28 } 29  .box1 + span{  30  font-size:30px; 31 } 32 </style> 33 </head> 34 <body> 35 <!-- 36  标签有不同结构,所以选择器同理; 37  并列(兄弟)关系 嵌套(父子)关系; 38  1.包含选择器: 选中后代,可以跨越多级.{.box span(选中所有span标签)}; 39  2.子集选择器: 选中儿子, 不能跨越多级; .box>span(选中佩奇爸爸); 40  3.群组选择器: 多个选择器选择到一组, 用逗号隔开; {(同时选择多个选择器名用逗号隔开)作用是同时对多个标签起作用}; 41  4.复合选择器: 需要标签同时满足两个选择器的条件才能满足;{(div.txt1)选中我是佩奇妈妈}; 42  5.毗邻选择器: 选择某个元素紧挨着的下一个兄弟元素; {(.box1+span)选中我是佩奇爷爷}; 43 --> 44 <div class="box1"> 45 <p class="txt1"> 46  我是佩奇妈妈; 47 <span class="tnt1">小猪佩奇一号</span> 48 <span>小猪佩奇二号</span> 49 <span>小猪佩奇三号</span> 50 <span>小猪佩奇四号</span> 51 </p> 52 <span>佩奇爸爸来了!</span> 53 </div> 54 <span>佩奇爷爷来了!</span> </br> 55 <div class="txt1">我是佩奇妈妈!</p> 56 </body> 57 </html>

 

转载于:https://www.cnblogs.com/soTired/p/10152917.html

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/107131.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)


相关推荐

  • flanking sequence_integration by parts

    flanking sequence_integration by partseXtremeDBpaginationpaging分页

  • Hbase面试题总结(大数据面试)

    Hbase面试题总结(大数据面试)概述

  • c语言之voliate「建议收藏」

    c语言之voliate「建议收藏」volatile:意思:“易变的”特点:1.告诉编译器不做任何优化2.用volatile定义的变量会在程序外被改变,每次使用都要在原始内存地址读取数据,不能被备份缺点:使用过多会降低代码性能使用场合:1.中断服务程序中为其他程序检测的变量,要用volaite2.多任务环境下各个任务间共享的标志,用volatile(操作系统)3.存储器映射的硬件寄存器用vol…

  • 同步调用、回调和异步调用区别

    同步调用、回调和异步调用区别同步调用是以一种阻塞式调用比如说:古代的长城的烽火传递信息,现在我们假设每个烽火只能看到相邻的烽火状态,每个烽火的状态只有亮和暗。现在有A、B、C、D四个烽火,A首先点亮,B看到A的烽火亮了,立马去点火,花了2秒点亮。但是这时候负责C烽火的人在睡觉,可是这时候所有人都在等待C点亮,终于C睡了2个小时候看到了B点亮,然后去点亮。D由于长期没有点亮,导致烽火出现问题,因此整个过程都在等待D的完

  • Pytest(6)重复运行用例pytest-repeat[通俗易懂]

    Pytest(6)重复运行用例pytest-repeat[通俗易懂]前言平常在做功能测试的时候,经常会遇到某个模块不稳定,偶然会出现一些bug,对于这种问题我们会针对此用例反复执行多次,最终复现出问题来。自动化运行用例时候,也会出现偶然的bug,可以针对单个用例,

  • 基于android餐馆点餐系统报告感想,基于Android的餐厅点餐系统的设计与实现

    基于android餐馆点餐系统报告感想,基于Android的餐厅点餐系统的设计与实现摘要:民以食为天,在日常的生活中,我们经常需要与家人,朋友,同事在一起就餐以便促进相互之间的感情.但是现在多数的餐厅企业基本上还是手工点餐操作,无法更好地适应新时期下人们对餐饮业服务的人性化和高效率的要求.随着”互联网+”思维的不断推广,使得传统行业和互联网行业相结合的新兴产业也不断迅速发展.在当前社会形势下安卓系统得到了迅速发展和广泛应用,它正在悄无声息的改变着人们的生活,也为餐厅点餐信息化技术…

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号