![](http://oshiete.xgoo.jp/images/v2/pc/qa/question_title.png?8acaa2e)
No.1ベストアンサー
- 回答日時:
とりあえず画像の場合だけ。
テキストの場合は分かりません。
position: absolute;
left: 50%; top: 50%;
なんてやりたくなるけど、画像の基点は左上の角なので
これでは中央表示にならない。
画像の中央が基点になるようにmarginプロパティで位置を間引きする必要があります。
間引き量は画像のサイズの半分の値。
例
画像サイズ400×288の場合(半分の200と144を引いてやる)
-css-
.test {
margin: -144px -200px;/*画像サイズで変わる*/
left: 50%;top: 50%;
position: absolute;
}
-body-
<div class="test">
<img src="a.jpg" width="400px" height="288px" alt="">
</div>
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- HTML・CSS リンクバナーのHTMLタグ。画像を変えたり、設置位置を変えるとバナー貼付け側はどう見える? 2 2023/02/01 12:01
- HTML・CSS ヘッダーの画像にメインエリアがかぶってしまいます 1 2022/11/28 14:06
- HTML・CSS 要素の幅をいろんな写真の幅に合わせたい。 1 2022/07/25 20:11
- Ameba(アメーバブログ) アメブロは、HTMLのタグの入力を許さないブログ・サイトですか? 1 2023/06/18 18:48
- ホームページ作成・プログラミング アメーバ・ブログは"HTMLタグ"を許可してないのですか? 2 2023/06/17 21:08
- Instagram Instagramユーザーになってるけど、写真と投稿数だけはそのままって、ブロックって事ですか? I 2 2022/09/07 18:23
- WordPress(ワードプレス) ワードプレスで、左寄せ画像と文字を横並びにせず、画像の下に文字を表示される方法を教えてください 1 2022/04/24 11:06
- WordPress(ワードプレス) ワードプレスで、投稿一覧ページにタグを表示する方法 投稿につけたタグを、記事一覧ページにもカテゴリと 1 2023/05/10 21:41
- 数学 情報処理詳しい人!! A4縦のレポート文書に4:3の大きさの横向きの写真画像を貼り付けることにした。 2 2022/12/18 02:30
- その他(プログラミング・Web制作) このWEB用語、WEB文章、意味が分かりますか? 理解できない人が多いようなんですが・・・ 7 2022/10/22 09:13
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
officeソフトを使うために、Mic...
-
BFプラグの海外製品を日本で使...
-
「PC Helpsoft Driver Updated...
-
iPhoneを使っています。 登録し...
-
昨日携帯を買ったのですが、2...
-
i久しぶりにプレステ4で遊ぼう...
-
メルカリの一つのアカウントで ...
-
延長コードが突然火花出て使え...
-
ラチェットの手動のドライバー...
-
急に非通知着信がめちゃくちゃ...
-
VAIOは良いパソコンですか?
-
素朴な疑問なのですが、携帯番...
-
Apple WatchのボイスメモをiPho...
-
メモ帳で開く設定を元に戻したい。
-
ASUSの会員登録に関して
-
スマホで撮った写真をUSBケ...
-
電源ケーブルは電源プラグでも...
-
国内に限定して、今の65歳以上...
-
iPhone12を充電中に横に倒すと...
-
初めて中華ゲーム機を購入した...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
HTML 文字や画像をページ...
-
スタイルシート 画像ポップア...
-
ウェブページで画像を保存出来...
-
メイン画像とサムネイル画像の...
-
ホームページ作成で困っています。
-
親の高さにあわせて画像の縦を1...
-
MAX関数を使ってからLEFT JOIN...
-
jspでcssが読み込めない
-
javascriptテキストBOX色を元に...
-
JSPでの画像ファイル表示
-
eclipseでcssを使うためには?
-
createElementで作成した要素を...
-
読み込んだQRコードをフォーム...
-
jqueryのsortableで一部ソート...
-
JavaScriptで変更した属性の元...
-
Slick.jsのオプションrtlについて
-
console.log結果をhtmlで表示し...
-
textareaに画像を表示したい
-
iframe内のリンクが飛ばないの...
-
画面が真っ白になるのはどうして?
おすすめ情報