부록 A. HTML 4를 위한 스타일쉬트 견본

이 부록은 지명적이 아니고 정보제공을 위한 것이다.

이 스타일쉬트는 현재의 사용도구들의 적용을 심도있는 검토를 거쳐 모든 번역문 HTML 4 엘레멘트들에 전형적으로 양식화하여 기술하였다. 개발자들은 그들의 적용들에 있어서 이것을 디폴트(default) 스타일쉬트로 사용할 것을 권한다.

교체된(replaced) 엘레멘트들(IMG, OBJECT), 스크립팅(scripting) 엘레멘트들(SCRIPT, APPLET), 폼(form) 제어 엘레멘트들과 프레임(frame) 엘레멘트들을 포함한, 일부 HTML 엘레멘트들의 완전한 표현은 CSS2에서 표현될 수 없다.

ADDRESS, BLOCKQUOTE, BODY, DD, DIV, DL, DT, FIELDSET, FORM, FRAME, FRAMESET,
H1, H2, H3, H4, H5, H6, IFRAME, NOFRAMES, OBJECT, OL, P, UL, APPLET, CENTER,

DIR, HR, MENU, PRE { display: block }
LI { display: list-item }
HEAD { display: none }
TABLE { display: table }
TR { display: table-row }
THEAD { display: table-header-group }
TBODY { display: table-row-group }
TFOOT { display: table-footer-group }
COL { display: table-column }
COLGROUP { display: table-column-group }
TD, TH { display: table-cell }
CAPTION { display: table-caption }
TH { font-weight: bolder; text-align: center }
CAPTION { text-align: center }
BODY { padding: 8px; line-height: 1.33 }
H1 { font-size: 2em; margin: .67em 0 }
H2 { font-size: 1.5em; margin: .83em 0 }
H3 { font-size: 1.17em; margin: 1em 0 }
H4, P, BLOCKQUOTE, UL, FIELDSET, FORM, OL, DL, DIR, MENU
 { margin: 1.33em 0 }
H5 { font-size: .83em; line-height: 1.17em; margin: 1.67em 0 }
H6 { font-size: .67em; margin: 2.33em 0 }
H1, H2, H3, H4, H5, H6, B, STRONG
 { font-weight: bolder }
BLOCKQUOTE { margin-left: 40px; margin-right: 40px }
I, CITE, EM, VAR, ADDRESS { font-style: italic }
PRE, TT, CODE, KBD, SAMP { font-family: monospace }
PRE { white-space: pre }
BIG { font-size: 1.17em }
SMALL, SUB, SUP { font-size: .83em }
SUB { vertical-align: sub }
SUP { vertical-align: super }
S, STRIKE, DEL { text-decoration: line-through }
HR { border: 1px inset }
OL, UL, DIR, MENU, DD { margin-left: 40px }
OL { list-style-type: decimal }
OL UL, UL OL, UL UL, OL OL{ margin-top: 0; margin-bottom: 0 }
U, INS { text-decoration: underline }
CENTER { text-align: center }
BR:before { content: "\A" }

/* HTML 4의 약자(ABBR/ACRONYM) 엘레멘트들을 위한 스타일의 예제 */
ABBR, ACRONYM { font-variant: small-caps; letter-spacing: 0.1em }
A[href] { text-decoration: underline }
:focus { outline: thin dotted invert }


/* 양 방향성의 설정 시작(변경하지 마시오) */
BDO[DIR="ltr"] { direction: ltr; unicode-bidi: bidi-override }
BDO[DIR="rtl"] { direction: rtl; unicode-bidi: bidi-override }

*[DIR="ltr"] { direction: ltr; unicode-bidi: embed }
*[DIR="rtl"] { direction: rtl; unicode-bidi: embed }

/* HTML4 블럭레벨 엘레멘트들 */
ADDRESS, BLOCKQUOTE, BODY, DD, DIV, DL, DT, FIELDSET,
FORM, FRAME, FRAMESET, H1, H2, H3, H4, H5, H6, IFRAME,
NOSCRIPT, NOFRAMES, OBJECT, OL, P, UL, APPLET, CENTER,
DIR, HR, MENU, PRE, LI, TABLE, TR, THEAD, TBODY, TFOOT,
COL, COLGROUP, TD, TH, CAPTION
 { unicode-bidi: embed }
/* 양 방향성의 설정 종료 */


@media print {
  @page { margin: 10% }
  H1, H2, H3, H4, H5, H6 { page-break-after: avoid; page-break-inside: avoid }
  BLOCKQUOTE, PRE { page-break-inside: avoid }
  UL, OL, DL { page-break-before: avoid }
}

@media speech {
  H1, H2, H3, H4, H5, H6 { voice-family: paul, male; stress: 20; richness: 90 }
  H1 { pitch: x-low; pitch-range: 90 }
  H2 { pitch: x-low; pitch-range: 80 }
  H3 { pitch: low; pitch-range: 70 }
  H4 { pitch: medium; pitch-range: 60 }
  H5 { pitch: medium; pitch-range: 50 }
  H6 { pitch: medium; pitch-range: 40 }
  LI, DT, DD { pitch: medium; richness: 60 }
  DT { stress: 80 }
  PRE, CODE, TT { pitch: medium; pitch-range: 0; stress: 0; richness: 80 }
  EM { pitch: medium; pitch-range: 60; stress: 60; richness: 50 }
  STRONG { pitch: medium; pitch-range: 60; stress: 90; richness: 90 }
  DFN { pitch: high; pitch-range: 60; stress: 60 }
  S, STRIKE { richness: 0 }
  I { pitch: medium; pitch-range: 60; stress: 60; richness: 50 }
  B { pitch: medium; pitch-range: 60; stress: 90; richness: 90 }
  U { richness: 0 }
  A:link { voice-family: harry, male }
  A:visited { voice-family: betty, female }
  A:active { voice-family: betty, female; pitch-range: 80; pitch: x-high }
}

맨위이 문서()는 자유로이 연결 사용이 가능함.
(수정일 )