Para colocar una imagen de fondo, es mejor que procedas de esta forma:
- No uses estilos inline es decir dentro de las mismas etiquetas
- Usa la propiedad
background-image
para indicar el recurso que irá de fondo - Para cubrir usa la propiedad
background-size
con la opción cover - Si por alguna razón tu imagen no alcanza el 100 por ciento del espacio visible para cubrirla puedes hacer uso de
width: 100vh;
- Al
body
le quitas elmargin
Quedando así:
body {
background: url(url_tu_imagen);
background-size: cover;
background-repeat: no-repeat;
margin: 0;
height: 100vh;
}
Ejemplo completo
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
<style>
img{
width: 100%;
}
body {
background: url(https://placekitten.com/500/500url_tu_imagen) ;
background-size: cover;
background-repeat: no-repeat;
margin: 0;
height: 100vh;
}
</style>
</head>
<body>
</body>
</html>