みかづきブログ その3

3ヶ月つづけてみました。

style属性で文章の見た目を整えよう。

前回前々回 はタグを使って文章に意味を与えていきました。
今回はstyle属性を使って、文章の見た目を調整していきたいと思います。

style属性とは

タグの見た目を調整する為の属性です。

以前、「」が台詞を表すタグのようなものという話をしましたが、個人的にはstyle属性は台詞のイントネーションを調整する書き込みのようなものだと思っています。

例えば、

シーン 38 『雄山、ハンバーガーを食べる』

雄山 「全くアメリカ人好みの浅ましい食べ物だ...」
雄山 「見ろ手が汚れてしまった!2度とこんなものを出すな!」

という文章を役者さんに渡すと、「」内の文章が台詞ということはわかるものの、
どんなイントネーションで読むかは役者さんの解釈にゆだねられます。

でも、

シーン 38 『雄山、ハンバーガーを食べる』

雄山 「全くアメリカ人好みの浅ましい食べ物だ...(呆れ気味に)」
雄山 「見ろ手が汚れてしまった!2度とこんなものを出すな!(照れ隠し)」

と、書いておけばある程度はイントネーションをコントロールできる訳です。

style属性の書き方

style属性は、

プロパティ: 値;

というように記述します。

なので、もし先ほどの台本をhtml風に表すなら、

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8" />
    <tilte>シーン 38 『雄山、ハンバーガーを食べる』</title>
</head>
<body>
</body>
    <serif style="emotion: akiregimi;">全くアメリカ人好みの浅ましい食べ物だ...</serif>
    <serif style="emotion: terekakushi;">見ろ手が汚れてしまった!2度とこんなものを出すな!</serif>
</html>

※ 当然ですが実際のhtmlにセリフを表すserifタグはありません。
※ また、当然ですが実際のstyle属性には感情を表すemotionプロパティはありません。

いかがでしょう。
こんな感じの台本を渡すと、いい感じのイントネーションで読んでくれる役者さんもいるかもしれません。(いないと思いますが)


さてさて、今回はstyle属性のイメージを説明するにとどまりますが、
次回 は実際のHTMLでつかえるstyle属性のプロパティをつかって見た目を整えていきたいと思います。