HTML,CSS,PHP,ワードプレスカスタマイズ 技術情報資料

案外忘れるボックス内で位置を調整できるボックスの書き方

背景画像を持ったBOXの上で文字などをいれて、文字の場所を調整することは結構ありますが。

わすれる(笑)


外側の DIV BOX は、
position: relative;
height:256px;
width:256px;

と、相対位置指定とサイズ。

内側の DIV VOX は、
position:absolute;
top: 30%;
left:30%

と、絶対位置指定と位置指定が必要。

<div style="position: relative; height:256px; width:256px;">
<div style="position:absolute;top: 30%; left:30%">表示文字</div>
</div>


表示文字





外が、position: relative
内が、position: absolkute

忘れないようにw



スポンサーリンク

スポンサーリンク

カテゴリー