←自分のホームページでお金がもらえるの知ってましたか？スタイルシート タグ一覧
文字
| 文字サイズを指定する |
| font-size:15pt; → あいうえお |
| 文字の色を指定する |
| color:red; → あいうえお |
| 太字 |
| font-weight:bold; → あいうえお |
| 取り消し線 |
| text-decoration:line-through; → あいうえお |
| 下線 |
| text-decoration:underline; → あいうえお |
| 上線 |
| text-decoration:overline; → あいうえお |
| 修飾なし |
| text-decoration:none; ※一見意味がなさそうな気がしますが、下線なしのリンクをつくる場合に有効です。 |
| 文字間隔を指定 |
| letter-spacing:10pt; → あいうえお |
| 行間を指定 |
| line-height:20pt; |
| 水平位置を指定 |
| text-align:center; → あいうえお ※left(左揃え)、center(中央揃え)、right(右揃え) |
背景
| 背景の色を指定 |
| background-color:yellow; |
| 背景に画像を指定 |
| background-image:url(abc.jpg); |
| 背景画像の配置を指定 |
|
横方向に配置 background-repeat:repeat-x; 縦方向に配置 background-repeat:repeat-y; １つだけ配置 background-repeat:no-repeat; |
| 背景画像を固定 |
| background-attachment:fixed; |
| 背景画像の位置を指定 |
| background-position:right top; ※左右位置{left(左),center(中央),right(右)}と上下位置{top(上),center(中央),bottom(下)}から組み合わせて指定する。 ※左上からの距離を数値で指定することもできる。例：background-position:10pt 20p; |
ボーダー(枠線)
| 線のスタイルについて | |
|
solid 一重線 double 二重線 dashed 破線 dotted 点線 groove 線がへこんで見える ridge 線が浮き出て見える inset 全体がへこんで見える outset 全体が浮き出て見える | |
| 一括指定 | |
| border:1px solid blue;※線の太さ、スタイル、色の順に半角スペースで区切って指定する。 | |
| 太さを指定 | |
|
「上下左右」 border-width:2pt; 「上下」と「左右」 border-width:1pt 2pt; 「上」、「右」、「下」、「左」 border-width:1pt 2pt 3pt 4pt; | |
| スタイルを指定 | |
|
「上下左右」 border-style:solid; 「上下」と「左右」 border-style:solid double; 「上」、「右」、「下」、「左」 border-style:solid double solid double; | |
| 色を指定 | |
|
「上下左右」 border-color:red; 「上下」と「左右」 border-color:red blue; 「上」、「右」、「下」、「左」 border-color:red blue yellow green; | |
| 個別に一括指定 | |
| border-top:1pt solid red; ※bottom,right,leftも同じ形式。 ※線の太さ、スタイル、色の順に半角スペースで区切って指定する。 | |
| 個別に太さを指定 | |
| border-top-width:1pt;※bottom,right,leftも同じ形式。 | |
| 個別にスタイルを指定 | |
| border-top-style:solid;※bottom,right,leftも同じ形式。 | |
| 個別に色を指定 | |
| border-top-color:yellow;※bottom,right,leftも同じ形式。 |
マージン（外側に対する余白）
| 一括指定 |
|
「上下左右」 margin:10pt; 「上下」と「左右」 margin:10pt 20pt; 「上」、「右」、「下」、「左」 margin:5pt 6pt 7pt 8pt; |
| 個別指定 |
|
上 margin-top:10pt; 下 margin-bottom:10pt; 右 margin-right:10pt; 左 margin-left:10pt; |
パディング（内側に対する余白）
| 一括指定 |
|
「上下左右」 padding:10pt; 「上下」と「左右」 padding:10pt 20pt; 「上」、「右」、「下」、「左」 padding:5pt 6pt 7pt 8pt; |
| 個別指定 |
|
上 padding-top:10pt; 下 padding-bottom:10pt; 右 padding-right:10pt; 左 padding-left:10pt; |
幅・高さ
| 幅を指定 |
| width:20pt; |
| 高さを指定 |
| height:10pt; |
フィルター
※<span>と<div>に用いる場合はwidthとheightを指定する必要がある。
| ブラー(ぼかし効果) |
| filter:Blur(add=0,direction=90,strength=20); → あいうえお
※direction:角度 strength:ぼかしの度合い |
| 影(1) |
| filter:DropShadow(color=blue,offx=3,offy=3,positive=0); → あいうえお
※color：影の色 offx:右方向への影の長さ offy:下方向への影の長さ |
| 影(2) |
| filter:Shadow(color=red,direction=135); → あいうえお
※color：影の色 direction:影の角度 |
| 発光効果 |
| filter:Glow(color=yellow,strength=3); → あいうえお
※color：光の色 strength:光の強さ |
