I am learning HTML by myself (doing free searches and courses on the internet), I came across the following problem:
I have a background image that has been correctly applied, but I can not add another image correctly, it is cropped (I put a picture of how it was), which will be under the text and will scroll along with Scroll from the page, and stay on top of the background.
Mystyleisbeingeditedinanotherfilenamedestilo.css
,notdirectlyinHTML.Obs.:I'mabeginnerinhtmlandcss.
FollowmyCSSCSScode:
@charset"utf-8";
body {
background-image: url("../_imagens/fundo1.jpg");
background-repeat: no-repeat;
background-position: center center;
background-attachment: fixed;
color: rgba(250, 250, 250, 0.8);
}
h1 {
text-align: center;
}
div.logo {
background-image: url("../_imagens/logoktg.png");
background-repeat: no-repeat;
background-position: center center;
background-attachment: scroll;
}
The following is the html code:
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<title>Ka-Tet Gaming</title>
<link rel="stylesheet" href="_css/estilo.css"/>
</head>
<body>
<div id="header">
<div class="logo" id="logo">
<header id="cabecalho">
<hgroup id="titulo">
<h1>Seja Bem Vindo ao Site da KTG!</h1>
<h2>Time Range 1 da PlayerLink.</h2>
</hgroup>
</header>
</div>
</div>
</body>
</html>