3. CSS $B$NE,MQJ}K!(B

Since: May/30th/2004

CSS $B$r(B HTML/XHTML $BJ8=q$KE,MQ$9$k$K$O!"Bg$-$/J,$1$F;0$D$NJ}K!$,$"$j$^$9!#(B

$B30It%9%?%$%k%7!<%H(B
style $BMWAG(B
style $BB0@-(B

$B2<$K9T$/$[$IFC

$B30It%9%?%$%k%7!<%H(B

$B:G$b0lHLE*$JJ}K!$G$9!#0l$D$N%9%?%$%k%7!<%H%U%!%$%k$rJ#?t$N(B HTML/XHTML $BJ8=q$+$iFI$_9~$_$^$9!#FC$KM}M3$,$J$1$l$P!"$3$NJ}K!$@$1;H$&$h$&$K$9$Y$-$G$9!#(B

CSS $B%U%!%$%k(B

CSS $B$r5-=R$7$?%U%!%$%k$r0l$DMQ0U$7$^$9!#3HD%;R$O(B .css $B$K$J$j$^$9!#(B

atomic.css:

body { padding: 1em 5%;
    background: #ccf }
p { margin: 0.5em 0;
    padding: 1em;
    text-indent: 1em;
    line-height: 1.5;
    background: #eef }

HTML $B%U%!%$%k(B

$B$3$N(B CSS $B%U%!%$%k$rE,MQ$7$?$$(B HTML $BJ8=qB&$G$O!"(Bhead $BMWAG$K(B link $BMWAG$r5-=R$7$^$9!#(Blink $BMWAG$N(B href $BB0@-$NCM$,!"Ev3:(B HTML $BJ8=q$+$i8+$?(B CSS $B%U%!%$%k$N(B URL (URI) $B$G$9!#AjBP(B URL $B$G$b@dBP(B URL $B$G$b;H$($^$9!#(B

HTML4 $B$N>l9g!'(B

<head>
...$B>JN,(B
<meta http-equiv="content-style-type" content="text/css">
<link rel="stylesheet" href="./atomic.css" type="text/css">
</head>

XHTML1.0/1.1 $B$N>l9g!'(B

<head>
...$B>JN,(B
<meta http-equiv="content-style-type" content="text/css" />
<link rel="stylesheet" href="./atomic.css" type="text/css" />
<?xml-stylesheet href="./atomic.css" type="text/css" ?>
</head>

`style` $BMWAG(B

$B%9%?%$%k$rE,MQ$7$?$$(B HTML/XHTML $BJ8=q$N(B head $BMWAG$KD>@\%9%?%$%k=q$-9~$`J}K!$G$9!#30It%9%?%$%k%7!<%H$G$N;XDj$O!"(B style $BMWAG$K$h$C$F>e=q$-$5$l$^$9!#Ev3:J8=q$G$@$1M-8z$J!"FC

HTML4 $B$N>l9g!'(B

<head>
...$B>JN,(B
<meta http-equiv="content-style-type" content="text/css">
<style type="text/css">
<!--
body { padding: 1em 5%;
    background: #ccf }
p { margin: 0.5em 0;
    padding: 1em;
    text-indent: 1em;
    line-height: 1.5;
    background: #eef }
-->
</style>
</head>

XHTML1.0/1.1 $B$N>l9g!'(B

<head>
...$B>JN,(B
<meta http-equiv="content-style-type" content="text/css" />
<style type="text/css">
body { padding: 1em 5%;
    background: #ccf }
p { margin: 0.5em 0;
    padding: 1em;
    text-indent: 1em;
    line-height: 1.5;
    background: #eef }
</style>
</head>

`style` $BB0@-(B

$B%9%?%$%k$rE,MQ$7$?$$MWAG$N3+;O%?%0$K!"B0@-$H$7$F%9%?%$%k$r5-=R$9$kJ}K!$G$9!#30It%9%?%$%k%7!<%H!?(Bstyle $BMWAG$N;XDj$O!"(Bstyle $BB0@-$N;XDj$K$h$C$F>e=q$-$5$l$^$9!#6K$a$FFC

<body style="padding: 1em 5%; background: #ccf">
...$B>JN,(B
<p style="margin: 0.5em 0; padding: 1em; text-indent: 1em;
    line-height: 1.5; background: #eef">
...$B>JN,(B
</p>
</body>

$BBeBX%9%?%$%k%7!<%H$HM%@h%9%?%$%k%7!<%H(B

$B30It%9%?%$%k%7!<%H$O!"J#?t$N(B$B8GDj%9%?%$%k%7!<%H(B (persistent style sheets) $B$H!"J#?t$N(B$BBeBX%9%?%$%k%7!<%H(B (alternate style sheets) $B$H$KJ,$1$i$l$^$9!#BeBX%9%?%$%k%7!<%H$NCf$G0l$D$r(B$BM%@h%9%?%$%k%7!<%H(B (preferred style sheet) $B$K;XDj$G$-$^$9!#(B

W3C $B$N;EMM$G$O!"Cx

$B8GDj%9%?%$%k%7!<%H$O!"(B rel $BB0@-$NCM$,(B stylesheet $B$G!"(B title $BB0@-$O;XDj$7$J$$!#(B
$BM%@h%9%?%$%k%7!<%H$O!"(B rel $BB0@-$NCM$,(B stylesheet $B$G!"(B title $BB0@-$r;XDj$9$k!#(B
$BBeBX%9%?%$%k%7!<%H$O!"(B rel $BB0@-$NCM$,(B alternate stylesheet $B$G!"(B title $BB0@-$r;XDj$9$k!#(B

XHTML $B$G$N;XDj$NNc!'(B

<!-- $B8GDj%9%?%$%k%7!<%H!((B -->
<link rel="stylesheet" href="atomic.css" type="text/css" />
<!-- $BM%@h%9%?%$%k%7!<%H!((B -->
<link rel="stylesheet" title="cool"
     href="cool.css" type="text/css" />
<!-- $BBeBX%9%?%$%k%7!<%H!((B -->
<link rel="alternate stylesheet" title="modern"
     href="modern.css" type="text/css" />
<link rel="alternate stylesheet" title="classic"
     href="classic.css" type="text/css" />

$B$3$NNc$G$O!"FC$K1\Mw

$B1\MwCSS $B$N%+%9%1!<%I=g0L(B$B$G2r7h$5$l$^$9!#(B

rel="alternate stylesheet" $B$NCM$O!"Fs$D$N%j%s%/%?%$%W(B "alternate" $B$H(B "stylesheet" $B$r%9%Z!<%9$G6h@Z$C$?%j%9%H$K$J$C$F$$$^$9!#%O%$%U%s$d%3%s%^$G6h@Z$C$F$$$k2r@b$r8+$+$1$k$3$H$,$"$j$^$9$,!"8m$j$G$9!#%a%G%#%"%?%$%W$O%3%s%^6h@Z$j%j%9%H$J$N$G!":.F1$7$J$$$h$&$KCm0U$,I,MW$G$9!#(B

$BJ#?t$N%9%?%$%k%7!<%H$N%0%k!<%W2=(B

$B>e$NNc$G$O%9%?%$%k%7!<%H$N(B title $B$KBP$7$F!"0l$D$N30It%9%?%$%k%7!<%H$7$+;XDj$7$F$$$^$;$s$G$7$?$,!"J#?t$NBeBX%9%?%$%k%7!<%H$r0l$D$NL>A0$G%0%k!<%W2=$7!"3n$D$=$&$$$C$?%0%k!<%W$rJ#?t;XDj$9$k;v$,=PMh$^$9!#(B

$BJ#?t$N(B Alternate StyleSheets $B$NNc!'(B

<link rel="alternate stylesheet" title="compact"
     href="small-base.css" type="text/css" />
<link rel="alternate stylesheet" title="compact"
     href="small-extras.css" type="text/css" />
<link rel="alternate stylesheet" title="big print"
     href="bigprint.css" type="text/css" />
<link rel="stylesheet" href="common.css" type="text/css" />

W3C $B$K$h$l$P!"$3$NNc$N>l9g$O!"1\Mw

$B$^$?!"=PNO%a%G%#%"$K1~$8$F!"%9%?%$%k%7!<%H$rJQ99$9$k;v$b2DG=$G$9!#(B

<link rel="stylesheet" media="aural"
     href="corporate-aural.css" type="text/css" />
<link rel="stylesheet" media="screen"
     href="corporate-screen.css" type="text/css" />
<link rel="stylesheet" media="print"
     href="corporate-print.css" type="text/css" />
<link rel="stylesheet" href="techreport.css" type="text/css" />

$B>e$+$i=gHV$K!"2;@

$B>\:Y$O!V(B$B%a%G%#%"(B$B!W$r;2>H$/$@$5$$!#(B

SEO		[PR] 爆速!無料ブログ無料ホームページ開設無料ライブ放送

3. CSS $B$NE,MQJ}K!(B

$B30It%9%?%$%k%7!<%H(B

CSS $B%U%!%$%k(B

HTML $B%U%!%$%k(B

style $BMWAG(B

style $BB0@-(B

$BBeBX%9%?%$%k%7!<%H$HM%@h%9%?%$%k%7!<%H(B

$BJ#?t$N%9%?%$%k%7!<%H$N%0%k!<%W2=(B