1

tengo un problema, empecé de 0 una página y escribí el código html con el css pero al abrirlo en el chrome no veo nada. Solo blanco. Dejo abajo el html y el css:

<!DOCTYPE html>
<html>

<head>
        <meta http-equiv="Content-Type" content="text/html" />
        <meta charset="utf-8">
        <link reel="stylesheet" href="estilo.css" type="text/css"/>
        <title> NIAGARA </title>
</head>
<body>
        <header id="cabecera">
        </header>

        <section id="contenido">
        </section>

        <footer id="pie">
        </footer>
</body> 
</html>

estilo.css

body {
    background-color: white;
    margin: 0px;
}

#cabecera {
    background-color: blue;
    width: 960px;
    height: 200px;
    margin-left: auto;
    margin-right: auto;
}

#contenido {
    background-color: red;
    width: 960px; 
    height: 500px;
    margin-right: auto;
    margin-left: auto;
}

#pie {
    background-color: green;
    width: 960px;
    height: 100px;
    margin-right: auto;
    margin-left: auto;
}

Quizás haya escrito algo mal, estoy estudiando, pero nunca tuve errores y no veo ninguna en la sintaxis. Entiendo que puede ser otra cosa lo que hace que mi página se vea toda en blanco pero no se qué. También probé abrirlo desde el localhost con xampp aunque no haya agregado php aún pero me aparece lo mismo. AIUDA.

0

2 respuestas 2

3

Seguramente es porque la ruta hacia el css no es la correcta. Tu css se llama estilo.css y esta en la misma carpeta que tu codigo html?

Adicionalmente, tienes el atributo rel mal escrito en la etiqueta. Deberia ser rel y no reel.

Probe tu codigo en CodePen y funciona bien: https://codepen.io/sanmen1593/pen/yPjOOR

Por lo que estoy seguro que es un error de como linkeaste tu css.

1
  • sí, era eso! estaba mal escrito reel, era rel. Todavía no me acostumbro. MUchas graciasssssssssss
    – Ditar_
    Commented el 22 nov. 2017 a las 15:16
3

Tienes un error gravísimo en tu etiqueta <link>, el atributo reel no existe debería ser rel con una sola e.

body {
    background-color: white;
    margin: 0px;
}

#cabecera {
    background-color: blue;
    width: 960px;
    height: 200px;
    margin-left: auto;
    margin-right: auto;
}

#contenido {
    background-color: red;
    width: 960px; 
    height: 500px;
    margin-right: auto;
    margin-left: auto;
}

#pie {
    background-color: green;
    width: 960px;
    height: 100px;
    margin-right: auto;
    margin-left: auto;
}
<!DOCTYPE html>
<html>
<head>
   <meta http-equiv="Content-Type" content="text/html" />
   <meta charset="utf-8">
   <link rel="stylesheet" href="estilo.css" type="text/css"/>
   <title> NIAGARA </title>
</head>
<body>
        <header id="cabecera">
        </header>

        <section id="contenido">
        </section>

        <footer id="pie">
        </footer>
</body> 
</html>

3
  • Hola, gracias por responder, pero en éste caso quiero los estilos fuera del archivo html. Por eso la etiqueta <link reel="stylesheet" href="estilo.css" type="text/css"/>. alguna respuesta a ésto? gracias.
    – Ditar_
    Commented el 22 nov. 2017 a las 15:13
  • Ah no había visto que tenías ya la etiqueta <link>, el error que veo está en tu atributo reel debería ser rel Commented el 22 nov. 2017 a las 15:14
  • GRACIASSSSSSSS tenía mal escrito rel. Gracias gracias <3
    – Ditar_
    Commented el 22 nov. 2017 a las 15:15

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.