<<PREV | TOP | NEXT>>

CSS - Cascading Style Sheets

CSS $B$O(B HTML $BJ8=q$N8+1I$($rD4@0$9$k$?$a$N;EAH$_$G$9!#$3$3$G$=$N35N,$r=R$Y$^$9!#$^$:$O;n$7$F$_$?$$J}$O!"!V(BCSS $B%9%T!<%I%i!<%K%s%0(B$B!W$r!"$5$i$K>\$7$$2r@b$O!V(BCSS $B2r@b(B$B!W$r8fMw$/$@$5$$!#(B

1. CSS $B$N4pK\E*$J=q<0(B

$BCJMn$rI=$9(B P $BMWAG$N9TF,$r0lJ8;z$X$3$^$;$?$$$H$7$^$9!J%$%s%G%s%H$r0lJ8;zJ, 

p { text-indent: 1em }

p $B$r(B$B%;%l%/%?(B$B$H8F$S!"%9%?%$%k@k8@$NE,MQBP>]$rI=$7$^$9!#(B { $B$+$i(B } $B$^$G$r(B$B@k8@(B$B$H8F$S!"8+1I$($r;XDj$7$^$9!#$3$3$G!"(B text-indent $B$O(B CSS $B$N(B$B%W%m%Q%F%#(B$B$H8F$S!"(B 1em $B$O$=$N(B$BCM(B$B$G$9!#(B

$B0l$D$N%;%l%/%?$KJ#?t$N%9%?%$%k@k8@$r5-=R$9$k;~$O!"Aj8_$r%;%_%3%m%s(B ; $B$G6h@Z$j$^$9!((B

p em { font-style: italic;
  color: red;
  text-decoration: underline }

$B%;%l%/%?(B P em $B$O!V(B P $BMWAG$NFbB&$KF~$C$F$$$k(B EM $BMWAG!W$rI=$7$^$9!#@k8@$O!"!VJ8;z%9%?%$%k$,%$%?%j%C%/BN$G!"?'$,@V!"2<@~I=<(!W$N;0$D$,;XDj$5$l$F$$$^$9!#(B

2. $B%;%l%/%?$N

$B%?%$%W!&%;%l%/%?(B

$BNc$($P!"(B H1 $B$H1>$&MWAG$K%^%C%A$9$k%;%l%/%?$G$9!((B

h1 { font-weight: 900 }

$B;RB9%;%l%/%?(B

$BNc$($P!"(B P $BMWAG$N;RB9MWAG$G$"$k(B EM $BMWAG$K%^%C%A$9$k%;%l%/%?$G$9!((B

HTML $BJ8=q$NNc!((B

<p>
$B$3$3$O(B P $BMWAG$NFbMFIt$G$9!#(B
$B0?$kMWAG$NFbMFIt$K8=$l$kMWAG$N$3$H$r!"(B
$B0lHL$K(B<em>$B;RB9MWAG(B</em>$B$H8F$S$^$9!#(B
</p>

$BBP1~$9$k%9%?%$%k%7!<%H$NNc!((B

p em { color: red }

$B%/%i%9!&%;%l%/%?(B

$BMWAG$K(B class $BB0@-$,M?$($i$l$F$$$k>l9g!"%;%l%/%?$G;2>H$G$-$^$9!#(B

$B%Q%i%a%?%coreattrs; $B$N0lIt$G$"$k(B class $BB0@-$O!"(B BODY $BMWAGFb$N$"$i$f$kMWAG(B (%flow;) $B$KM?$($k$3$H$,=PMh$^$9!#(B

HTML $BJ8=q$NNc!((B

<p class="note">
$B$3$3$O(B P $BMWAG$NFbMFIt$G$9!#(B
$B$3$N(B P $BMWAG$K$O!"(B class $BB0@-$,M?$($i$l$F$*$j!"(B
$B$=$NB0@-CM$O(B note $B$G$9!#(B
</p>

$BBP1~$9$k%;%l%/%?$NNc(B

p.note { font-style: italic }

$B$3$3$G$O(B class="note" $B$r;}$D(B P $BMWAG$@$1$K%^%C%A$9$k$h$&$K%;%l%/%?$r=q$-$^$7$?$,!"(B class="note" $B$r;}$DA4$F$NMWAG$K%^%C%A$9$k$h$&$K$b=q$1$^$9!((B

.note { text-decoratoin: underline }

$B0l0U%;%l%/%?(B

$BMWAG$K(B id $BB0@-$,M?$($i$l$F$$$l$P!"%;%l%/%?$G;2>H$G$-$^$9!#(B

$B%Q%i%a%?%coreattrs; $B$N0lIt$G$"$k(B id $BB0@-$O!"(BBODY $BMWAGFb$N$"$i$f$kMWAG(B (%flow;) $B$KM?$($k$3$H$,=PMh$^$9!#(B

HTML $BJ8=q$NNc!((B

<h1 id="optical-properties">$B8w3XJ*@-(B</h1>

$BBP1~$9$k%;%l%/%?$NNc!((B

h1#optical-properties { color: yellow }

id $BB0@-$NCM$K$O!"0l$D$NJ8=qCf$G0l2s$@$1$7$+MQ$$$i$l$F$$$J$$$H1>$&(B$B0l0U@-(B$B$,I,MW$G$9!#JL$N>l=j$KF1$8(B id $BB0@-$rM?$($J$$$h$&$K$/$l$0$l$bCm0U$,I,MW$G$9!#(B

3. HTML $BJ8=q$X$NAH9~$_J}(B

$B=i4|@_Dj$NL@5-(B

HTML $BJ8=q$G%9%?%$%k%7!<%H$rMxMQ$9$k>l9g$O!"(B HEAD $BMWAGFb$G$=$N 

<head>
  <title>CSS $B$NNc(B</title>
  <meta http-equiv="content-style-type" content="text/css">
</head>

$BJ8=qCf$GI8=`E*$KMxMQ$9$k%9%?%$%k%7!<%H$NHEAD $BMWAG(B$B$NCf$K!"(B META $B%?%0(B$B$rMxMQ$7$F5-=R$7$F$$$^$9!#(B

$B$3$3$G$O(B text/css $B$r;XDj$7$^$7$?$,!"$3$l$,(B CSS $B$N$3$H$G$9!#(B

STYLE $BMWAG(B

$BJ8=qCf$GI8=`E*$KMxMQ$9$k%9%?%$%k@k8@$r(B HEAD $BMWAGFb$N(B STYLE $BMWAG$G5-=R$G$-$^$9!#(B

<head>
  <title>CSS $B$NNc(B</title>
  <meta http-equiv="content-style-type" content="text/css">
  <style type="text/css">
  <!--
  p { line-height: 1.5 }
  -->
  </style>
</head>

p { line-height: 1.5 } $B$,%9%?%$%k$G$9!#J8=qCf$NA4$F$N(B P $BMWAG$N0l9T$N9b$5$,!"J8;z$N(B 1.5 $BG\$K$J$k$h$&$K;XDj$7$F$"$j$^$9!#(B

$B%$%s%i%$%s%9%?%$%k(B

$B0?$k0l$D$NMWAG$K$@$1%9%?%$%k$rE,MQ$9$k>l9g$O!"Ev3:MWAG$N(B style $BB0@-$G;XDj$7$^$9!((B

$B!VF|K\NsEg2~B$O@!W$rCx$7$?(B
<span style=" color: red; text-decoration: underline">$BEDCf3Q1I(B</span>
$B$H$O$I$s$J?M$@$C$?$N$@$m$&!)(B

$B$3$3$G(B$BEDCf3Q1I(B $B$O(B SPAN $BMWAG$NFbMF$G$9$,!"$3$N(B SPAN $BMWAG$K$O(B style $BB0@-$,M?$($i$l$F$$$^$9!#!VJ8;z?'$,@V!"2<@~I=<(!W$,;XDj$5$l$F$$$^$9!#(B

$B$3$N$h$&$K(B style $BB0@-$rM?$($kJ}K!$N%9%?%$%k%7!<%H$r!"%$%s%i%$%s%9%?%$%k$H8F$S$^$9!#(B

$BJ#?t$NJ8=q$G6&DL$7$FMxMQ$9$k$h$&$J%9%?%$%k%7!<%H$O!"J8=q$+$iFHN)$7$?%U%!%$%k$K$7$F$*$1$^$9!#$3$N$H$-!"3HD%;R$O(B *.css $B$G$9!JNc!((B atomic.css, cool.css $B!K!#(B

$B0?$kJ8=q$,!"(B atomic.css $B$H(B cool.css $B$rMxMQ$7$?$$>l9g!"(B HEAD $BMWAG(B$B$G(B LINK $BMWAG(B$B$rMxMQ$7$FL@5-$7$^$9!#(B

<head>
  <title>CSS $B$NNc(B</title>
  <meta http-equiv="content-style-type" content="text/css">
  <link rel="StyleSheet" href="../visual/atomic.css" type="text/css">
  <link rel="StyleSheet" href="../visual/cool.css" type="text/css">
</head>

$B%V%i%&%6$O!"$^$:(B visual $B%U%)%k%@$K$"$k(B atomic.css $B$,FI$_9~$^$l!"$3$l$K(B cool.css $B$,>e=q$-$5$l!"=PMh$"$,$C$?%9%?%$%k%7!<%H$rE,MQ$7$^$9!#(B

$B$3$l$O8GDj%9%?%$%k%7!<%H$H8F$P$l$kNc$G$9!#30It%9%?%$%k%7!<%H$K$O!"BeBX%9%?%$%k%7!<%H$H1>$&$b$N$b$"$j$^$9$,!"$3$3$G$O3d0&$7$^$9!#>\$7$/$O(BCSS$B$N>R2p(B$B$r8fMw$/$@$5$$!#(B

4. $B6%9g$N2r7h(B

$BJ#?t$NJ8=q$G6&M-$9$k0lHLE*$J%9%?%$%k$r5-=R$7$?(B$B30It%9%?%$%k%7!<%H(B$B$H!"J8=qFb$NMWAGKh$KE,MQ$G$-$k=`0lHLE*$J%9%?%$%k$r5-=R$7$?(B STYLE $BMWAG(B$B$H!"6KFC$B%$%s%i%$%s!&%9%?%$%k(B$B$N;0$D$K!"AjL7=b$7$?5-=R$,$"$k$H$-$O!"FC

$BM%@h!(!!30It%9%?%$%k%7!<%H(B < STYLE$BMWAG(B < $B%$%s%i%$%s!&%9%?%$%k(B

$BF1$8(BSTYLE$BMWAGFb$G$b!"2<$N9T$K5-=R$5$l$?$b$N$[$IM%@hEY$,>e$,$j$^$9!#FI$_$3$_=g$,8e$m$K9T$/$[$IM%@hEY$,>e$,$k$H1>$($^$9!#(B

$BC"$7!"(B !important $B$H1>$&%-!<%o!<%I$G!"G$0U$N%9%?%$%k@k8@$NM%@hEY$r:G9b$K;XDj=PMh$^$9!#(B

$B%f!<%6%9%?%$%k%7!<%H(B

$B%9%?%$%k%7!<%H$O!"%V%i%&%6!"%f!<%6!"%Z!<%85-=R

$BM%@hEY!(!!%V%i%&%6(B < $B%f!<%6(B < $B%Z!<%85-=R

$B$^$:%V%i%&%6$,MQ0U$7$?%9%?%$%k!&%7!<%H$,$"$j!"$=$l$r%f!<%6$,>e=q$-$7!"99$K3F%Z!<%8Kh$K5-=R$5$l$F$$$k%9%?%$%k$,>e=q$-$9$k$H1>$&=gHV$@$H9M$($FNI$$$G$7$g$&!#(B

$BC"$7!"(B !important $B$H1>$&%-!<%o!<%I$G!"G$0U$N%9%?%$%k@k8@$NM%@hEY$r:G9b$K;XDj=PMh$^$9!#(B

$B$3$&$7$F:G=*E*$K=PMh$"$,$C$?%9%?%$%k!&%7!<%H$,E,MQ$5$l$^$9!#(B

$BR2p$7$^$9!#(B

<<PREV | TOP | NEXT>>

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