どうか力をお貸しください…。
dreamweaverでホームページを作成しています。
640pxの幅を指定した<div>の background-img に、CSSスプライトの中の幅600pxの画像を配置し、background-positionで、0 -100px; のように場所を指定しました。
その幅600pxの画像を640pxの<div>の中で中央寄せで配置したいのですが、どのようにすればいいでしょうか?
padding:20px;は使うことができません。
ご存知の方がいたらよろしくお願いします。
A 回答 (1件)
- 最新から表示
- 回答順に表示
No.1
- 回答日時:
HTMLさえ、ちゃんとしていたら迷うことないと思いますが???
スプライトを使うということは、背景画像ですから、たとえば、本文(section)内のナビゲーション(nav)の背景に使用するのでしたら、HTMLは
<div class="section">
<div class="nav">
<ul>
<li><a href=""></a></li>
・・・以下省略
でしたら、スタイルシートは
div.section{width:640px;margin:0 auto;}
div.section div nav ul,div.section div nav ul li{display:block;list-stylr:none;margin:0;padding:0;text-align:center;line-height:1.8em;}
div.section div nav ul{width:600px;}
div.section div nav ul li{width:100%;height:1.8em;position:relative;}
div.section div nav ul li+li{margin-top:5px;}
div.section div.nav ul li a{display:block;width:100%;height:100%;background:url() no-repeat 0 -100px;}
div.section div.nav ul li a:hover{background-position:0 -150px;
div.section div nav ul li+li a{background-position:0 -200px;}
とか・・・・
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript ソースコードのいじる場所が分かりません。 1 2022/12/23 02:06
- HTML・CSS img と p を縦中央に配置したいのですがうまくいきません。 2 2023/01/12 14:38
- HTML・CSS CSS上での計算を行うためのルールについて教えてください。 3 2022/08/15 14:43
- HTML・CSS スクロールすると追従する画像のコードを書いているのですが、追従する画像の大きさの調節が上手くいきませ 2 2022/04/18 12:52
- JavaScript vertical sliderをautoplayしたい 2 2022/08/25 14:47
- HTML・CSS imgとpを縦・横に中央揃えする 1 2023/01/17 11:30
- HTML・CSS 検索窓とcssハックについて 3 2022/04/22 12:21
- HTML・CSS 下にスクロールしても、追従するボタンのコードを書いたのですが、ボタンの中の画像が半分しか表示されない 1 2022/04/16 21:31
- HTML・CSS 書籍を見つつサイト造りの練習をしているのですが、見た目が一致しません 2 2022/11/28 15:00
- HTML・CSS CSSが効かずどのように指定すれば良いか分からないのでアドバイスお願い致します 2 2023/06/07 12:25
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
htmlの文字が縦書きになる
-
スクロールボックスを中央に配...
-
widthやheightの数値に単位(px...
-
CSS:animation開始位置の設定
-
CSS、width100%でもできる余白
-
【スタイルシート?】同行内で...
-
CSS(0の単位)について
-
CSSで画面サイズを縮小するとレ...
-
表示倍率を変えるとレイアウト...
-
cssで「下よせ」ってどうやって...
-
W3Cのソースコードの検証サービ...
-
中点「・」の改行について
-
ネガティブマージン
-
ページを拡大縮小でborderが消...
-
定義リストで先頭にアイコン
-
<div>と<div>の間の10px程の...
-
日本地図(白地図的)にリンク...
-
hpビルダー 複数の表の罫線を...
-
レイヤーを画面の左右中央に重...
-
CSSで指定した背景画像にリンク...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
htmlの文字が縦書きになる
-
widthやheightの数値に単位(px...
-
画像イメージの上下左右、欲し...
-
css初心者 フレックスボックス...
-
表示倍率を変えるとレイアウト...
-
CSSがなぜかfont-sizeだけ効か...
-
CSS、width100%でもできる余白
-
W3Cのソースコードの検証サービ...
-
CSS:animation開始位置の設定
-
CSSで指定した背景画像にリンク...
-
<div>と<div>の間の10px程の...
-
余分な縦スクロールバーが出て...
-
CSSでボックスのheightが0になる
-
【CSS】ヘッダーの高さが不明の...
-
スクロールボックスを中央に配...
-
li 黒丸含んで移動する方法
-
border-style:solidで文字がずれる
-
【HTML&CSS】フッター下部の余...
-
Media Queries 4 で 非推奨とな...
-
初心者html・CSS ウィンドウを...
おすすめ情報