首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

【CSS选择符】后代选择符

在学习后代选择符之前,首先要了解一下组成一个网页的HTML家谱,每个HTML标签标示其中一个家庭成员。网页中的第一个HTML标签(标签),相当于所有其他标签的始祖。...先看看一段HTML代码: Document Header A paragraph of importanttext. 以下是结构示意图 祖辈:外层HTML标签是内层标签的祖辈。...同辈:父辈相同的标签叫同辈标签,相当于兄弟姐妹。如和是同辈标签,和 也是同辈标签。...后代选择符可以由2个以上元素组成,例如: ul li a body li a html li a html body ul li a 以上四个选择符的作用相同,因此表明,无需指明目标标签的所有直系。...同样的,后代选择符也不局限于只能使用类型选择符。 可以使用不同类型的选择符构建复杂的后代选择符

76950

选择符和ID选择符

选择符 HTML代码: CSS代码: div { width: 200px; height: 200px; border: 1px solid #000; margin: 20px; } .one{...首先给选择符起一个名字,然后把这个名字指定给想装饰的HTML标签。例如上一个例子中,我就给第一个div命名为“one”。 类选择符还能精确控制某个元素的外观,而不管元素使用的是哪个标签。...这样Web浏览器才能在样式表中找到类选择符。 类选择符的名称中只能包含字母、数字、连字符和下划线。 选择符的名称必须以字母开头。 类选择符区分大小写。 在HTML中,标签设置class属性。 。...ID选择符 CSS使用ID选择符选取网页中的特定部分,例如横幅、导航栏或者主内容区域。 在HTML中设置ID的方法与设置类的方法差不多,不过使用的属性不同。...正确地使用ID HTML的id属性有些作用是class属性实现不了的。这些优势与CSS没关系,因此完全可以不适用ID选择符

82570
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    CSS 基础系列:伪类和伪元素

    (n) p:nth-last-of-type(2) 选择符合的p元素,该p元素必须是其父元素的倒数第2个p子元素 :nth-of-type(n) p:nth-of-type(2) 选择符合的p元素,该p...当 style 没有设置 scope 属性时,style 内的样式会对整个 html 起作用。...实际上,lang=” “ 属性不只可以在 html 标签上设置,也可以在其他的元素上设置。 :dir 匹配指定阅读方向的元素。 当 HTML 元素中设置了 dir 属性时该伪类才能生效。...3.5 其他 选择器 示例 示例说明 :root 匹配文档的根元素 一般的 html 文件的根元素是 html 元素。...这里不再限制是第一个子元素了,只要是该类型元素的第一个就行了,当然这些元素的范围都是属于同一级的,也就是同辈的。

    1.9K10

    前台开发从头说起:谈谈CSS选择符

    于是,css选择符的地位在这个前提下就空前的提高了。所以,在开始学习盒模型、浮动、定位之前,有必要回顾一下选择符。...一般稍微接触过css的网页设计人员,都会很快地学会三种css选择符: 元素选择符(例如:body 、a 、li ) ID选择符(例如:#head、#body、#foot) 类选择符(例如:.red、....item、.content) 更进一步之后,开始了解到一些进阶的选择符: 后代选择符(例如 #head .menu、#foot #copyright) 伪类选择符(例如 a:hover、a:link...) 以及由这些选择符组合起来形成的综合选择符。...实际上css还支持一些更丰富的选择符。但是能够被浏览器广泛支持的其实主要就是上面这几种,其它的选择符在css中往往用来区别处理不同的浏览器,或者用在jQuery一类的框架中。本文就不提了。

    1K70

    《精通CSS》第2章 添加样式

    如果你好奇为什么有相邻同辈选择器和一般同辈选择器,却没有可以选择前面的元素的选择器?原因如下: 浏览器之所以不支持向前选择同辈元素,主要是因为网页渲染性能的关系。...不跳过的同学,我们继续属性选择符、伪元素和伪类。 2.1.1 属性选择器 前面介绍了什么是属性选择器,也提到了有几种变种。下面我们来看下具体的用法。...但如果message类的前面或后面又添加了别的类名,如class="box message"/class="message box"/class="messagebox",这个选择符都会失效。...适用于超链接的伪类 常见的 HTML 元素的基础样式表中,经常能看到下面这些关于超链接的样式。...2.5 为文档应用样式 我们可以通过 4 种方式将编写的 CSS 样式应用到 HTML 文档中。 元素 首先,我们可以把样式放在元素中,直接放在文档的标签内。

    1.6K40

    用属性选择符来解决IE跟FF的兼容性问题

    用属性选择符来解决IE跟FF的兼容性问题 由 Ghostzhang 发表于 2006-04-24 11:39 从之前写过的《属性选择符的使用》中发现了一个可以用来解决IE跟FF兼容性的问题,因为IE...不支持CSS的属性选择符。...important声明提高样式的优先级不就完了吗,用属性选择符来为FF写样式意义不大。使用!important声明的确是比较方便,但IE6也认识这个声明,也就是说如果你给FF写了!...使用属性选择符就不会有这样的问题,而且可以将多个定义写到一起,是不是比较方便呢?看看下面的样式: /* 使用声明 */ div.try{ width:200px !...在《CSS样式的优先级补遗2》及《属性选择符的优先级》中我们了解到,ID选择符的特性值为100,而属性选择符的特性值为11,即不能达到将样式定义分开的目的。

    34820

    jQuery遍历函数

    .next():获得ppys集合中的每一个元素紧邻的同辈元素。 .nextAll():获得ppys集合中的每一个元素紧邻的全部同辈元素,由选择器进行筛选(可选)。....nextUntil():获得每一个元素之后全部的同辈元素。直到遇到匹配选择器的元素为止。 .not():从ppys集合中删除元素。 .offsetParent():获得用于定位的第一个父元素。....prev():获得ppys集合中的每一个元素紧邻的前一个同辈元素,有选择器进行筛选(可选)。 .prevAll():获得ppys集合中的每一个元素之前的全部同辈元素,有选择器进行筛选(可选)。....prevuntil():获得每一个元素之前全部的同辈元素,直到遇到匹配选择器的元素为止。 .siblings():获得匹配元素集合中全部元素的同辈元素,由选择器筛选(可选)。...发布者:全栈程序员栈长,转载请注明出处:https://javaforall.cn/116338.html原文链接:https://javaforall.cn

    1.1K20

    杨老师课堂之Jquery的筛选,事件,效果,Ajax,javascript跨域)

    find(expr|obj|ele),搜索所有与指定表达式匹配的元素 next([expr]),取得一个包含匹配的元素集合中每一个元素紧邻的后面同辈元素的元素集合。...nextAll([expr]),查找当前元素之后所有的同辈元素。 nextUntil([exp|ele][,fil]),查找当前元素之后所有的同辈元素,直到遇到匹配的那个元素为止。...prev([expr]),取得一个包含匹配的元素集合中每一个元素紧邻的前一个同辈元素的元素集合。...prevAll([expr]),查找当前元素之前所有的同辈元素 prevUntil([exp|ele][,fil]),查找当前元素之前所有的同辈元素,直到遇到匹配的那个元素为止。...succuss, error, notmodify,timeout 4 种) •XMLHttpRequest 对象 默认使用 GET 方式 - 传递附加参数时自动转换为 POST 方式 可以指定选择符

    8.3K20

    扫码

    添加站长 进交流群

    领取专属 10元无门槛券

    手把手带您无忧上云

    扫码加入开发者社群

    相关资讯

    热门标签

    活动推荐

      运营活动

      活动名称
      广告关闭
      领券