Foros del Web - Ver Mensaje Individual

lexell · #8 (**permalink**) 24/09/2015, 10:48

Código:

<!DOCTYPE html>

<html lang="es">

    <head>
        <meta charset="utf-8" />
        <title>Rub&eacute;n Manzano Jim&eacute;nez</title>
        <link rel="stylesheet" href="./StyleSheet.css" type="text/css" media="all" />
    </head>
    <body>
        <div id="contenedor">
            <header>
                <h1>Rub&eacute;n Manzano Jim&eacute;nez</h1>
                <h2>&nbsp;&nbsp;&nbsp;Ingeniero Inform&aacute;tico</h2>
            </header>
            <section>
                <nav>
                    <ul class="menu">
                        <li class="activo"><a href="./index.html">Inicio</a></li>
                        <li><a href="./contacto2.html">Contacto</a></li>
                        <li><a href="./galery.html">Galer&iacute;a</a></li>
                        <li><a href="#">Linked-in</a></li>
                    </ul>
                </nav>
        <br><br><br>
                
                    <h3>Bienvenido</h3>
                    <h4>Sobre m&iacute;:</h4>   
                
                <article>
                    parrafo 1
                    <br><br>
                    parrafo 2
                </article>
            </section>
            <footer>
                <small>
                    Copyright &copy; 2015<br/>
                    Actualizado en: 21 Septiembre 2015           
                </small>        
            </footer>  
        </div> 
    </body>
</html>

Código:

            @font-face {
                font-family: miFuente; 
                src: url('/nat/dj.ttf');                        
            } 
            * {
                margin: 0;
                padding: 0;
            }
			body {
                width: 100%;
                height: 100%;
                background-color: #cac9c9;
                background-size: cover;
                background-repeat: no-repeat;
                background-position: top;
				font-family: miFuente;
				font-size: 13px;
				margin: 0;	
			}
            form{
                font-family: miFuente;
                text-align: center;
            }
		
			.page {
                
				width: 840px;
				margin: 0 auto;
                margin-left: 15px;
			}
			header{
                margin-left: 50px;
                margin-right: 46px;
                background-color: #25037c;
                font-size: 20px;  
                height: 10vh;
                border-radius: 7px 7px 0px 0px;
            }
            h1{
                margin-left: 25px;
                margin-top: 55px;
                color: #fff;
            }
            h2{
               margin-top: 0px;
               margin-left: 0px;
               font-size: 20px;
               color:#25037c;
               background-color: #cac9c9;
            }
            h3{
                text-align: center;
                margin-top: 10px;
                font-size: 20px;
                color:#25037c;
            }
            h4{
                margin-top: 10px;
                margin-left: 59px;
                font-size: 20px;
                color:#25037c;
            }
            section{
                background-color: #fff;
                height: 76vh;
                margin-top: 30px;
                margin-left: 50px;
                margin-right: 46px;
            }
            
            nav{
                width: 500px;
                padding: 0;
                margin: 20px auto;
                border-top: 1px solid #25037c;
            }
            
            .menu{
                list-style: none;
                margin: 0;
                color: #25037c;
            }
            .menu li{
                float: left;
                padding: 0;
                line-height: 1;
                text-align: center;
                color: #25037c;
                
            }
            .menu li a{
                color: #25037c;
                padding: 10px 25px;
                font-size: 17px;
                display: block;
                -webkit-transition: all .3s ease-in-out;
                -moz-transition: all .3s ease-in-out;
                -ms-transition: all .3s ease-in-out;
                -o-transition: all .3s ease-in-out;
            }
            .menu li a:hover,.menu li.activo a{
                -webkit-box-shadow: 0px -4px 0px #25037c inset;
                box-shadow: 0px -4px 0px #25037c inset;
            }          
            
            article{
                
                margin-left: 80px;
                font-size: 17px;
                color:#25037c;
                margin-right: 80px;
            }
			img {
				border: none;
				clear: both;
			}
			
			a {
				text-align: left;
				display: block;
				margin: 10px 0;
			}
            footer{
                margin-left: 50px;
                margin-right: 46px;
                text-align: center;
                background-color: #25037c;
                color: #fff;
                height: 10vh;
                border-radius: 0px 0px 7px 7px;
            }
			.hero {
				margin-bottom: 30px;
			}
			.url {

				margin-bottom: 110px;
			}
            #contenedor {
                width: 98%;
                margin: 10px auto;
            }