テンプレート上でCSSを整える

kayama 43views 更新:2015年4月21日

<header></header>にスタイルシートを書く場合のほかに、htmlタグに直接スタイルを設定する方法があります。

<X style="◯◯◯:値;△△△:値;"></X>

例えば高さ50pxの画像の横に、画像の高さのちょうど真ん中に文字を表示させたい場合、以下の様な感じになります。

<div class="floatLeft">
 <img src="XXX.jpg" alt="XXX" width="50px" height="50px">
</div>
<div style="height:50px;line-height:50px;">
 文字
</div>

floatLeftのように汎用性の高いCSSはクラスで呼び出せるのでほとんど出番はないと思いますが、その場限りのcssなどはこんな感じで記述することが出来ます。

ログイン / 新規登録してコメントする

このソースコードをストックして後で利用したり、作業に利用したソースコードをまとめることができます。

こちらもお役に立つかもしれません