CSS $B$N

$B$3$3$^$G$G!"(BCSS$B$N4pK\E*$J%k!<%k$KIU$$$F$N@bL@$,=*$o$j$^$7$?!#8D!9$N(Bproperty$B$HB6$N(Bvalue$B$KIU$$$F$N@bL@$KF~$kA0$K!"(BCSS$B$N4pK\E*$J%k!<%k$r$^$H$a$F$*$-$^$9!#(B

$B%9%?%$%k%7!<%H$N4pK\9=B$(B

selector {property1:value1; property2:value2}

property:value $B$r@k8@$H8F$V!#(BHTML$B$NA4$F$NMWAG$O(B selector $B$K$J$jF@$k!#(B

Selectors

$B%;%l%/%?$N
  • HTML$B$N$"$i$f$kMWAG(B
    strong { font-weight: bold }
  • class$BB0@-$rM?$($i$l$?MWAG(B

    class="CSS" $B$rM?$($i$l$?A4$F$NMWAG$K%^%C%A$9$k%9%?%$%k!&%7!<%H$O!"(B

    .CSS {color: #008}

    class="HTML" $B$rM?$($i$l$?(Bcode$BMWAG$@$1$K%^%C%A$9$k%9%?%$%k!&%7!<%H$O!"(B

    code.HTML {color: #500}
  • $BJ8L.%;%l%/%?(B

    p$BMWAG$N;RB9MWAG$G$"$j!"3n!"(Bclass="CSS"$B$rM?$($i$l$?(Bcode$BMWAG$K%^%C%A$9$k%9%?%$%k!&%7!<%H$O!"(B

    p code.CSS {color: #008; font-size: .8em}
  • $B5<;w%/%i%9(B

    $BMWAG$N>uBV$r!"5<;wE*$J%/%i%9$rM?$($F6hJL$9$k!#(Bhref$BB0@-$r;}$D(BAnchor$BMWAG$KBP$7$F!"L$K,(B :link $B!"4{K,(B :visited $B!"%+!<%=%k$,>e$K>h$C$F$$$k>uBV(B :hover $B!"%"%/%F%#%V>uBV(B :active $B!"(Btext$BF~NO$K%U%)!<%+%9$5$l$F$$$k>uBV(B :focus $B!#(B

    a:hover {color: red; font-style: italic;
            text-decoration: underline}

    $B$3$3$K!"(B A:link $B$H(B :link $B$OF1$8!#(B

  • $B5<;wMWAG(B

    $B%V%m%C%/!&%l%Y%kMWAG$N$"$k0lItJ,$r6hJL$7$F5<;wE*$KMWAG$H8+$J$9!#%V%m%C%/!&%l%Y%kMWAG$N0lJ8;zL\$r!"(B :first-letter $B!"0l9TL\$r!"(B :first-line $B$H1>$&5<;wE*$JMWAG$H8+$J$9!#(B

    p:first-line {font-size: 1.2em; font-variant: small-caps}

$B5<;w%/%i%9$b5<;wMWAG$b!"(BHTML$B$G$OBP1~$9$k%^!<%/%"%C%W$,$5$l$F$$$J$$$H1>$&E@$,!V5<;wE*!W$H1>$&=j0J$G$"$k!#0x$_$K!"5<;wMWAG$r%5%]!<%H$7$F$$$k%V%i%&%6$O!"(BMS I.E.5.5$B!"(BNetscape6$B$J$I!#(B

$B%;%l%/%?$N%0%k!<%W2=(B

$BJ#?t$N%;%l%/%?$K6&DL$N%9%?%$%k$r@k8@$7$?$$;~$K$O!"%;%l%/%?$r%+%s%^$G6h@Z$C$F%0%k!<%W2=$G$-$k!((B

h1,h2,h3,h4,h5,h6,strong,dt,th { font-weight: bold }
div p, div table, div ul { margin: 1em 2em }

$B%9%?%$%k$N7Q>5(B

$B0lHL$K?FMWAG$N%9%?%$%k@k8@$O;RMWAG$K$^$G5Z$V!#;RMWAG$G$O!"$3$l$H0[$J$kItJ,$@$1Dj5A$9$l$PNI$$!#7Q>5$7$J$$%W%m%Q%F%#!<$b:_$k$,!">o<1E*$KH=CG$G$-$k!#Nc$($P!"(B 'background-color' $B$d(B 'line-height' $B!"(B 'font-size' $B$J$I$O7Q>5$9$k$,!"(B 'margin-top' $B$OL@$i$+$K7Q>5$7$J$$!#(B

$B%9%?%$%k%7!<%H$NF3F~J}K!(B

  • LINK $BMWAG$K$h$k(B$B30It%9%?%$%k!&%7!<%H(B$B$NFI$_9~$_(B
    <link rel="stylesheet" type="text/css" href="URL">
    • $B8GDj%9%?%$%k%7!<%H(B...rel="stylesheet"
    • $BM%@h%9%?%$%k%7!<%H(B...rel="stylesheet", title="xxx"
    • $BBeBX%9%?%$%k%7!<%H(B...rel="alternate stylesheet", title="xxx"
  • HEAD $BMWAG$NCf$N(B STYLE $BMWAG(B
  • @import $B@@import url(...);
  • style $BB0@-$NB0@-CM$G$"$k(B$B%$%s%i%$%s!&%9%?%$%k(B

Cascading

$BJ#?t$N%9%?%$%k!&%7!<%H4V$G6%9g$,5/$3$C$?$H$-$O!"(Buser agent$B$NFI$_9~$_=g$,8e$m$N%9%?%$%k!&%7!<%H$[$I!"M%@h=g0L$,9b$/$J$k!#0lHL$K!"(BLINK$B$K$h$k30It%9%?%$%k!&%7!<%H$,:G$bDc$/!"Ev3:MWAG$N(Bstyle$BB0@-$K$h$k%$%s%i%$%s!&%9%?%$%k$,:G$b9b$$!#(B

$BC1FH$N%U%!%$%k$NCf$G$b!"2<$N9T$K=q$$$?%9%?%$%k@k8@$NJ}$,M%@h=g0L$,9b$$!#(B

Copyright © 2004 SUGAI, Manabu. All rights reserved.
2001-07-15 published, 2004-06-20 revised.
SEO [PR] 爆速!無料ブログ 無料ホームページ開設 無料ライブ放送