css/class/multiple-class-classes-selector.html

<!DOCTYPE html>
<html lang="ja">
<head>
<title>1$B$D$N(B class $BB0@-$KJ#?t$N%/%i%9!"(B1$B$D$NA*Br;R$KJ#?t$N%/%i%9(B</title>
<style type="text/css">
p {
  color: gray;
}
.class1 {
  color: red;
}
.class2 {
  color: green;
}
.class1.class2 {
  color: blue;
}
</style>
</head>
<body>

<p class="class1 class2">&lt;p class="class1 class2">CSS2 
$BMxMQ<T%(!<%8%'%s%H$G$O$3$NCJMn$NJ8;z$O@D?'$,@5$7$$!#(B
CSS1 $BMxMQ<T%(!<%8%'%s%H$G$ONP?'$,@5$7$$!#(B&lt;/p></p>

<pre>
.class1 {
  color: red;
}
.class2 {
  color: green;
}
.class1.class2 {
  color: blue;
}
</pre>

<ul>
<li><a href="http://www.w3.org/TR/CSS1#class-as-selector">CSS1</a></li>
<li><a href="http://www.w3.org/TR/CSS2/selector.html#class-html">CSS2</a>
(<a href="http://www.w3.org/TR/CSS2/cascade.html#specificity">$B7W;;(B</a>)</li>
<li><a href="http://www.w3.org/TR/CSS21/selector.html#class-html">CSS 2.1</a>
(<a href="http://www.w3.org/TR/CSS21/cascade.html#specificity">$B7W;;(B</a>)</li>
<li><a href="http://www.w3.org/TR/css3-selectors/#class-html">CSS3</a>
(<a href="http://www.w3.org/TR/css3-selectors/#specificity">$B7W;;(B</a>)</li>
<li><a href="http://www.w3.org/TR/html4/struct/global.html#adef-class"
>HTML4</a></li>
<li><a href="http://www.whatwg.org/specs/web-apps/current-work/#class"
>HTML5</a></li>
</ul>

</body>
</html>
1	wakaba	1.1	<!DOCTYPE html>
2			<html lang="ja">
3			<head>
4			<title>1$B$D$N(B class $BB0@-$KJ#?t$N%/%i%9!"(B1$B$D$NA*Br;R$KJ#?t$N%/%i%9(B</title>
5			<style type="text/css">
6			p {
7			color: gray;
8			}
9			.class1 {
10			color: red;
11			}
12			.class2 {
13			color: green;
14			}
15			.class1.class2 {
16			color: blue;
17			}
18			</style>
19			</head>
20			<body>
21
22	wakaba	1.2	<p class="class1 class2"><p class="class1 class2">CSS2
23	wakaba	1.1	$BMxMQ<T%(!<%8%'%s%H$G$O$3$NCJMn$NJ8;z$O@D?'$,@5$7$$!#(B
24	wakaba	1.2	CSS1 $BMxMQ<T%(!<%8%'%s%H$G$ONP?'$,@5$7$$!#(B</p></p>
25	wakaba	1.1
26			<pre>
27			.class1 {
28			color: red;
29			}
30			.class2 {
31			color: green;
32			}
33			.class1.class2 {
34			color: blue;
35			}
36			</pre>
37
38			<ul>
39			<li><a href="http://www.w3.org/TR/CSS1#class-as-selector">CSS1</a></li>
40			<li><a href="http://www.w3.org/TR/CSS2/selector.html#class-html">CSS2</a>
41			(<a href="http://www.w3.org/TR/CSS2/cascade.html#specificity">$B7W;;(B</a>)</li>
42			<li><a href="http://www.w3.org/TR/CSS21/selector.html#class-html">CSS 2.1</a>
43			(<a href="http://www.w3.org/TR/CSS21/cascade.html#specificity">$B7W;;(B</a>)</li>
44			<li><a href="http://www.w3.org/TR/css3-selectors/#class-html">CSS3</a>
45			(<a href="http://www.w3.org/TR/css3-selectors/#specificity">$B7W;;(B</a>)</li>
46			<li><a href="http://www.w3.org/TR/html4/struct/global.html#adef-class"
47			>HTML4</a></li>
48			<li><a href="http://www.whatwg.org/specs/web-apps/current-work/#class"
49			>HTML5</a></li>
50			</ul>
51
52			</body>
53			</html>