空からアポロ

« 記事タイトルに見出しアイコン | トップページ | 火中の栗じゃないでしょ »

2004.05.11

見出しアイコン位置調整

「やろうと思ったらすぐ実行２！」（爆）
先程の記事の続編です。
記事の見出しにつけたアイコンの位置を直してみました。

今回参考にさせて頂いたのは
とほほのｗｗｗ入門　さん：「とほほのスタイルシート入門」
です。
（リンクフリーだということでご紹介）
キレイにカテゴライズされているので、スタイルシートの目的の内容が良く解りました＾＾

さて、変更してみました。
ｈ3の中でも、変えた所だけ抜き出しています。
赤・太い文字部分を変えました。

■変更前

【content h3 の中の･･･】 ★background-position:left; （背景の位置） ★text-indent:30px; （テキストの最初の文字の位置）

上記だとこう表示されていました（画像↓）

■変更後

【content h3 の中の･･･】 ★background-position:10ｐｘ; （背景の位置） ★text-indent:45px; （テキストの最初の文字の位置）

上記に変更したらこう表示されました（画像↓）

※テキストの位置も変えてあげないと、余白を採った分テキストに画像が被ってしまうんですね＾＾；

先程ご紹介の「とほほのスタイルシート」さんを読んだのですが、他に％やemなどの単位付きの数値で指定してあげればよいみたいです。
まだまだどれくらい数値を変えると、見た目どれだけ変わるかがイマイチ解らないので流石に１回ではキマらないですね（笑）

・・・今回本当に初めてスタイルシート弄っているので、「正しい指定」が出来ているかちょっと不安ですが・・・
（間違っていたら、お手数ですが是非にワタクシめに教えてやってください！）
やってみると、これはココのことだったのかー！とか色々楽しいですね＾＾
ふー。目が疲れた( ´,_ゝ`)

2004 05 11 10:24 午後 | 固定リンク

■トラックバック

この記事のトラックバックURL:

（トラックバックは記事投稿者が公開するまで表示されません。）

この記事へのトラックバック一覧です: 見出しアイコン位置調整:

■コメント