html page background with css

Asked

Viewed 109 times

-5

Hello I have a page I added the msm css of the other page the other page is right but that of this page the image is only in the middle of the screen the rest is black look inserir a descrição da imagem aqui

And on PC the msm thing here is my css code

All my HTML code is this

<!DOCTYPE HTML><html><head>

 <link rel="shortcut icon" href="7f61e6b29ed1bdc580b02bb5e78b07a2.png" type="image/x-png">
  <meta charset="UTF-8">
  <meta http-equiv="x-ua-compatible" content="ie=edge">
<script type="text/javascript" src="source.js"></script>
<style>

html, body {
  display: table;
  width: 100%;
  height: 100%;
  padding: 100px 0;
  text-align: center;
  color: white;
  background: url(scary_wolf-wide.jpg) no-repeat bottom center scroll;
  background-position: 30% 45%;
  background-color: black;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  background-size: cover;
  -o-background-size: cover;

 }

h3 { color:red; } h4 { color:red; font-size:30px; } 
body{ zoom: 100%; } footer { position: absolute; bottom: 0px;}
</style>

</head><body>

<h2>Área de login</h2>
<form name="login">
<center>
<fieldset>
<h3>Usuário:</h3>
<input type="text" id="username" size="20" />
<h3>Senha:</h3>
<input type="text" id="password" size="20" />
<br><input type="checkbox" id="lembrar-senha">Lembrar senha</br>
<br><input type="checkbox" id="bt-termos">Ao clicar você concordará com os termos e condições</br>
</fieldset>
<input type="button" id="bt-login" value="LOGIN" onclick="Login() "/>
</form></center>

<footer>
<a id="terms" href="dakota301.github.io/termos.html">Termos e condições</a>
<br><a href="dakota301.github.io/comprar_acesso.html">Comprar login</a></br>
</footer>

</body></html>
  • 2

    Appendage html on the dial, like this: html, body {.

  • I did it here man but it didn’t matter no

  • Cara edits and puts his html in the question too

  • Ready now , only that has not solved yet "/

2 answers

-1


Remove html from the css block:

remove -> html,

Upshot:

body {
    display: table;
    width: 100%;
    height: 100%;
    padding: 100px 0;
    text-align: center;
    color: white;
    background: url(scary_wolf-wide.jpg) no-repeat bottom center scroll;
    background-position: 30% 45%;
    background-color: black;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
    margin: 0
}

Adds a new CSS block:

html{
    height: 100%;
}

Output example:

Example on scratchpad (background image I used any)

  • You know why I can’t show my HTML code here?

  • It worked out man vlw you’re a genius

-2

It would be interesting to create your container instead of using the body.

creates an ID and assigns your css to that ID.

Browser other questions tagged

You are not signed in. Login or sign up in order to post.