章节重复度20190523003
上QQ阅读APP看本书,新人免费读10天
设备和账号都新为新人

选择器

记录常用选择器方式,验证Q阅支持情况。

元素选择器

按照给定的节点名称,选择所有匹配的元素。

本章中使用元素选择器,为各个选择器标题添加上绿下蓝的边框。

类选择器

按照给定的 class 属性的值,选择所有匹配的元素。

使用该选择器,为“类选择器”四字赋予红色。

ID 选择器

按照 id 属性选择一个与之匹配的元素。需要注意的是,一个文档中,每个 ID 属性都应当是唯一的。

使用该选择器,去除首行缩进,添加1字宽做边框。

属性选择器

按照给定的属性,选择所有匹配的元素。

使用该选择器,去除首行缩进,标题居中。

选择器列表

, 是将不同的选择器组合在一起的方法,它选择所有能被列表中的任意一个选择器选中的节点。

關關雎鳩,在河之洲。窈窕淑女,君子好逑。

參差荇菜,左右流之。窈窕淑女,寤寐求之。

求之不得,寤寐思服。悠哉悠哉,輾轉反側。

參差荇菜,左右采之。窈窕淑女,琴瑟友之。

參差荇菜,左右芼之。窈窕淑女,鐘鼓樂之。

1、3、5楷体,2、4宋体,但都有下划线。

后代组合器

“ ”(空格)组合器选择前一个元素的后代节点。

pic1

父元素设置居中,后代节点添加边框,边框距离图片有3个像素的空白。

直接子代组合器

> 组合器选择前一个元素的直接子代的节点。

關關雎鳩,在河之洲。窈窕淑女,君子好逑。

參差荇菜,左右流之。窈窕淑女,寤寐求之。

求之不得,寤寐思服。悠哉悠哉,輾轉反側。

第一行设置居中,并将字色赋予红色。

一般兄弟组合器

~ 组合器选择兄弟元素,也就是说,后一个节点在前一个节点后面的任意位置,并且共享同一个父节点。

表3—2 跨国公司外国来源收入主要类型

图片表格

资料来源:26 USC. § 862. Income from sources without the United States.

标题和图注都居中,图注文字为蓝色且字号小于正文。

紧邻兄弟组合器

+ 组合器选择相邻元素,即后一个元素紧跟在前一个之后,并且共享同一个父节点。

  1. Mix flour, baking powder, sugar, and salt.
  2. In another bowl, mix eggs, milk, and oil.
  3. Stir both mixtures together.
  4. Fill muffin tray 3/4 full.

第3行文本变为粉色。第2行右边有1字宽边框。

伪类

: 伪选择器支持按照未被包含在文档树中的状态信息来选择元素。

左右1字边框,下面1像素边框,文本居中。

伪元素

:: 伪选择器用于表示无法用 HTML 语义表达的实体。

上一段如果支持伪选择器,会有红色括号括住。