CSS 元素选择器
最常见的 CSS 选择器是元素选择器。换句话说,文档的元素就是最基本的选择器。
如果设置 HTML 的样式,选择器通常将是某个 HTML 元素,比如 p、h1、em、a,甚至可以是 html 本身:
html {color:black;}& k1 _3 O' G% }5 N+ ^) u% z
h1 {color:blue;}& |( u* _: P t, o7 b; F
h2 {color:silver;}
2 _- b& A' c+ h/ f, J
亲自试一试
可以将某个样式从一个元素切换到另一个元素。
假设您决定将上面的段落文本(而不是 h1 元素)设置为灰色。只需要把 h1 选择器该为 p:
html {color:black;}! s2 |+ f0 }6 `5 K( ^% N
p {color:gray;}
" d: t2 q6 C2 e* E* P7 ]1 c( R
h2 {color:silver;}$ w7 p# C/ v; K/ |
亲自试一试
类型选择器
在 W3C 标准中,元素选择器又称为类型选择器(type selector)。
“类型选择器匹配文档语言元素类型的名称。类型选择器匹配文档树中该元素类型的每一个实例。”
下面的规则匹配文档树中所有 h1 元素:
h1 {font-family: sans-serif;}
因此,我们也可以为 XML 文档中的元素设置样式:
XML 文档:
<?xml version="1.0" encoding="ISO-8859-1"?>
; q, E! q: }- t Y<?xml-stylesheet type="text/css" href="note.css"?>
& A/ Y) }% p0 x1 O9 B* w: ~3 p5 x<note>' Z, T6 C3 [3 s, m7 f4 d" O/ j
<to>George</to>
+ I, R& ^6 i, H<from>John</from>- [- ]- l2 K( X4 p. Y( P
<heading>Reminder</heading>
, z; k! _: n0 E<body>Don't forget the meeting!</body>0 H6 o/ l0 D: d- b. y. @9 n
</note>& J1 r* E; y, ]1 ~
CSS 文档:
note0 a2 C0 b; h& R- B" D j
{8 Z) S# }1 `( n
font-family:Verdana, Arial;
4 _7 R# }( R4 m2 ^& y/ p' D margin-left:30px;
- H# b! {+ {/ Z7 E: S1 j3 f7 x, h }7 m7 h g* O8 s! l
/ M3 U/ G+ x+ M+ E9 F) Rto, ~/ ~# S: a: G/ B. Z8 e# g+ m
{) [ W! O* S7 L( o2 v
font-size:28px;/ W% S$ a! Y* v# L( M7 S; ^8 s
display: block;; S, C5 |8 `; K1 k: @2 M: \7 `
}
0 I2 n3 w1 I6 k& G3 \$ b/ @/ m6 T( W9 o0 j- S J
from
' Z/ x; h3 c3 p {6 V, Q) |) D9 F8 F
font-size:28px;/ W( h# S" L6 t& G% N- a) b. a
display: block;
! H* C- H( ?: _2 e6 M }* P6 Y$ `8 P; X3 Y+ q
5 {1 N [% M, H+ g. u2 qheading
4 @/ ?+ e! k6 w2 Q {5 B8 ~2 L8 P+ N" b) A* U
color: red;
& v& n" G, E" q8 V/ F2 _8 f font-size:60px;5 n' r% F' x$ L5 [+ r# z
display: block;
/ s0 N/ W; K0 i. @' W* `; X } Q2 w* ?$ U& b' P
6 y5 ~$ H9 X- ]/ L& X! f+ q/ N ibody7 W0 v, n7 |4 T2 ` h+ K
{
5 A+ w+ G: T0 u0 U, k1 a3 ` color: blue;
' c* s/ S7 Z% d3 ?) l, C5 x& |! o. G0 }6 T font-size:35px;
3 @/ j/ n: x4 p0 N display: block;. ?* t: X. q) D. w0 i; p
}. [+ ^- \. C2 ]* F
查看效果
通过上面的例子,您可以看到,CSS 元素选择器(类型选择器)可以设置 XML 文档中元素的样式。
如果您需要更多关于为 XML 文档添加样式的知识,请访问 w3school 的 XML 教程。