Poner una imagen en el header y el menus enciama centrado
Publicado por Jordi (3 intervenciones) el 17/11/2020 08:21:34
Buenos días,
Tengo que poner una imagen de fondo en el <header> y justo encima el menú, centrado pero no lo consigo, hasta ahora esto es lo que he hecho.
html:
CSS
Debería quedar algo como la imagen adjunta.
Gracias
Tengo que poner una imagen de fondo en el <header> y justo encima el menú, centrado pero no lo consigo, hasta ahora esto es lo que he hecho.
html:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<!!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="css/estilos.css">
<title>WEB</title>
</head>
<body>
<header>
<h1 class="cabezera"><span>la Web titulo</span></h1>
<nav class="menu">
<ul>
<il>menu1</il>
<il>menu2</il>
<il>menu3</il>
<il>menu4</il>
<il>menu5</il>
</ul>
</nav>
</header>
</body>
</html>
CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
body{
margin: 0px;
}
header h1 {
background: #3789C8 url(../img/cabecera.jpg) center center no-repeat;
background-size: cover;
padding: 100px 70px 70px;
margin: 0;
font-size: 2.5rem;
font-weight: 800;
}
header h1 span {
padding: 30px 0;
display: block;
color: #ffffff;
}
Debería quedar algo como la imagen adjunta.
Gracias
- hed.zip(18,4 KB)
Valora esta pregunta


0