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,27 +19,44 @@ 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;
} }
main{ main {
padding: 1em; padding: 1em;
} }
#servicios,#productos,#contacto{ #servicios,
padding-top: 70px; #productos,
#contacto {
padding-top: 100px;
margin-top: -20px; margin-top: -20px;
} }
.menu{ .menu {
padding-left: 1em; padding-left: 1em;
} }
@ -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,23 +114,23 @@ ul {
margin: auto; margin: auto;
font-weight: bold; font-weight: bold;
} }
li{
list-style-type:circle; li {
list-style-type: circle;
} }
span{ span {
color: #1a89dc; color: #1a89dc;
width: 300px; width: 300px;
} }
iframe{ iframe {
width: 100%; width: 100%;
border: 2px solid #1a89dc; border: 2px solid #1a89dc;
box-sizing: border-box; box-sizing: border-box;
} }
#subircaja{ #subircaja {
position: fixed; position: fixed;
right: 10px; right: 10px;
bottom: 10px; bottom: 10px;
@ -116,4 +138,30 @@ iframe{
#subirimg { #subirimg {
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">
<nav> <header id="cabecera">
<div class="menu"> <img src="./imagenes/logo.png" alt="Logo">
<a class="boton_menu" href="#home">Inicio</a> <nav>
<a class="boton_menu" href="#servicios">Servicios</a> <div class="menu">
<a class="boton_menu" href="#productos">Productos</a> <ul class="lista_menu">
<a class="boton_menu" href="#contacto">Contactos</a> <li><a class="boton_menu" href="#home">Inicio</a></li>
</div> <li><a class="boton_menu" href="#servicios">Servicios</a></li>
<hr> <li><a class="boton_menu" href="#productos">Productos</a></li>
</nav> <li><a class="boton_menu" href="#contacto">Contactos</a></li>
</ul>
</div>
<hr>
</nav>
</header>
<main> <main>
<h2>Presentación</h2> <h2>Presentación</h2>