This commit is contained in:
Marcos Lopez 2023-12-13 13:48:34 +01:00
parent d4364785fc
commit e876481b58
4 changed files with 78 additions and 25 deletions

Binary file not shown.

View File

@ -8,6 +8,10 @@
outline: none; outline: none;
} }
html{
scroll-behavior: smooth;
}
body { body {
background-image: url("../imagenes/fondo_plano.jpg"); background-image: url("../imagenes/fondo_plano.jpg");
background-repeat: no-repeat; background-repeat: no-repeat;
@ -15,12 +19,27 @@ body {
font-family: Arial, Helvetica, sans-serif; font-family: Arial, Helvetica, sans-serif;
} }
nav{ #cabecera {
position: sticky;
top: 0;
background-color: white;
padding:1em;
display: flex;
align-items: end;
justify-content: space-between;
}
#cabecera img {
width: 60px;
height: 60px;
}
/* nav {
position: sticky; position: sticky;
top: 0; top: 0;
width: 100%; width: 100%;
background-color: white; background-color: white;
} } */
nav hr { nav hr {
box-shadow: 0px 4px 5px 0px; box-shadow: 0px 4px 5px 0px;
@ -30,8 +49,10 @@ main{
padding: 1em; padding: 1em;
} }
#servicios,#productos,#contacto{ #servicios,
padding-top: 70px; #productos,
#contacto {
padding-top: 100px;
margin-top: -20px; margin-top: -20px;
} }
@ -45,7 +66,6 @@ main{
font-size: 40px; font-size: 40px;
} }
hr { hr {
width: 100%; width: 100%;
background-color: #1a89dc; background-color: #1a89dc;
@ -53,7 +73,9 @@ hr {
margin-left: 0px; margin-left: 0px;
} }
h2,h3,p { h2,
h3,
p {
padding: 1em; padding: 1em;
} }
@ -92,6 +114,7 @@ ul {
margin: auto; margin: auto;
font-weight: bold; font-weight: bold;
} }
li { li {
list-style-type: circle; list-style-type: circle;
} }
@ -99,7 +122,6 @@ li{
span { span {
color: #1a89dc; color: #1a89dc;
width: 300px; width: 300px;
} }
iframe { iframe {
@ -117,3 +139,29 @@ iframe{
width: 64px; width: 64px;
height: 64px; height: 64px;
} }
.lista_menu {
/* display: inline; */
width: 100%;
}
.lista_menu li {
list-style-type: none;
float: left;
}
@media (max-width: 550px) {
.lista_menu li {
list-style-type: square;
text-align: left;
clear: left;
}
.boton_menu {
font-size: 1em;
}
#servicios,
#productos,
#contacto {
padding-top: 120px;
margin-top: -60px;
}
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.0 KiB

View File

@ -9,15 +9,20 @@
</head> </head>
<body id="home"> <body id="home">
<header id="cabecera">
<img src="./imagenes/logo.png" alt="Logo">
<nav> <nav>
<div class="menu"> <div class="menu">
<a class="boton_menu" href="#home">Inicio</a> <ul class="lista_menu">
<a class="boton_menu" href="#servicios">Servicios</a> <li><a class="boton_menu" href="#home">Inicio</a></li>
<a class="boton_menu" href="#productos">Productos</a> <li><a class="boton_menu" href="#servicios">Servicios</a></li>
<a class="boton_menu" href="#contacto">Contactos</a> <li><a class="boton_menu" href="#productos">Productos</a></li>
<li><a class="boton_menu" href="#contacto">Contactos</a></li>
</ul>
</div> </div>
<hr> <hr>
</nav> </nav>
</header>
<main> <main>
<h2>Presentación</h2> <h2>Presentación</h2>