#ビジネス

（3）HTMLはメモ帳とブラウザだけで簡単表示!!―文字列を装飾する編

前回まではHTMLとCSSの仕組みなどを素人目線の駆け足でざざっと書いてしまいましたが、今回はブログなどで必須の「文字の装飾」を指定できる方法をまとめました。例えば部分的に太字にしたり大文字にしたりするアレです。

Wordなどのワープロソフトを使用すればすぐにできることもHTMLでいじくる場合は指定されたタグの挿入が必要になります。それを利用していろいろ加工してみましょう。

以下では省いていますが、ブラウザで表示する場合には下記の通り前後にHTMLであることを指示するタグを忘れずに。

指定した文字列を「太字」にする

それでは「大感謝祭セール」を強調するために太字にしてみましょう。

簡単なのでつい多用しがち。教科書にラインを引きすぎて何が重要なのかわからなくなる現象に陥りやすいのでメリハリは大事ですね。
※b→bold

上記のように<strong>というタグでも同様の表示が可能です。使い分けとしては<strong>の方が文章中の単語を強調するという意図が強くなるようですが、正直私はよくわかっていないので気にしていません。

指定した文字列を「斜体」にする

スマホなど小さい画面だと読みづらくなる気がするのであまり使用しませんが、URLなどアルファベットを装飾するのには便利です。
※i→italic

指定した文字列に「下線」を付ける

CSSで下線の装飾もできるのでそちらの方がちょっと手が込んでる感じが出せますが、これも便利。
※u→underline

指定した文字列に「マーカー線」を付ける

こちらもCSSを使用した方が綺麗に装飾できますが、こっちの方が簡単です。べったりと文字列全体が真っ黄色になるので使いすぎると不穏な感じになります。

指定した文字列に「打ち消し線」を付ける

以前書いた文章を削除したいけれど痕跡は残したいぞという時には便利です。
※s→strike

指定した文字列の「色を変更」する

ここから少し変化球が加わります。段落「p」のスタイル「style」は「＝」という感じに指示が増えますがその分応用できることも増えます。それが以下。

指定した文字列の「サイズを変更」する

色の変更ができればサイズの変更も簡単です。単位はいろいろありますが面倒がないのは相対的にサイズを指定できるパーセントです。例えば他の文字より1.5倍に拡大したかったら150％とします。

指定した文字列の「フォント形式を変更」する

このサイトではゴシック体（sans-serif）を標準に指定していますが明朝体（serif）になるようにしてみましょう。

指定した文字列を「中央寄せ」にする

これはCSSで指定した方がいいらしいのですが、できないこともないので参考までに。

応用して遊んでみる

他にもいろいろいじれば某新世紀エヴァンゲリオンみたいにもできます。これは指示が多くなるので別途CSSも使用して記述しています。

＊　＊　＊

タグの使い方に関してはいろいろルール（ブラウザでの表示対応、推奨や非推奨など）みたいなところもあるようなので、業務で使用する場合はそこの環境（チームやプロジェクト）と擦り合わせる必要があります。趣味や一個人の責任の範囲でしたらそれを表示するユーザーに迷惑がかからなければ好きなように組んで問題ない??とは思うのでいろいろトライしてみましょう

＼気になったらSHARE!!／