![](http://oshiete.xgoo.jp/images/v2/pc/qa/question_title.png?e8efa67)
初心者です。よろしくお願い致します。
cssでホームページを作っています。
index.htmlに画像を中央に貼り付けたいのですが、
firefoxでは中央揃えに、IEでは左側に表示されます。
下にタグを書くので、ご回答いただけましたら幸いです。
よろしくお願い致します。
--------------------------------------------------
<html>
<head>
<title>○○○</title>
<link href="design/index.css" rel="stylesheet" type="text/css">
</head>
<body>
<div class="contents">
<img src="img/tobira.jpg">
</div>
</body>
</html>
--------------------------------------------------
/*ページのレイアウト用css*/
body{
margin:0px;
padding:0px;
background-color:#FFFFFF;
}
body a img{
border: none;
align:center;
}
.contents{
width:800px;
margin:0px auto;
margin-top:100px;
}
h1{
color: #FFFFFF;
}
No.1ベストアンサー
- 回答日時:
body a img{
border: none;
align:center;
}
スタイルシートにalignというプロパティはありません。
img要素にはalt属性をつけましょう。
.contents に text-align:center; を付け加えることで、
<div class="contents">~</div> の中身を中央寄せにできます。
これは、トップページで
body{
text-align:center;
}
で解決できました^^
このたびは、ありがとう御座いました。
次のページ作成中でして、質問を投稿しましたので
もしよろしければ覗いてみてくださいませ。
No.2
- 回答日時:
こんにちは
firefoxでは中央揃えに・・・なっていないような気がするのですが(他の要素が影響してるのかな? --;)とりあえず・・・
h1 CSSがあるので<img>以外にもcontents内に文字とかがあるのかな?
それら全部を中央寄せにしてもいいのであれば#1様の言うように.contents CSS内にtext-align:center;を付け加えれば<img>に個別に指定してやらなくてもO.K.です
個別にするなら
img {
border:none;
display:block;
margin:auto;
}
のようにインライン要素ではなくブロック要素にしてやればmarginを使用することが出来ます
これは、トップページで
body{
text-align:center;
}
で解決できました^^
このたびは、ありがとう御座いました。
次のページ作成中でして、質問を投稿しましたので
もしよろしければ覗いてみてくださいませ。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- HTML・CSS 書籍を見つつサイト造りの練習をしているのですが、見た目が一致しません 2 2022/11/28 15:00
- HTML・CSS cssの display: flex;で横並びにならずに困ってます 1 2022/12/04 13:18
- HTML・CSS html/cssで要素が出てこなくて困ってます 1 2022/12/31 16:59
- HTML・CSS html cssのmargin 5 2022/12/03 11:04
- HTML・CSS ヘッダーの画像にメインエリアがかぶってしまいます 1 2022/11/28 14:06
- JavaScript jQueryでのドラッグアンドドロップについて 1 2022/07/30 09:10
- JavaScript jqueryを使ったスムーススクロールのコードを書いたのですが、HTMLコード内にある、a butt 2 2022/04/14 10:59
- HTML・CSS テキストを画面の真ん中に配置したいです。 2 2022/11/25 16:11
- HTML・CSS cssが効かなくて困ってます 1 2023/01/01 23:57
- HTML・CSS htmltとcssのコードで 1 2022/11/26 13:37
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
写真とキャプションを横並びに...
-
画像の場合のみ、下線を消す方...
-
リンクを知らせる手のマークが...
-
リンク画像のラインを消したい
-
htmlで画像を2個ずつ並べていき...
-
ホームページで画像を横に並べ...
-
css firefox IE 画像を中央揃え...
-
画像を横に並べるには
-
htmlの文字が縦書きになる
-
【ヒトの神秘】美男美女から何...
-
textareaの幅を画面と合わせたい
-
<h1>、<h2>と<p><div>の行間を...
-
smallにtext-allignが効かない
-
tdに対してmin-heightの定義、...
-
HTML属性での「""」 「''」違い
-
footer を横幅いっぱいに広げる...
-
訪問済のリンク色を変えない方法
-
ワードにコピペ、画像が表示さ...
-
マージソートの計算量について-...
-
ドロップダウンメニューが隠れ...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
ボタンをセル内一杯に表示させ...
-
リンクを知らせる手のマークが...
-
htmlで画像を2個ずつ並べていき...
-
ポップアップウィンドウのサイ...
-
画像のサイズが変わらない
-
XML画像データををHTMLで簡単に...
-
【HTML/CSS】ボタンの枠が伸び...
-
UDP通信を使うチャットプログラ...
-
リンクを選択したときの青い枠...
-
favicon.ico はもういらない?
-
table で画像をピッタリとくっ...
-
CSSの左横に隙間ができてしまい...
-
HTMLのIMAGEに。。
-
ホームページで画像を横に並べ...
-
画像とテーブルの隙間をなくす。
-
リンクをつけた画像をクリック...
-
HTMLは、シングルクォートかダ...
-
縦長広告をウェブページの右側...
-
c言語を用いて画像の透明度をあ...
-
ホームページタグ打ち。サイズ...
おすすめ情報