■ html 04 - 表をいれる -
<table> ~ </table> タグを使う
表を書くには table タグを使用します。 その他、<caption> <tr> <th> <td> などを用いて表を作成していきます。 |
|
以下のように構成し記載します。
![$html と css のお勉強-table](https://stat.ameba.jp/user_images/20110620/20/confirmation-bias/65/dd/p/o0550033611302737969.png?caw=800)
上記の図を そのまま記載すると 以下のようになります | 説明 | ||||||
| タイトルは必須ではありません。 行、見出し、セルの数は必要に応じて増やすことができます。 また、<th> <td> も必要に応じて <th> を <td> に <td> を <th>に書き換えても構いません。 |
ただこのままでは枠線がなく表のように見えません。<table border="1"> | ⇒ |
|
その他、 table で使用できる属性は次回です。
■ html 03 - もじをいじる -
字体を色々と変更してみよう
<font> ~ </font> タグを使う
~ 色、大きさ、フォント ~
記述方法
<font 属性名 = "属性値"> ~ </font>
属性名 | = "属性値" (" "内に記載) | 指定する値 |
size | 1 , -1 , 3 , +1 , 5 | 1~7 の数値(既定値は 3 ) または "-3"~"+3" の相対値 |
color | pink , plum , skyblue , lightgreen , #B0C4DE , #FFE4B5 | RGB値または 色の名前 |
face | "Comic Sans MS" "Times New Roman" "Helvetica" | フォント名で指定。 OSやブラウザで表示できるものが異なる |
※faceに関して
複数のフォントを , で区切って記載し優先順位をつけられる。
ブラウザで表示可能なものがあったらそれが優先順位に従って使用されます。
ひとまとめにして記述することもできる
<font size="5" color="blue" face="Comic Sans MS"> font </font> → font
属性を指定しないタグ
記述方法
<開始タグ(要素名)> ~ <終了タグ(/要素名)>
要素名 | サンプル | 説明 |
b | サンプル | 太字 |
i | サンプル | 斜体 |
em | サンプル | 強調(斜体になる) |
strong | サンプル | より強い強調(太字になる) |
u | サンプル | 下線 |
s | 削除線 | |
sup | e = mc2 | 上付き |
sub | H2O | 下付き |
tt | サンプル(通常) サンプル(等幅) | 等幅 |
それぞれを組み合わせて使うことも出来る
<font size="5" color="tomato" ><b> Do・∀・it </b></font>
→ Do・∀・it
必要ならばいくつでも
<font size="5" color="tomato" ><b><i><u> こんバルシェ </u></i></b></font>
→ こんバルシェ
開始タグ、終了タグの位置には注意です
< 1 >< 2 >< 3 > 文章 < /3 >< /2 >< /1 >
このように最初に使ったのを最後に閉じるようなかたちで記載です
ブラウザによって違うかもだけど、<b>と<strong>とかのように表示が同じタグでも、
本来は用途が定められているものもあります。
ブログで日記を書く程度なら気にしなくてもいいと思うので、説明を省きます。
次回は表の記載について
ここではアメブロを書くにあたって、充実した表記をできるように程度の
html に関する説明を行ってます。
■ html 02 - タグって? -
ここではアメブロを書くにあたって、充実した表記をできるように程度の
html に関する説明を行っていきます。
タグって?
<>でくくったhtml 用の命令文
開始タグと終了タグでくくり、一つの要素として意味や性質を持たせるもの
ブログを書いていると自然と使っている
<・・・> 文章 </・・・>
の形式が要素
開始タグから終了タグまでを要素っていぅ
タグには開始タグだけで、終了タグのないものもある
![html と css のお勉強-001](https://stat001.ameba.jp/user_images/20110618/05/confirmation-bias/46/cc/p/o0550013611297133744.png?caw=800)
例 : <font(要素名) color(属性)="pink"(値)>(開始タグ) 要素内容 </font>(終了タグ)
要素名って?
要素名はたくさん種類があって、太字にしますよ~ とか
表をつくりますよ とか 箇条書きもいかが? なんて、色々な種類の命令をできる
もともと用意されている定型のモノが入る
属性って?
例えば <font color="pink"> の color の部分
この場合だと開始、終了タグでくくった内容の font の color(色)
について何にしましょ?
値として"pink"を設定することによって
< font color = "pink" >
<フォントの 色は? = ピンクにする> なんて意味
他には<font size="7"> フォントのサイズはいかがしましょ?とか
属性は、同じ要素名ならまとめて記述できる。
例:<font color="pink" size="7"> ドーン! </font> ⇒ ドーン!
値って?
前記のように、font color なら色名、色コード
font size なら 1~7 の数値や -3~+3 の相対値など、
属性に関する具体的な設定値
html の基本やタグに関しては以上です。
次回からはそれぞれのタグの具体的な用法について
記載していこうと思います。