lunes, 19 de noviembre de 2012

Como crear tu blog en HTML - 1


Hola , esta es mi primera entrada y os voy a indicar como hacer un diseño HTML para blog. 

Material necesario:
-Editor de HTML:
    -HTML-Kit (Muy bueno)
    -Word Pad (Parece que este drogado o algo , pero si sirve)
    -O Google Chrome (También , sirve de mucho, pero cuando ya tengamos algo hecho)
    Son opciones , no obligaciones , podéis coger solo uno de ellos
-(Opcional) Plantilla base
    A veces no saca de trabajos bastantes largos , luego los modificas a tu gusto. Hay muchas por Internet
-Tener un ordenador (No me digáis "No me jodas" , porque hay gente que lo debe estar viendo des de móvil)
-Conocimientos básicos , pero básicos. Es decir , como se compone un HTML por lo menos
-Cerebro

Empecemos. Voy a deciros , a partir de aquí empezaremos una plantilla desde 0 , si la cojeéis de Internet , id al tuto numero (x=aun por hacer)

 -Abrir editor de HTML
 -Empezar por lo básico (Cambio de color para indicar)
    <!DOCTYPE html> <--- Esto indica que tipo de archivo es
       <html> <--Esto , con </html> es el comienza miento y final de la pagina , en medio iría el contenido
           <head> <--Parte invisible del HTML ,en ella hay como por ej.,el estilo CSS , muy importante.
                 Como es invisible , esto no se ve.
           </head>
           <body> <--Contenido de la pagina
                  Pero esto si.
           </body>          
       </html> 

  -¿Habéis entendido hasta aquí? Fácil , ¿no? Eso es  la estructura principal de un HTML , TODAS , pero TODAS las paginas basadas en HTML , son así , Facebook , Google , y muchas mas famosas. Ahora vamos a continuar. Vamos a indicar el estilo. O se puede hacer en el mismo <head> o con un enlace , nosotros vamos a hacerlo desde el head. Podéis crearlos gracias a una guía muy básica que todo el mundo podrá consultar en los códigos CSS que serán subidos después de este tuto. El código CSS nos va a llevar un tiempo.
Vamos a añadir el CSS básico:
    <!DOCTYPE html>
       <html>
           <head> 
              <style type="text/css">
                  body  {
                     color: purple;
                     background-color: #d8da3d }
                  </style>
           </head>
           <body> 
           </body>          
       </html> 

                          
         -Vamos a guiarnos un poco , ¿que es ese código? El estilo . Se habré , como el body,
y se cierra. Adentro se pone el estilo de nuestro elementos que hay en el Body para dentro. ¿Captáis? Es decir , el código que hemos puesto le da unas características al body , que son las siguientes , el color de las letras "color:purple" y el color de fondo "background-color (si miráis los códigos CSS , podéis ver el background puede ser una imagen , color o nada) . Cada característica va separada por un salto de linea y por un ; .
Si os dais cuenta después del body hay un símbolo como este { , y como estamos en HTML , cuando acabamos de escribir algo , hay que cerrarlo , entonces es } .
         -Podéis ir creando vuestros propios estilo gracias a los códigos de CSS que he puesto.

Hasta el próximo tuto .



KevinS1000











2 comentarios:

Unknown dijo...

asdsadsad

karola dijo...

ijij

Publicar un comentario