フォントの種類や色、サイズ、背景の色や画像などを変更してオリジナルのデザインを作成します。
これだけ知っていればブログのカスタマイズができるというスタイルシートの属性をピックアップしました。
これだけ知っていればブログのカスタマイズができるというスタイルシートの属性をピックアップしました。
スタイルシートコマンドリファレンス
| color | 文字色を指定する color:red; color:#ff0000; |
| font-size | フォントのサイズを指定する font-size:11pt; |
| line-height | 行の高さを指定する line-height:14pt; |
| font-family | フォントの種類を指定する font-family:Arial,Helvetica,sans-serif; |
| text-align | 行揃えの位置を指定する text-aligne:left; text-aligne:center; text-aligne:right; |
| vertical-align | 縦方向の揃え位置を指定する vertical-align:top; vertical-align:middle; vartical-align:bottom; |
| text-decoration | テキストの下線・上線・打ち消し線を指定する text-decoration:none; text-decoration:underline; text-decoration:overline; text-decoration:line-through; |
| font-weight | フォントの太さを指定する font-weight:normal; font-weight:bold; |
| font-style | フォントをイタリック体・斜体にする font-style:italic; font-style:oblique; |
| background-color | 背景色を指定する background-color:red; background-color:#ff0000; |
| background-image | 背景画像を指定する url("./images/back.gif") |
| background-position | 背景画像の表示開始位置を指定する background-position:left; background-position:center; background-position:right; |
| background-repeat | 背景画像のリピート方法を指定する background-repeat:repeat-x; background-repeat:repeat-y; background-repeat:no-repeat; |
| width | 幅を指定する width:200px; width:20%; |
| height | 高さを指定する height:200px; height:20%; |
| margin | マージンに関する指定をまとめて行う margin:10px; margin:5px 10px 5px 10px; |
| margin-top margin-bottom margin-left margin-right | 上下左右マージンを指定する margin-top:10px; |
| padding | パディングに関する指定をまとめて行う padding:10px; padding:5px 10px 5px 10px; |
| padding-top padding-bottom padding-left padding-right | 上下左右パディングを指定する padding-top:10px; |
| border-color | ボーダーの色を指定する border-color:#ff0000; border-color:#ff0000 #00ff00 #ff0000 #ff0000; |
| border-top-color border-bottom-color border-left-color border-right-color | 上下左右ボーダーの色を指定する border-top-color:#ff0000; |
| border-style | ボーダーのスタイルを指定する border-style:none; border-style:dotted; border-style:dashed; border-style:solid; border-style:double; |
| border-top-style border-bottom-style border-left-style border-right-style | 上下左右ボーダーのスタイルを指定する border-top-style:solid; |
| border-width | ボーダーの太さを指定する border-width:1px; border-width:1px 0px 1px 0px; |
| border-top-width border-bottom-width border-left-width border-right-width | 上下左右ボーダーの太さを指定する border-top-width:2px; |
| border | ボーダーのスタイル・太さ・色を指定する border:solid 1px #ff0000; |
| border-top border-bottom border-left border-right | 上下左右ボーダーのスタイル・太さ・色を指定する border-top:solid 1px #ff0000; |
| float | 左または右に寄せて配置する float:left |
| clear | 回り込みを解除する clear:left |