HTML:
<head>
<meta charset="UTF-8">
<title>Castlevania: SOTN</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<header>
<strong>Castlevania BRASIL (Fansite)</strong>
</header>
<img id="banner" src="hqdefault2.jpg">
<div class="home">
<h1>CASTLEVANIA: SYMPHONY OF THE NIGHT</h1>
<p>Agora o <strongm>melhor jogo</strong> do PlayStation 1 está de <strong>site</strong> novo.</p>
<p>Confira abaixo os tutoriais parSSa detonar <strong><em>QUALQUER</em></strong> chefão!</p>
</div>
<div class="bosspage">
<img id="banner2" src="banner2.jpg">
<h2>CHEFÕES</h2>
<ul>
<li class="boss"> <img id="slogra" src="slogra.png"> Slogra e Gaibon</li>
<li class="boss"> <img id="scylla" src="scylla.jfif"> Scylla</li>
<li class="boss"> <img id="lesser" src="lesser.png"> Lesser Demon</li>
<li class="boss"> <img id="medusa1" src="medusa1.gif"> Medusa</li>
</ul>
</div>
<img id="konami" src="konami.jpg">
</body>CSS:
body { background-color: rgb(255, 0, 0); }
header {
padding-top: 10px;
padding-bottom: 15px;
font-size: 30px;
color: rgb(0, 0, 0);
text-align: center;
}
#banner {
display: block;
margin-left: auto;
margin-right: auto;
height: 5cm;
padding-bottom: 15px
}
.home {
background: black;
padding: 1cm;
}
h1 {
background-color: black;
line-height: 3cm;
color: darkgoldenrod;
text-align: center;
}
p {
text-align: center;
background-color: black;
color: rgb(255, 0, 0);
font-size: 30px;
line-height: 1cm;
}
strong em {
font-size: 25px;
}
#banner2 {
display: block;
margin-left: auto;
margin-right: auto;
height: 10cm
}
.bosspage {
background-color: rgb(0, 0, 0);
padding: 1cm;
}
h2 {
line-height: 3cm;
color: darkgoldenrod;
text-align: left;
}
.boss {
text-align: left;
color: rgb(255, 254, 254);
font-size: 25px;
line-height: cm;
}
#slogra {width: 3cm; height: 2cm;}
#scylla {width: 3cm; height: 2cm;}
#lesser {width: 3cm; height: 2cm;}
#medusa1 {width: 3cm; height: 2cm;}
#konami {
display: block;
margin-left: auto;
margin-right: auto;
height: 2cm;
padding-top: 10px;
padding-bottom: 10px;
}
