画像の背景を背景色と同じ色にしたいです。
また、文字を画像の上に重ねて表示させたいです。
さらに、重ねた文字の下の画像だけをフェードインさせるにはどうすればいいのでしょうか?
HTML
1<!DOCTYPE html> 2<html> 3 <head> 4 <meta charset="utf-8"> 5 <link rel="stylesheet" href="main.css"> 6 </head> 7 <body> 8 <div id="main"> 9 <div id="main_div"> 10 <h1>BBBBBBBBBBB</h1> 11 <img src="coronavirus-6826309_1280.jpg"> 12 </div> 13 </div> 14 </body> 15</html>
css
1@charset "utf-8"; 2 3body{ 4 margin: 0; 5 padding: 0; 6} 7 8#main{ 9 width: 90%; 10 margin: 30px auto 0; 11 background-color: gray; 12 height: 500px; 13} 14 15#main_div{ 16 margin: 0; 17 width: 100%; 18 height: 500px; 19 display: flex; 20 flex-direction: row; 21 justify-content: flex-end; 22} 23 24#main_div h1{ 25 margin: 150px 0 ; 26} 27 28#main img{ 29 display: inline-block; 30 width: 600px; 31 height: 500px; 32}
回答2件
あなたの回答
tips
プレビュー