04【技術】テキスト表現系のタグ
「今回は『テキスト表現系』のタグで、何ができるかを紹介しよう」
「前回は<B>タグだけ紹介したんだよね」
「前回も描いた通り、活動報告で新しい記事を書く時、入力欄に下に『使用可能なタグの一覧』がでるぜ」
・゜゜・*:.。..。.:*・゜゜・*:.。
・゜゜・*:.。..。.:*・゜゜・*:.。
「んで、テキスト表現系のタグはこれだ」
・゜゜・*:.。..。.:*・゜゜・*:.。
<small></small> , <b></b> , <i></i> , <s></s> , <u></u>
・゜゜・*:.。..。.:*・゜゜・*:.。
「前回の例では<B>と</B>で挟まれた箇所が太字になったね」
「<B>が開始タグで、</B>が終了タグ。このふたつで挟まれた箇所に効果がつくんだよな。テキスト表現系のタグの効果をまとめるとこうなる」
・゜゜・*:.。..。.:*・゜゜・*:.。
<small></small> 挟まれた箇所の字を小さくする
<b></b> 挟まれた箇所の字を太くする
<i></i> 挟まれた箇所の字を斜めにする
<s></s> 挟まれた箇所の字に取消線をつける。
<u></u> 挟まれた箇所の字に下線をつける。
・゜゜・*:.。..。.:*・゜゜・*:.。
「活動報告で書くとこんな感じかな」
・゜゜・*:.。..。.:*・゜゜・*:.。
[入力画面]
[表示画面]
・゜゜・*:.。..。.:*・゜゜・*:.。
「これらのタグを使うだけでも、活動報告の見栄えはだいぶ変わる。もっと言えば、強調したい部分を<b></b>で囲むだけでもだいぶ違うぜ」
「前にも言ったけど<>の中は大文字でも小文字でもいいんだね。タグで挟んだ間に別のタグを入れることはOKなのかい?」
「タグで入れ子にするルールはこういう感じかな」
・゜゜・*:.。..。.:*・゜゜・*:.。
〇: ある<b>タグの間に<i>別のタグ</i>をいれて</b>みよう。
×: ある<b>タグの間に<i>別のタグ</b>をいれて</i>みよう。
・゜゜・*:.。..。.:*・゜゜・*:.。
「前者は、<b></b>間が太字になり、さらに<i></i>間で斜めになる。後者はおかしなことになるぜ」
「入れ子にするのは注意がいりそうだね。他にも『タグの閉じ忘れ』があったら問題になるな。例えば閉じタグ</b>を忘れると、後の字がすべて太字になる。閉じタグの「/(スラッシュ)」を入れ忘れることもあるか」
「今回説明したテキスト表現型のタグと、次回紹介する予定のリンク系のタグを使えば、活動報告がかなりレベルアップするぜ」
「ふむ。この程度なら、割烹エディターを使わなくても自力で書けそうだね」
「さて、なろうの活動報告でタグを使うだけなら問題ないけど。ここで紹介した<b></b>や<i></i>などのテキスト表現系のタグは『使わない方がいい』という意見もあるんだ。Webデザイナーが本格的にHTMLをやる場合の話だけどね」
「うん? それを使うとセキュリティ上の問題があったり、システムの誤動作するかもしれないのか?」
「いやいや、そーいう話じゃないぜ。ある種のお作法だな。テキスト表現系のタグは装飾しているだけで、タグに意味はもってないんだ。強調などの意味のタグが別にあるから、そっちを使うのはおすすめのようだ」
「なるほど。活動報告で使う分には問題はなさそうだね」