無料ホームページ作成
HTMLやタグ講座、cssスタイルシートでのwebデザインなどホームページの作り方を解説しています。ブログやHPで使用頻度が高いタグを中心に解説しています。初心者でも簡単に使えるようにタグとその属性のほかに関連性の高いcssも同時に表示してデザインの指定も簡単にできるようにしました。スタイルシートでデザインを一括管理すればWEBページの管理も簡単になります。html一覧
| 見出し | 引用 | 太字 | 表を作る | リストを作成 |
| <h1> | <blockquote> | <b> | <table> | <ul> |
| 段落 | 改行や空白も表示 | 斜体 | 行 (table要素の子要素) | 数字付きのリスト |
| <p> | <pre> | <i> | <tr> | <ol> |
| 改行 | 語句を強調する | 等幅フォント | 見出しセル (trの子要素) | リスト項目(ulやolの子要素) |
| <br> | <strong> | <tt> | <th> | <li> |
| グループ分け | <em> | 下付き文字 | セル (trの子要素) | 定義リスト |
| <div> | 頭字語 | <sub> | <td> | <dl> |
| <span> | <acronym> | 上付き文字 | 表の題名 (tableの子要素) | 用語を表示（dlの子要素） |
| リンクの作成 | 取消線 | <sup> | <caption> | <dt> |
| <a> | <del> | 大きめの文字 | 表の縦の列をグループ化 (tableの子要素) |
説明文を表示（dlの子要素） |
| 画像の表示 | 下線 | <big> | <colgroup> | <dd> |
| <img> | <ins> | 小さめの文字 | <col> | |
| <small> | ||||
| 水平罫線 | ||||
| <hr> |
css一覧
cssとはホームページの色や位置、フォントの大きさなどのHPのデザインを決めるものです。複数のhtmlに対し、共通のスタイルシートを適用させることができ、スタイルシートを修正するだけで全てのタグにその結果が反映される方法で無料ブログ作成でも使われています。 スタイルシートを使えば簡単にデザインを変えることができるので作業が効率よくできます。CSSでレイアウトしたテンプレートを使用すれば自由度も広がります。リンクの色 |
| 擬似クラス |
| a:link
a:visited a:hover a:active |
フォント変更 |
| 書体の指定 |
| font-family |
| 文字の大きさ |
| font-size |
| 文字の斜体の変更 |
| font-style |
| フォントの一括指定 |
| font |
余白 |
| 要素の外側の上側に余白 |
| margin-top |
| 要素の外側の左側に余白 |
| margin-left |
| 要素の外側の右側に余白 |
| margin-right |
| 要素の外側の下側に余白 |
| margin-bottom |
| 外側の空白を一括指定 |
| margin |
| 要素の内側の上側の余白 |
| padding-top |
| 要素の内側の左側の余白 |
| padding-left |
| 要素の内側の右側の余白 |
| padding-right |
| 要素の内側の下側の余白 |
| padding-bottom |
| 内側の空白を一括指定 |
| padding |
文章の位置 |
| 文章の行間を広げる |
| line-height |
| 文字の縦方向の位置 |
| vertical-align |
| 段落の1行目を字下げ |
| text-indent |
| 文字の揃える位置 |
| text-align |
| 文字に下線や上線 |
| text-decoration |
| 文字の間隔を広げる |
| letter-spacing |
| 単語の間隔を広げる |
| word-spacing |
| 文章の折り返し設定 |
| white-space |
要素の幅と高さ |
| 要素の幅 |
| width |
| 要素の高さ |
| height |
レイアウト |
| 回り込み、段組をする |
| float |
| 回り込みを解除する |
| clear |
| 要素の表示方法を変える |
| display |
| 表示位置を指定する |
| position |
| はみ出した時の表示方法 |
| overflow |
| 要素を重ねる順番を指定 |
| z-index |
色や背景 |
| 文章の色を変更する |
| color |
| 背景色を変える |
| background-color |
| 背景画像を指定する |
| background-image |
| 背景画像の並べ方 |
| background-repeat |
| 背景画像の位置 |
| background-position |
| 背景画像を固定する |
| background-attachment |
| 背景のcssを一括指定 |
| background |
リスト記号のデザイン |
| リスト記号の種類を変える |
| list-style-type |
| 記号を画像で表示 |
| list-style-image |
| リスト記号の位置 |
| list-style-position |
| リスト記号を一括指定 |
| list-style |
テーブルデザイン |
| テーブルの表示方法 |
| table-layout |
| 表の枠線を1本にする |
| border-collapse |
印刷のとき改ページ |
| 印刷のとき改ページ |
| page-break-before |
マウスポインタの形 |
| マウスポインタの形を変更 |
| cursor |
枠線の太さ |
| 要素の上の枠線の太さ |
| border-top-width |
| 要素の左の枠線の太さ |
| border-left-width |
| 要素の右の枠線の太さ |
| border-right-width |
| 要素の下の枠線の太さ |
| border-bottom-width |
| 枠線の太さを一括指定 |
| border-width |
枠線の種類 |
| 上枠のデザイン |
| border-top-style |
| 左枠のデザイン |
| border-left-style |
| 右枠のデザイン |
| border-right-style |
| 下枠のデザイン |
| border-bottom-style |
| 枠線デザインを一括指定 |
| border-style |
枠線の色 |
| 要素の上枠の色 |
| border-top-color |
| 要素の左枠の色 |
| border-left-color |
| 要素の右枠の色 |
| border-right-color |
| 要素の下枠の色 |
| border-bottom-color |
| 枠線の色を一括指定 |
| border-color |
枠線の各値を一括指定 |
| 上枠だけ一括指定 |
| border-top |
| 左枠だけ一括指定 |
| border-left |
| 右枠だけ一括指定 |
| border-right |
| 下枠だけ一括指定 |
| border-bottom |
| 全ての枠線を一括指定 |
| border |