HTML_CSSで使ったタグを追記していく
はじめに
HTMLわからん状態なので、調べて使用した機能を追記していきます。
自分用のメモを作ってみたい。
見出し
<h1>見出し1</h1> <h2>見出し1</h2> ... <h6>見出し1</h6>
見出し6まで使えるみたい。
段落
<p>自動で改行されます</p>
改行
改<br>行できました
改
行できました
グループ化
<div> このグループは 同じグループです。 </div>
id属性
要素に対してID(固有の識別名)を付けることができる。
同じ文章内には一つのみ存在できる。
大文字小文字を区別する。
id='name'
class属性
要素に対してクラス名(分類名)を付けることができる。
class='name'
CSS適応
idに対してCSS適用
CSSで#ID名とする。
<h1 id='title'>ラーメンが食べたい!!</h1>
#title{ color:#116ecf; }
classに対してCSS適用
CSSで.クラス名とする。
<div class="parent"> ブロック要素 </div>
.parent{ color:#116ecf; }
センタリング
<div style="text-align:center">センターに表示されるよ</div>
センターに表示されるよ
表を作る
tableはテーブルは表を作成するタグ。
tr:縦方向
td:横方向
<table> <tr> <td>日付</td> <td>名前</td> <td>タスク</td> <td>補足</td> <td>完了日</td> </tr> <tr> <td>18/10/15 19:14</td> <td>YYY</td> <td>コーディング</td> <td>-</td> <td>未完了</td> </tr> </table>
table { border-collapse: collapse; } td { border: solid 1px; padding: 0.5em; }
日付 | 名前 | タスク | 補足 | 完了日 |
18/10/15 19:14 | YYY | コーディング | - | 未完了 |
リンク
<a href='https://hakonebox.hatenablog.com/'>はこねのはこ</a>
背景色を変える
body { background-color:#39C; }
太文字にする
.ex1{ font-weight: bold; } .ex2{ /* 100-900で設定 */ font-weight: 900 ; } .ex2{ /* 親要素の文字の太さに対して、1段階太く * 逆の場合はlighter */ font-weight: bolder; }
フォントの種類を変更
.font{ font-family: 'arial black'; }
さいごに
調べるたびに増やして行こうと思います。