¡BUENOS DÍAS!
En el día de hoy se han realizado diversas entradas, en segundo lugar hemos realizado la correspondiente a la que se está mostrando, la vista de una página web, modificando colores y creándola al gusto propio, para conseguirlo se han seguido los siguientes pasos:
Pero primero, ¿qué son las entradas de una página web?
Un sitio web,1 portal2 o cibersitio es una colección de páginas web relacionadas y comunes a un dominio de internet o subdominio en la World Wide Web dentro de Internet.34
Todos los sitios web públicamente accesibles constituyen una gigantesca World Wide Web de información, y un gigantesco entramado de recursos de alcance mundial.
A las páginas de un sitio web se accede frecuentemente a través de un URL raíz común llamado portada, que normalmente reside en el mismo servidor físico. Los URL organizan las páginas en una jerarquía, aunque los hiperenlaces, entre ellas controlan más particularmente cómo el lector percibe la estructura general y cómo el tráfico web fluye entre las diferentes partes de los sitios.
Algunos sitios web requieren una subscripción para acceder a algunos o todos sus contenidos. Ejemplos de sitios con subscripción incluyen algunos sitios de noticias, de juegos, foros, servicios de correo electrónico basados en web, sitios que proporcionan datos en tiempo real tal como datos meteorológicos, información económica, horarios, etc.
En primer lugar hemos creado el html:
<html>
<head>
<meta http-equiv="Content-type" content="text/html;charset=UTF-8"/>
<title>Página de prueba de la asignatura doble columna, encabezado y pie</title>
<link rel="stylesheet" type ="text/css" href="MartaMoralesDurán.css">
</head>
<body>
<div id="container">
<div id ="header">
<h1>Sitio web de Marta (SCM)</h1>
</div> <!--fin de header-->
<div id="menu">
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">Servicios</a></li>
<li><a href="#">Sobre mi</a></li>
<li><a href="#">Contacto</a></li>
</ul>
</div> <!-- fin de menu-->
<div id="mainContainer">
<div id ="content">
<h1>¡Bienvenido!</h1>
<p>Me llamo Marta y esta web vendrán contenidas una gran serie de elementos que llamarán tu atención</p>
<h2>COMIENZA LA AVENTURA</h2>
<p>Para comenzar haz click aquí</p>
<h2>- Primera entrada</h2>
<p>En esta primera entrada se introduce a mundo de la ciencia y además se deja entrever los elementos que estaremos analizando más adelante</p>
<h2>- Segunda entrada</h2>
<p>¿Te gustaría saber para que sirve una cucaracha robot?</p>
</div> <!--fin del content-->
<div id="sidebar">
<h3 ALIGN=CENTER>Menu</h3>
<ul>
<li>Curiosidades</li>
<li>Videos utilizados</li>
<li>Más info</li>
</ul>
</div> <!-- fin de sidebar-->
<div id="footer">
<p> Sistemas de comunicación Multimedia</p>
</div> <!-- fin de footer-->
<!-- fin de container-->
</body>
</html>
Más tarde hemos realizado el css:
body{
font-family: consola;
}
#container{
margin:0 auto;
width:100%;
}
#header {
background-color:#86463a;
padding:10px;
}
#menu{
float:left;
width:100%;
background-color:#c37349;
}
#menu ul li{
list-style-type:none;
display:inline;
}
#menu li a{
display:block;
text-decoration:#c37349;
border-right:2px solid white;
padding: 1px 20px;
float: left;
color:white;
}
#menu li a:hover{
background-color: white;
}
#mainContainer{
float:left;
width:100%;
}
#content{
clear:left;
float:left;
width:65%;
padding: 39px 0;
margin: 0 0 0 5%;
display: inline;
}
#sidebar {
float:right;
width: 30%;
padding: 67.5px 0;
margin: 0;
display: inline;
background-color:#FFDEBC;
}
#footer {
clear:left;
background-color:#86463a;
text-align:center;
padding: 50px 0;
height:1%;
}
HAZ CLICK PARA IR DIRECTX A LA PÁGINA
Comentarios
Publicar un comentario