1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
698
699
700
701
702
703
704
705
706
707
708
709
710
711
712
713
714
715
716
717
718
719
720
721
722
723
724
725
726
727
728
729
730
731
732
733
734
735
736
737
738
739
740
741
742
743
744
745
746
747
748
749
750
751
752
753
754
755
756
757
758
759
760
761
762
763
764
765
766
767
768
769
770
771
772
773
774
775
776
777
778
779
780
781
782
783
784
785
786
787
788
789
790
791
792
793
794
795
796
797
798
799
800
801
802
803
804
805
806
807
808
809
810
811
812
813
814
815
816
817
818
819
820
821
822
823
824
825
826
827
828
829
830
831
832
833
834
835
836
837
838
839
840
841
842
843
844
845
846
847
848
849
850
851
852
853
854
855
856
857
858
859
860
861
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <link rel="stylesheet" type="text/css" href="{{componentAssets}}/w3.css">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly{{>stylesheet-theme-css}}
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <a href="http://www.w3.org/TR/html401/struct/objects.html">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly previous</a> <a href="http://www.w3.org/TR/html401/present/graphics.html">next</a> <a href="http://www.w3.org/TR/html401/cover.html#minitoc">contents</a> <a href="http://www.w3.org/TR/html401/index/elements.html">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly elements</a> <a href="http://www.w3.org/TR/html401/index/attributes.html">attributes</a> <a href="http://www.w3.org/TR/html401/index/list.html">index</a>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <h1 align="center"><a name="h-14">14</a> <a name="stylesheets">Style
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <li><a class="tocxref" href="#h-14.1">Introduction to style sheets</a></li>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <li><a class="tocxref" href="#h-14.2">Adding style to HTML</a>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <li><a class="tocxref" href="#h-14.2.1">Setting the default style sheet
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <li><a class="tocxref" href="#h-14.2.2">Inline style information</a></li>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <li><a class="tocxref" href="#h-14.2.3">Header style information: the <samp class="einst2">STYLE</samp> element</a></li>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <li><a class="tocxref" href="#h-14.2.4">Media types</a></li>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <li><a class="tocxref" href="#h-14.3">External style sheets</a>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <li><a class="tocxref" href="#h-14.3.1">Preferred and alternate style
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <li><a class="tocxref" href="#h-14.3.2">Specifying external style
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <li><a class="tocxref" href="#h-14.4">Cascading style sheets</a>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <li><a class="tocxref" href="#h-14.4.1">Media-dependent cascades</a></li>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <li><a class="tocxref" href="#h-14.4.2">Inheritance and cascading</a></li>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <li><a class="tocxref" href="#h-14.5">Hiding style data from user
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <li><a class="tocxref" href="#h-14.6">Linking to style sheets with HTTP
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <h2><a name="h-14.1">14.1</a> <span class="index-inst" title="style
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly sheet::introduction to"><a name="idx-style_sheet-3">Introduction to style
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>Style sheets represent a major breakthrough for Web page designers,
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly expanding their ability to improve the appearance of their pages. In the
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly scientific environments in which the Web was conceived, people are more
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly concerned with the content of their documents than the presentation. As people
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly from wider walks of life discovered the Web, the limitations of HTML became a
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly source of continuing frustration and authors were forced to sidestep HTML's
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly stylistic limitations. While the intentions have been good -- to improve the
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly presentation of Web pages -- the techniques for doing so have had unfortunate
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly side effects. These techniques work for some of the people, some of the time,
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly but not for all of the people, all of the time. They include:</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <li>Using images for white space control</li>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <li>Writing a program instead of using HTML</li>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>These techniques considerably increase the complexity of Web pages, offer
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly limited flexibility, suffer from interoperability problems, and create
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly hardships for people with disabilities.</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>Style sheets solve these problems at the same time they supersede the
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly limited range of presentation mechanisms in HTML. Style sheets make it easy to
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly specify the amount of white space between text lines, the amount lines are
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly indented, the colors used for the text and the backgrounds, the font size and
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly style, and a host of other details.</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>For example, the following short CSS style sheet (stored in the file
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly "special.css"), sets the text color of a paragraph to green and surrounds it
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly with a solid red border:</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly color : green;
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly border: solid red;
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>Authors may link this style sheet to their source HTML document with the <a href="http://www.w3.org/TR/html401/struct/links.html#edef-LINK" class="noxref"><samp class="einst">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <pre><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <LINK href="special.css" rel="stylesheet" type="text/css">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly </HEAD>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <P class="special">This paragraph should have special green text.
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly </BODY>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly </HTML>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>HTML 4 provides support for the following style sheet features:</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <dt><b>Flexible placement of style information</b></dt>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <dd>Placing style sheets in separate files makes them easy to reuse. Sometimes
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly it's useful to include rendering instructions within the document to which they
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly apply, either grouped at the start of the document, or in attributes of the
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly elements throughout the body of the document. To make it easier to manage style
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly on a site basis, this specification describes how to use HTTP headers to set
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly the style sheets to be applied to a document.</dd>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <dt><b>Independence from specific style sheet languages</b></dt>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <dd>This specification doesn't tie HTML to any particular style sheet language.
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly This allows for a range of such languages to be used, for instance simple ones
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly for the majority of users and much more complex ones for the minority of users
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly with highly specialized needs. The examples included below all use the CSS
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly (Cascading Style Sheets) language <a rel="biblioentry" href="http://www.w3.org/TR/html401/references.html#ref-CSS1" class="informref">[CSS1]</a>, but other style
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly sheet languages would be possible.</dd>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <dd>This is the capability provided by some style sheet languages such as CSS
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly to allow style information from several sources to be blended together. These
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly could be, for instance, corporate style guidelines, styles common to a group of
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly documents, and styles specific to a single document. By storing these
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly separately, style sheets can be reused, simplifying authoring and making more
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly effective use of network caching. The cascade defines an ordered sequence of
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly style sheets where rules in later sheets have greater precedence than earlier
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly ones. Not all style sheet languages support cascading.</dd>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <dt><span class="index-inst" title="accessibility::and style sheets"><a name="idx-accessibility"><b>Media dependencies</b></a></span></dt>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <dd>HTML allows authors to specify documents in a media-independent way. This
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly allows users to access Web pages using a wide variety of devices and media,
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly e.g., graphical displays for computers running Windows, Macintosh OS, and X11,
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly devices for television sets, specially adapted phones and PDA-based portable
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly devices, speech-based browsers, and braille-based tactile devices.
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>Style sheets, by contrast, apply to specific media or media groups. A style
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly sheet intended for screen use may be applicable when printing, but is of little
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly use for speech-based browsers. This specification allows you to define the
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly broad categories of media a given style sheet is applicable to. This allows
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly user agents to avoid retrieving inappropriate style sheets. Style sheet
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly languages may include features for describing media dependencies within the
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly same style sheet.</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <dd>Authors may wish to offer readers several ways to view a document. For
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly instance, a style sheet for rendering compact documents with small fonts, or
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly one that specifies larger fonts for increased legibility. This specification
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly allows authors to specify a preferred style sheet as well as alternates that
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly target specific users or media. User agents should give users the opportunity
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly to select from among alternate style sheets or to switch off style sheets
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly altogether.</dd>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <dd>Some people have voiced concerns over performance issues for style sheets.
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly For instance, retrieving an external style sheet may delay the full
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly presentation for the user. A similar situation arises if the document head
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly includes a lengthy set of style rules.
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>The current proposal addresses these issues by allowing authors to include
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly rendering instructions within each HTML element. The rendering information is
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly then always available by the time the user agent wants to render each
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>In many cases, authors will take advantage of a common style sheet for a
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly group of documents. In this case, distributing style rules throughout the
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly document will actually lead to worse performance than using a linked style
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly sheet, since for most documents, the style sheet will already be present in the
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly local cache. The public availability of good style sheets will encourage this
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <h2><a name="h-14.2">14.2</a> Adding style to HTML</h2>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p><em><strong>Note.</strong> The sample default style sheet for HTML 4 that is
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly included in <a rel="biblioentry" href="http://www.w3.org/TR/html401/references.html#ref-CSS2" class="informref">[CSS2]</a> expresses generally accepted default style information
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly for each element. Authors and implementors alike might find this a useful
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>HTML documents may contain style sheet rules directly in them or they may
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly import style sheets.</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>Any style sheet language may be used with HTML. A simple style sheet
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly language may suffice for the needs of most users, but other languages may be
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly more suited to highly specialized needs. This specification uses the style
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly language "Cascading Style Sheets" (<a rel="biblioentry" href="http://www.w3.org/TR/html401/references.html#ref-CSS1" class="informref">[CSS1]</a>), abbreviated CSS,
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly for examples.</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>The <a href="http://www.w3.org/TR/html401/types.html#type-style">syntax of style data</a> depends on
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly the style sheet language.</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <h3><a name="h-14.2.1">14.2.1</a> <span class="index-inst" title="default::style sheet language|style sheet
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly language::default|HTTP::Content-Style-Type header|Content-Style-Type header"><a name="default-style">Setting the default style sheet language</a></span></h3>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>Authors must specify the style sheet language of style information
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly associated with an HTML document.</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>Authors should use the <a href="http://www.w3.org/TR/html401/struct/global.html#edef-META" class="noxref"><samp class="einst">META</samp></a> element to set the default style
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly sheet language for a document. For example, to set the default to CSS, authors
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly should put the following declaration in the <a href="http://www.w3.org/TR/html401/struct/global.html#edef-HEAD" class="noxref"><samp class="einst">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <pre><META http-equiv="Content-Style-Type" content="text/css">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>The default style sheet language may also be set with HTTP headers. The
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly above <a href="http://www.w3.org/TR/html401/struct/global.html#edef-META" class="noxref"><samp class="einst">META</samp></a> declaration is equivalent to the HTTP header:</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>User agents should determine the default style sheet language for a document
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly according to the following steps (highest to lowest priority):</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <li>If any <a href="http://www.w3.org/TR/html401/struct/global.html#edef-META" class="noxref"><samp class="einst">META</samp></a> declarations specify the "Content-Style-Type",
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly the last one in the character stream determines the default style sheet
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly language.</li>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <li>Otherwise, if any HTTP headers specify the "Content-Style-Type", the last
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly one in the character stream determines the default style sheet language.</li>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <li>Otherwise, the default style sheet language is "text/css".</li>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>Documents that include elements that set the <a href="http://www.w3.org/TR/html401/present/styles.html#adef-style" class="noxref"><samp class="ainst">style</samp></a>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly attribute but which don't define a default style sheet language are incorrect.
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <span class="index-inst" title="authoring tool::and default style sheet
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly language"><a name="idx-authoring_tool">Authoring tools</a></span> should
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly generate default style sheet language information (typically a <a href="http://www.w3.org/TR/html401/struct/global.html#edef-META" class="noxref"><samp class="einst">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly META</samp></a> declaration) so that user agents do not have to rely on a
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <h3><a name="h-14.2.2">14.2.2</a> <a name="style-element">Inline style
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <dt><a name="adef-style"><samp class="adef">style</samp></a> = <a href="http://www.w3.org/TR/html401/types.html#type-style"><em>style</em></a> <a href="http://www.w3.org/TR/html401/types.html#case-neutral">[CN]</a></dt>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <dd>This attribute specifies style information for the current element.</dd>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p><span class="index-inst" title="style sheet::inline rules"><a name="idx-style_sheet-4">The</a></span> <a href="http://www.w3.org/TR/html401/types.html#type-style">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly syntax</a> of the value of the <a href="http://www.w3.org/TR/html401/present/styles.html#adef-style" class="noxref">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <samp class="ainst">style</samp></a> attribute is determined by the <a href="#default-style">default style sheet language</a>. For example, for [[CSS2]]
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly inline style, use the declaration block syntax described in section 4.1.8
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly (without curly brace delimiters).</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>This CSS example sets color and font size information for the text in a
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly specific paragraph.</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <pre><P style="font-size: 12pt; color: fuchsia">Aren't style sheets wonderful?
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>In CSS, property declarations have the form "name : value" and are separated
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly by a semi-colon.</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>To specify style information for more than one element, authors should use
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly the <samp class="edef">STYLE</samp> element. For optimal flexibility, authors
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly should define styles in external style sheets.</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <h3><a name="h-14.2.3">14.2.3</a> <a name="style-group">Header style
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly information</a>: the <a name="edef-STYLE"><samp class="edef">STYLE</samp></a>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <pre class="dtd-fragment"><!ELEMENT <a href="http://www.w3.org/TR/html401/present/styles.html#edef-STYLE" class="noxref"><samp class="einst">STYLE</samp></a> - - <a href="http://www.w3.org/TR/html401/sgml/dtd.html#StyleSheet">%StyleSheet</a> -- style info -->
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <!ATTLIST STYLE
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <a href="http://www.w3.org/TR/html401/sgml/dtd.html#i18n">%i18n;</a> -- <a href="http://www.w3.org/TR/html401/struct/dirlang.html#adef-lang">lang</a>, <a href="http://www.w3.org/TR/html401/struct/dirlang.html#adef-dir">dir</a>, for use with title --
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <a href="http://www.w3.org/TR/html401/present/styles.html#adef-type-STYLE" class="noxref"><samp class="ainst-STYLE">type</samp></a> <a href="http://www.w3.org/TR/html401/sgml/dtd.html#ContentType">%ContentType;</a> #REQUIRED -- content type of style language --
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <a href="http://www.w3.org/TR/html401/present/styles.html#adef-media" class="noxref"><samp class="ainst-STYLE">media</samp></a> <a href="http://www.w3.org/TR/html401/sgml/dtd.html#MediaDesc">%MediaDesc;</a> #IMPLIED -- designed for use with these media --
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <a href="http://www.w3.org/TR/html401/struct/global.html#adef-title" class="noxref"><samp class="ainst-STYLE">title</samp></a> <a href="http://www.w3.org/TR/html401/sgml/dtd.html#Text">%Text;</a> #IMPLIED -- advisory title --
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p><em>Start tag: <strong>required</strong>, End tag: <strong>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <dt><a name="adef-type-STYLE"><samp class="adef">type</samp></a> = <a href="http://www.w3.org/TR/html401/types.html#type-content-type"><em>content-type</em></a> <a href="http://www.w3.org/TR/html401/types.html#case-insensitive">[CI]</a></dt>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <dd>This attribute specifies the style sheet language of the element's contents
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly and overrides the default style sheet language. The style sheet language is
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly specified as a content type (e.g., "text/css"). Authors must supply a value for
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly this attribute; there is no default value for this attribute.</dd>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <dt><a name="adef-media"><samp class="adef">media</samp></a> = <a href="http://www.w3.org/TR/html401/types.html#type-media-descriptors"><em>media-descriptors</em></a> <a href="http://www.w3.org/TR/html401/types.html#case-insensitive">[CI]</a></dt>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <dd>This attribute specifies the intended destination medium for style
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly information. It may be a single media descriptor or a comma-separated list. The
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly default value for this attribute is "screen".</dd>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <li><a href="http://www.w3.org/TR/html401/struct/dirlang.html#adef-lang" class="noxref"><samp class="ainst">lang</samp></a> (<a href="http://www.w3.org/TR/html401/struct/dirlang.html#language-info">language information</a>), <a href="http://www.w3.org/TR/html401/struct/dirlang.html#adef-dir" class="noxref"><samp class="ainst">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly dir</samp></a> (<a href="http://www.w3.org/TR/html401/struct/dirlang.html#bidirection">text
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <li><a href="http://www.w3.org/TR/html401/struct/global.html#adef-title" class="noxref"><samp class="ainst">title</samp></a> (<a href="http://www.w3.org/TR/html401/struct/global.html#title">element
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>The <a href="http://www.w3.org/TR/html401/present/styles.html#edef-STYLE" class="noxref"><samp class="einst">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly STYLE</samp></a> element allows authors to put style sheet rules in the <span class="index-inst" title="style sheet::rules in HEAD"><a name="idx-style_sheet-5">head</a></span> of the document. HTML permits any number of
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <a href="http://www.w3.org/TR/html401/present/styles.html#edef-STYLE" class="noxref"><samp class="einst">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly STYLE</samp></a> elements in the <a href="http://www.w3.org/TR/html401/struct/global.html#edef-HEAD" class="noxref"><samp class="einst">HEAD</samp></a> section of a document.</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>User agents that don't support style sheets, or don't support the specific
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly style sheet language used by a <a href="http://www.w3.org/TR/html401/present/styles.html#edef-STYLE" class="noxref">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <samp class="einst">STYLE</samp></a> element, must hide the contents of the <a href="http://www.w3.org/TR/html401/present/styles.html#edef-STYLE" class="noxref"><samp class="einst">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly STYLE</samp></a> element. <span class="index-inst" title="error::rendering
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly style rules in STYLE"><a name="idx-error">It is an error</a></span> to render
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly the content as part of the document's text. Some style sheet languages support
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly syntax for <a href="#hiding">hiding the content</a> from non-conforming user
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>The <a href="http://www.w3.org/TR/html401/types.html#type-style">syntax of style data</a> depends on
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly the style sheet language.</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>Some style sheet implementations may allow a wider variety of rules in the
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <a href="http://www.w3.org/TR/html401/present/styles.html#edef-STYLE" class="noxref"><samp class="einst">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly STYLE</samp></a> element than in the <a href="http://www.w3.org/TR/html401/present/styles.html#adef-style" class="noxref"><samp class="ainst">style</samp></a> attribute. For example, with CSS,
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly rules may be declared within a <a href="http://www.w3.org/TR/html401/present/styles.html#edef-STYLE" class="noxref">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <samp class="einst">STYLE</samp></a> element for:</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <li>All instances of a specific HTML element (e.g., all <a href="http://www.w3.org/TR/html401/struct/text.html#edef-P" class="noxref"><samp class="einst">P</samp></a>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly elements, all <a href="http://www.w3.org/TR/html401/struct/global.html#edef-H1" class="noxref"><samp class="einst">H1</samp></a> elements, etc.)</li>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <li>All instances of an HTML element belonging to a specific class (i.e., whose
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <a href="http://www.w3.org/TR/html401/struct/global.html#adef-class" class="noxref"><samp class="ainst">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly class</samp></a> attribute is set to some value).</li>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <li>Single instances of an HTML element (i.e., whose <a href="http://www.w3.org/TR/html401/struct/global.html#adef-id" class="noxref"><samp class="ainst">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly id</samp></a> attribute is set to some value).</li>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>Rules for style rule precedences and inheritance depend on the style sheet
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly language.</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>The following CSS <a href="http://www.w3.org/TR/html401/present/styles.html#edef-STYLE" class="noxref"><samp class="einst">STYLE</samp></a> declaration puts a border around every <a href="http://www.w3.org/TR/html401/struct/global.html#edef-H1" class="noxref"><samp class="einst">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly H1</samp></a> element in the document and centers it on the page.</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <pre><HEAD>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly H1 {border-width: 1; border: solid; text-align: center}
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly </STYLE>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly </HEAD>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>To specify that this style information should only apply to <a href="http://www.w3.org/TR/html401/struct/global.html#edef-H1" class="noxref"><samp class="einst">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly H1</samp></a> elements of a specific class, we modify it as follows:</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <pre><HEAD>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly H1.myclass {border-width: 1; border: solid; text-align: center}
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly </STYLE>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly </HEAD>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <H1 class="myclass"> This H1 is affected by our style </H1>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <H1> This one is not affected by our style </H1>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly </BODY>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>Finally, to limit the scope of the style information to a single instance of
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <a href="http://www.w3.org/TR/html401/struct/global.html#edef-H1" class="noxref"><samp class="einst">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly H1</samp></a>, set the <a href="http://www.w3.org/TR/html401/struct/global.html#adef-id" class="noxref">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <samp class="ainst">id</samp></a> attribute:</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <pre><HEAD>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly #myid {border-width: 1; border: solid; text-align: center}
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly </STYLE>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly </HEAD>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <H1 class="myclass"> This H1 is not affected </H1>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <H1 id="myid"> This H1 is affected by style </H1>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <H1> This H1 is not affected </H1>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly </BODY>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p><span class="index-inst" title="style sheet::used with DIV and SPAN"><a name="idx-style_sheet-6">Although style information</a></span> may be set for
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly almost every HTML element, two elements, <a href="http://www.w3.org/TR/html401/struct/global.html#edef-DIV" class="noxref"><samp class="einst">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly DIV</samp></a> and <a href="http://www.w3.org/TR/html401/struct/global.html#edef-SPAN" class="noxref">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <samp class="einst">SPAN</samp></a>, are particularly useful in that they do
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly not impose any presentation semantics (besides <a href="http://www.w3.org/TR/html401/struct/global.html#block-inline">block-level vs. inline</a>). When combined
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly with style sheets, these elements allow users to extend HTML indefinitely,
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly particularly when used with the <a href="http://www.w3.org/TR/html401/struct/global.html#adef-class" class="noxref"><samp class="ainst">class</samp></a> and <a href="http://www.w3.org/TR/html401/struct/global.html#adef-id" class="noxref"><samp class="ainst">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>In the following example, we use the <a href="http://www.w3.org/TR/html401/struct/global.html#edef-SPAN" class="noxref"><samp class="einst">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly SPAN</samp></a> element to set the font style of the first few words of a
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly paragraph to small caps.</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <pre><HEAD>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly SPAN.sc-ex { font-variant: small-caps }
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly </STYLE>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly </HEAD>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <P><SPAN class="sc-ex">The first</SPAN> few words of
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly this paragraph are in small-caps.
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly </BODY>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>In the following example, we use <a href="http://www.w3.org/TR/html401/struct/global.html#edef-DIV" class="noxref"><samp class="einst">DIV</samp></a> and the <a href="http://www.w3.org/TR/html401/struct/global.html#adef-class" class="noxref"><samp class="ainst">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly class</samp></a> attribute to set the text justification for a series of
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly paragraphs that make up the abstract section of a scientific article. This
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly style information could be reused for other abstract sections by setting the <a href="http://www.w3.org/TR/html401/struct/global.html#adef-class" class="noxref"><samp class="ainst">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly class</samp></a> attribute elsewhere in the document.</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <pre><HEAD>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly DIV.Abstract { text-align: justify }
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly </STYLE>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly </HEAD>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <DIV class="Abstract">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <P>The Chieftain product range is our market winner for
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly the coming year. This report sets out how to position
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly Chieftain against competing products.
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <P>Chieftain replaces the Commander range, which will
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly remain on the price list until further notice.
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly </BODY>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <h3><a name="h-14.2.4">14.2.4</a> <span class="index-inst" title="media::used
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly with style sheets|style sheet::target media for"><a name="media-types">Media
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>HTML allows authors to design documents that take advantage of the
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly characteristics of the media where the document is to be rendered (e.g.,
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly graphical displays, television screens, handheld devices, speech-based
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly browsers, braille-based tactile devices, etc.). By specifying the <a href="http://www.w3.org/TR/html401/present/styles.html#adef-media" class="noxref"><samp class="ainst">media</samp></a>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly attribute, authors allow user agents to load and apply style sheets
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly selectively. Please consult the list of recognized <a href="http://www.w3.org/TR/html401/types.html#type-media-descriptors">media descriptors</a>.</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>The following sample declarations apply to <a href="http://www.w3.org/TR/html401/struct/global.html#edef-H1" class="noxref"><samp class="einst">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly H1</samp></a> elements. When projected in a business meeting, all instances
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly will be blue. When printed, all instances will be centered.</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <pre><HEAD>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <STYLE type="text/css" media="projection">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly H1 { color: blue}
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly </STYLE>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly H1 { text-align: center }
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly </STYLE>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>This example adds sound effects to anchors for use in speech output:</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <pre> <STYLE type="text/css" media="aural">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly A { cue-before: uri(bell.aiff); cue-after: uri(dong.wav)}
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly </STYLE>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly </HEAD>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>Media control is particularly interesting when applied to external style
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly sheets since user agents can save time by retrieving from the network only
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly those style sheets that apply to the current device. For instance, speech-based
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly browsers can avoid downloading style sheets designed for visual rendering. See
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly the section on <a href="#media-cascades">media-dependent cascades</a> for more
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly information.</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <h2><a name="h-14.3">14.3</a> <span class="index-inst" title="style
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly sheet::external"><a name="style-external">External style sheets</a></span></h2>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>Authors may separate style sheets from HTML documents. This offers several
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly benefits:</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <li>Authors and Web site managers may share style sheets across a number of
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly documents (and sites).</li>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <li>Authors may change the style sheet without requiring modifications to the
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly document.</li>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <li>User agents may load style sheets selectively (based on media
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly descriptions).</li>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <h3><a name="h-14.3.1">14.3.1</a> Preferred and alternate style sheets</h3>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>HTML allows authors to associate any number of external style sheets with a
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly document. The style sheet language defines how multiple external style sheets
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly interact (for example, the CSS "cascade" rules).</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p><span class="index-def" title="style sheet::alternate|alternate style
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly sheets"><a name="didx-style_sheet">Authors may specify a number of mutually
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly exclusive style sheets called <dfn>alternate</dfn> style sheets.</a></span>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly Users may select their favorite among these depending on their preferences. For
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly instance, an author may specify one style sheet designed for small screens and
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly another for users with weak vision (e.g., large fonts). User agents should
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly allow users to select from alternate style sheets.</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p><span class="index-def" title="style sheet::preferred|preferred style
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly sheets"><a name="didx-style_sheet-1">The author may specify that one of the
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly alternates is a <dfn>preferred</dfn> style sheet.</a></span> User agents should
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly apply the author's preferred style sheet unless the user has selected a
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly different alternate.</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>Authors may group several alternate style sheets (including the author's
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly preferred style sheets) under a single <dfn>style name</dfn>. When a user
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly selects a named style, the user agent must apply all style sheets with that
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly name. User agents must not apply alternate style sheets with a different style
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly name. The section on <a href="#specifying-external">specifying external style
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly sheets</a> explains how to name a group of style sheets.</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p><span class="index-def" title="style sheet::persistent|persistent style
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly sheets"><a name="didx-style_sheet-2">Authors may also specify <dfn>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly persistent</dfn> style sheets that user agents must apply in addition to any
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>User agents must respect <a href="http://www.w3.org/TR/html401/types.html#type-media-descriptors">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly media descriptors</a> when applying any style sheet.</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>User agents should also allow users to disable the author's style sheets
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly entirely, in which case the user agent must not apply any persistent or
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly alternate style sheets.</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <h3><a name="h-14.3.2">14.3.2</a> <span class="index-inst" title="style
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly sheet::specification of external|link::and external style sheets"><a name="specifying-external">Specifying external style sheets</a></span></h3>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>Authors specify external style sheets with the following attributes of the
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <a href="http://www.w3.org/TR/html401/struct/links.html#edef-LINK" class="noxref"><samp class="einst">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <li>Set the value of <a href="http://www.w3.org/TR/html401/struct/links.html#adef-href" class="noxref">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <samp class="ainst">href</samp></a> to the location of the style sheet file.
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly The value of <a href="http://www.w3.org/TR/html401/struct/links.html#adef-href" class="noxref"><samp class="ainst">href</samp></a> is a <a href="http://www.w3.org/TR/html401/types.html#type-uri">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <li>Set the value of the <a href="http://www.w3.org/TR/html401/struct/links.html#adef-type-A" class="noxref"><samp class="ainst-A">type</samp></a> attribute to indicate the
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly language of the linked (style sheet) resource. This allows the user agent to
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly avoid downloading a style sheet for an unsupported style sheet language.</li>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <li>Specify that the style sheet is persistent, preferred, or alternate:
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <li>To make a style sheet persistent, set the <a href="http://www.w3.org/TR/html401/struct/links.html#adef-rel" class="noxref"><samp class="ainst">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly rel</samp></a> attribute to "stylesheet" and don't set the <a href="http://www.w3.org/TR/html401/struct/global.html#adef-title" class="noxref"><samp class="ainst">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <li>To make a style sheet preferred, set the <a href="http://www.w3.org/TR/html401/struct/links.html#adef-rel" class="noxref"><samp class="ainst">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly rel</samp></a> attribute to "stylesheet" and name the style sheet with the <a href="http://www.w3.org/TR/html401/struct/global.html#adef-title" class="noxref"><samp class="ainst">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <li>To specify an alternate style sheet, set the <a href="http://www.w3.org/TR/html401/struct/links.html#adef-rel" class="noxref"><samp class="ainst">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly rel</samp></a> attribute to "alternate stylesheet" and name the style sheet
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly with the <a href="http://www.w3.org/TR/html401/struct/global.html#adef-title" class="noxref"><samp class="ainst">title</samp></a> attribute.</li>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>User agents should provide a means for users to view and pick from the list
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly of alternate styles. The value of the <a href="http://www.w3.org/TR/html401/struct/global.html#adef-title" class="noxref"><samp class="ainst">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly title</samp></a> attribute is recommended as the name of each choice.</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>In this example, we first specify a persistent style sheet located in the
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <pre><LINK href="mystyle.css" rel="stylesheet" type="text/css">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>Setting the <a href="http://www.w3.org/TR/html401/struct/global.html#adef-title" class="noxref"><samp class="ainst">title</samp></a> attribute makes this the author's preferred
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly style sheet:</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <pre> <LINK href="mystyle.css" title="compact" rel="stylesheet" type="text/css">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>Adding the keyword "alternate" to the <a href="http://www.w3.org/TR/html401/struct/links.html#adef-rel" class="noxref"><samp class="ainst">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly rel</samp></a> attribute makes it an alternate style sheet:</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <pre><LINK href="mystyle.css" title="Medium" rel="alternate stylesheet" type="text/css">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>For more information on external style sheets, please consult the section on
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <a href="http://www.w3.org/TR/html401/struct/links.html#linksandss">links and external style
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p><span class="index-inst" title="HTTP::Default-Style header|style
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly sheet::specification of preferred">Authors may also use the <a name="idx-HTTP-1" href="http://www.w3.org/TR/html401/struct/global.html#edef-META" class="noxref"><samp class="einst">META</samp></a> element to set the document's preferred style
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly sheet.</span> For example, to set the preferred style sheet to "compact" (see
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly the preceding example), authors may include the following line in the <a href="http://www.w3.org/TR/html401/struct/global.html#edef-HEAD" class="noxref"><samp class="einst">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <pre><META http-equiv="Default-Style" content="compact">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>The preferred style sheet may also be specified with HTTP headers. The above
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <a href="http://www.w3.org/TR/html401/struct/global.html#edef-META" class="noxref"><samp class="einst">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly META</samp></a> declaration is equivalent to the HTTP header:</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <pre>Default-Style: "compact"
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>If two or more <a href="http://www.w3.org/TR/html401/struct/global.html#edef-META" class="noxref">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <samp class="einst">META</samp></a> declarations or HTTP headers specify the
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly preferred style sheet, the last one takes precedence. HTTP headers are
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly considered to occur earlier than the document <a href="http://www.w3.org/TR/html401/struct/global.html#edef-HEAD" class="noxref"><samp class="einst">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>If two or more <a href="http://www.w3.org/TR/html401/struct/links.html#edef-LINK" class="noxref"><samp class="einst">LINK</samp></a> elements specify a preferred style sheet, the
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly first one takes precedence.</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>Preferred style sheets specified with <a href="http://www.w3.org/TR/html401/struct/global.html#edef-META" class="noxref"><samp class="einst">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly META</samp></a> or HTTP headers have precedence over those specified with the
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <a href="http://www.w3.org/TR/html401/struct/links.html#edef-LINK" class="noxref"><samp class="einst">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <h2><a name="h-14.4">14.4</a> <span class="index-inst" title="style
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly sheet::cascading|cascading style sheets"><a name="idx-style_sheet-11">Cascading
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p><dfn>Cascading</dfn> style sheet languages such as CSS allow style
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly information from several sources to be blended together. However, not all style
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly sheet languages support cascading. To define a cascade, authors specify a
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly sequence of <a href="http://www.w3.org/TR/html401/struct/links.html#edef-LINK" class="noxref"><samp class="einst">LINK</samp></a> and/or <a href="http://www.w3.org/TR/html401/present/styles.html#edef-STYLE" class="noxref"><samp class="einst">STYLE</samp></a> elements. The style information
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly is cascaded in the order the elements appear in the <a href="http://www.w3.org/TR/html401/struct/global.html#edef-HEAD" class="noxref"><samp class="einst">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p><em><strong>Note.</strong> This specification does not specify how style
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly sheets from different style languages cascade. Authors should avoid mixing
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>In the following example, we specify two alternate style sheets named
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly "compact". If the user selects the "compact" style, the user agent must apply
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly both external style sheets, as well as the persistent "common.css" style sheet.
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly If the user selects the "big print" style, only the alternate style sheet
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly "bigprint.css" and the persistent "common.css" will be applied.</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <pre><LINK rel="alternate stylesheet" title="compact" href="small-base.css" type="text/css">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <LINK rel="alternate stylesheet" title="compact" href="small-extras.css" type="text/css">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <LINK rel="alternate stylesheet" title="big print" href="bigprint.css" type="text/css">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <LINK rel="stylesheet" href="common.css" type="text/css">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>Here is a cascade example that involves both the <a href="http://www.w3.org/TR/html401/struct/links.html#edef-LINK" class="noxref"><samp class="einst">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly LINK</samp></a> and <a href="http://www.w3.org/TR/html401/present/styles.html#edef-STYLE" class="noxref"><samp class="einst">STYLE</samp></a> elements.</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <pre><LINK rel="stylesheet" href="corporate.css" type="text/css">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <LINK rel="stylesheet" href="techreport.css" type="text/css">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly p.special { color: rgb(230, 100, 180) }
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly </STYLE>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <h3><a name="h-14.4.1">14.4.1</a> <span class="index-inst" title="media::and
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly external style sheets|link::and media-dependent style sheets"><a name="media-cascades">Media-dependent cascades</a></span></h3>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>A cascade may include style sheets applicable to different media. Both <a href="http://www.w3.org/TR/html401/struct/links.html#edef-LINK" class="noxref"><samp class="einst">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly LINK</samp></a> and <a href="http://www.w3.org/TR/html401/present/styles.html#edef-STYLE" class="noxref"><samp class="einst">STYLE</samp></a> may be used with the <a href="http://www.w3.org/TR/html401/present/styles.html#adef-media" class="noxref"><samp class="ainst">media</samp></a>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly attribute. The user agent is then responsible for filtering out those style
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly sheets that do not apply to the current medium.</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>In the following example, we define a cascade where the "corporate" style
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly sheet is provided in several versions: one suited to printing, one for screen
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly use and one for speech-based browsers (useful, say, when reading email in the
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly car). The "techreport" stylesheet applies to all media. The color rule defined
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly by the <a href="http://www.w3.org/TR/html401/present/styles.html#edef-STYLE" class="noxref"><samp class="einst">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly STYLE</samp></a> element is used for print and screen but not for aural
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly rendering.</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <pre><LINK rel="stylesheet" media="aural" href="corporate-aural.css" type="text/css">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <LINK rel="stylesheet" media="screen" href="corporate-screen.css" type="text/css">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <LINK rel="stylesheet" media="print" href="corporate-print.css" type="text/css">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <LINK rel="stylesheet" href="techreport.css" type="text/css">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <STYLE media="screen, print" type="text/css">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly p.special { color: rgb(230, 100, 180) }
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly </STYLE>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <h3><a name="h-14.4.2">14.4.2</a> Inheritance and cascading</h3>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>When the user agent wants to render a document, it needs to find values for
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly style properties, e.g. the font family, font style, size, line height, text
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly color and so on. The exact mechanism depends on the style sheet language, but
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly the following description is generally applicable:</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>The cascading mechanism is used when a number of style rules all apply
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly directly to an element. The mechanism allows the user agent to sort the rules
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly by specificity, to determine which rule to apply. If no rule can be found, the
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly next step depends on whether the style property can be inherited or not. Not
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly all properties can be inherited. For these properties the style sheet language
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly provides default values for use when there are no explicit rules for a
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly particular element.</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>If the property can be inherited, the user agent examines the immediately
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly enclosing element to see if a rule applies to that. This process continues
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly until an applicable rule is found. This mechanism allows style sheets to be
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly specified compactly. For instance, authors may specify the font family for all
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly elements within the <a href="http://www.w3.org/TR/html401/struct/global.html#edef-BODY" class="noxref">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <samp class="einst">BODY</samp></a> by a single rule that applies to the <a href="http://www.w3.org/TR/html401/struct/global.html#edef-BODY" class="noxref"><samp class="einst">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <h2><a name="h-14.5">14.5</a> <span class="index-inst" title="user agent::and
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly style data|style sheet::comments to hide|comments::used to hide style sheet
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly data"><a name="hiding">Hiding style data from user agents</a></span></h2>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>Some style sheet languages support syntax intended to allow authors to hide
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly the content of <a href="http://www.w3.org/TR/html401/present/styles.html#edef-STYLE" class="noxref"><samp class="einst">STYLE</samp></a> elements from non-conforming user agents.</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>This example illustrates for CSS how to comment out the content of <a href="http://www.w3.org/TR/html401/present/styles.html#edef-STYLE" class="noxref"><samp class="einst">STYLE</samp></a>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly elements to ensure that older, non-conforming user agents will not render them
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly H1 { color: red }
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly P { color: blue}
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly </STYLE>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <h2><a name="h-14.6">14.6</a> <span class="index-inst" title="HTTP::used to
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly link external style sheets"><a name="idx-HTTP-2">Linking to style sheets with
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p><em>This section only applies to user agents conforming to versions of HTTP
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly that define a Link header field. Note that HTTP 1.1 as defined by <a rel="biblioentry" href="http://www.w3.org/TR/html401/references.html#ref-RFC2616" class="informref">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly [RFC2616]</a> does not include a Link header field (refer to section
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>Web server managers may find it convenient to configure a server so that a
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly style sheet will be applied to a group of pages. The HTTP <tt>Link</tt> header
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly has the same effect as a <a href="http://www.w3.org/TR/html401/struct/links.html#edef-LINK" class="noxref"><samp class="einst">LINK</samp></a> element with the same attributes
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly and values. Multiple <tt>Link</tt> headers correspond to multiple <a href="http://www.w3.org/TR/html401/struct/links.html#edef-LINK" class="noxref"><samp class="einst">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly LINK</samp></a> elements occurring in the same order. For instance,</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <pre>Link: <http://www.acme.com/corporate.css>; REL=stylesheet
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <pre><LINK rel="stylesheet" href="http://www.acme.com/corporate.css">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>It is possible to specify several alternate styles using multiple <tt>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly Link</tt> headers, and then use the <a href="http://www.w3.org/TR/html401/struct/links.html#adef-rel" class="noxref"><samp class="ainst">rel</samp></a> attribute to determine the
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly default style.</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>In the following example, "compact" is applied by default since it omits the
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly "alternate" keyword for the <a href="http://www.w3.org/TR/html401/struct/links.html#adef-rel" class="noxref"><samp class="ainst">rel</samp></a> attribute.</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <pre>Link: <compact.css>; rel="stylesheet"; title="compact"
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly Link: <bigprint.css>; rel="alternate stylesheet"; title="big print"
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p>This should also work when HTML documents are sent by email. Some email
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly agents can alter the ordering of <a rel="biblioentry" href="http://www.w3.org/TR/html401/references.html#ref-RFC822" class="informref">[RFC822]</a> headers. To
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly protect against this affecting the cascading order for style sheets specified
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly by <tt>Link</tt> headers, authors can use header concatenation to merge several
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly instances of the same header field. The quote marks are only needed when the
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly attribute values include whitespace. Use SGML entities to reference characters
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly that are otherwise not permitted within HTTP or email headers, or that are
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly likely to be affected by transit through gateways.</p>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <p><a href="http://www.w3.org/TR/html401/struct/links.html#edef-LINK" class="noxref"><samp class="einst">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly LINK</samp></a> and <a href="http://www.w3.org/TR/html401/struct/global.html#edef-META" class="noxref">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <samp class="einst">META</samp></a> elements implied by HTTP headers are
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly defined as occurring before any explicit <a href="http://www.w3.org/TR/html401/struct/links.html#edef-LINK" class="noxref"><samp class="einst">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly LINK</samp></a> and <a href="http://www.w3.org/TR/html401/struct/global.html#edef-META" class="noxref">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <samp class="einst">META</samp></a> elements in the document's <a href="http://www.w3.org/TR/html401/struct/global.html#edef-HEAD" class="noxref"><samp class="einst">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <hr><a href="http://www.w3.org/TR/html401/struct/objects.html">previous</a> <a href="http://www.w3.org/TR/html401/present/graphics.html">next</a> <a href="http://www.w3.org/TR/html401/cover.html#minitoc">contents</a>
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly <a href="http://www.w3.org/TR/html401/index/elements.html">elements</a> <a href="http://www.w3.org/TR/html401/index/attributes.html">attributes</a> <a href="http://www.w3.org/TR/html401/index/list.html">
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly{{>stylesheet-theme-markup}}
5cca94d19081e525af1906a3ec18d822e3542b4fJenny Donnelly{{>stylesheet-theme-js}}