WINTXCODERS Terminal
[visitante@wintxcoders-pc ~]:$ Bienvenido a la comunidad
Recuerda que puedes participar en nuestra comunidad registrándote

Estructura basica de HTML5

Iniciado por @Zanut Sec, Febrero 02, 2015, 06:31:25 PM

« anterior - próximo »

@Zanut Sec

Visitante
  • Febrero 02, 2015, 06:31:25 PM Last Edit: Febrero 03, 2015, 02:42:29 PM by @Zanut Sec
    Bueno que tal amigos, aquí empezando con el mini-curso, al lió señores. Lo que hoy aprenderemos sera a crear la estructura básica que debe llevar toda pagina web.Vamos a empezar con el doctype, html y head.
    Código (html5) [Seleccionar]

    <!DOCTYPE html>
    <html lang="es">
    <head>
      <title>Mini-curso: Crea tu propia pagina web</title>
    </head>
    </html>

    Escribimos siempre la etiqueta doctype, después html que tiene una etiqueta lang que su significado en español seria lenguaje y es eso a lo que refiere, al idioma que utilizaremos en la web. Esta el head que en español significa "cabeza" adentro de tal posicionaremos el titulo de la web, también el <meta charset="utf-8"> que sirve para corregir las tildes y no salgan caracteres desconocidos.
    Como nosotros vamos a utilizar CSS3 pues debemos enlazando y ustedes os preguntareis como se hace eso pues seria <link rel="stylesheet" href="ruta" /> Aquí empezaremos ahora con el body llamado "cuerpo"
    Código (html5) [Seleccionar]

    <body>
      <h1>Esto es WintxCoders</h1>
      <p>¿Esto es un parrafo?</p>
    </body>

    Podemos utilizar las etiquetas <h1> ¿que es eso? pues la etiqueta h1 es lo mismo que h2, h3, h4, h5, h6 eso significa el tamaño de la letra. También, podemos crear un nav es lo mismo que la barra de navegación adonde se encuentra siempre el Inicio, Contacto y tal. Quedaría asín:
    Código (html5) [Seleccionar]

    <nav>
      <ul>
        <li><a href="redireccion">"Inicio"</a></li>
        <li><a href="redireccion">"Contacto"</a></li>
        <li><a href="redireccion">"Acerca de"</a></li>
      </ul>
    </nav>


    Bueno amigos, aquí os dejo ya el próximo curso empezare a utilizar imágenes demostrando lo que hemos practicado acá ya porque iremos mas a fondo.
    Saludos, @Zanut Sec.


    PAYASAKX

    Maestro

  • Desconectado
  • Buen tutorial, aunque podrías borrar este y poner en el otro post que creaste #1 | Mini-curso HTML5 & CSS3. Para evitar los dobles post   ;)

    WIитX

    Administrador

  • Desconectado
  • Buenas puedes usar las etiquetas GheSi para una mejor visualización del código, por ejemplo:


    Código (html5) [Seleccionar]
    <!DOCTYPE html>
    <head>
    <title>Hola Mundo</title>
    </head>
    <body>
    <center>
    <h1>WINTXCODERS.COM</h1>
    </center>
    </body>
    </html>
    Entrar a la web You are not allowed to view links. Register or Login
    "Es más divertido hacerse pirata que unirse a la marina." (Steve Jobs)
    Dudas / Sugerencias: You are not allowed to view links. Register or Login

    @Zanut Sec

    Visitante
  • You are not allowed to view links. Register or Login
    Buenas puedes usar las etiquetas GheSi para una mejor visualización del código, por ejemplo:


    Código (html5) [Seleccionar]
    <!DOCTYPE html>
    <head>
    <title>Hola Mundo</title>
    </head>
    <body>
    <center>
    <h1>WINTXCODERS.COM</h1>
    </center>
    </body>
    </html>


    Si es lo mismo, ¿no?

    PAYASAKX

    Maestro

  • Desconectado
  • You are not allowed to view links. Register or Login
    You are not allowed to view links. Register or Login
    Buenas puedes usar las etiquetas GheSi para una mejor visualización del código, por ejemplo:


    Código (html5) [Seleccionar]
    <!DOCTYPE html>
    <head>
    <title>Hola Mundo</title>
    </head>
    <body>
    <center>
    <h1>WINTXCODERS.COM</h1>
    </center>
    </body>
    </html>


    Si es lo mismo, ¿no?
    No, porque se visualiza mejor el texto y se aprecia mejor el código.  ;D

    @Zanut Sec

    Visitante
  • You are not allowed to view links. Register or Login
    You are not allowed to view links. Register or Login
    You are not allowed to view links. Register or Login
    Buenas puedes usar las etiquetas GheSi para una mejor visualización del código, por ejemplo:


    Código (html5) [Seleccionar]
    <!DOCTYPE html>
    <head>
    <title>Hola Mundo</title>
    </head>
    <body>
    <center>
    <h1>WINTXCODERS.COM</h1>
    </center>
    </body>
    </html>


    Si es lo mismo, ¿no?
    No, porque se visualiza mejor el texto y se aprecia mejor el código.  ;D
    Actualizado  ;)

    Juan

    Premium

  • Desconectado
  • Syntax Error :$

    Falto

    Código (html5) [Seleccionar]

    </html>


    Buen aporte ;), Saludos.

    Wintx Hack

    Visitante

  • Desconectado
  • You are not allowed to view links. Register or Login
    Buenas puedes usar las etiquetas GheSi para una mejor visualización del código, por ejemplo:


    Código (html5) [Seleccionar]
    <!DOCTYPE html>
    <head>
    <title>Hola Mundo</title>
    </head>
    <body>
    <center>
    <h1>WINTXCODERS.COM</h1>
    </center>
    </body>
    </html>



    Oye bro disculpa la ignorancia ... Al decir etiqueta GheSi a que te refieres?

    WIитX

    Administrador

  • Desconectado
  • ¿Ignorancia? Ninguna.

    Las cosas están para preguntar y si uno no entiende una cosa se explica con total claridad!.



    Ves donde pone "Código" si lo desplegas pone XHTML - Javascript ... esas son las etiquetas GeShi que puedes usar según el lenguaje que quieras poner ^^

    Saludos!
    Entrar a la web You are not allowed to view links. Register or Login
    "Es más divertido hacerse pirata que unirse a la marina." (Steve Jobs)
    Dudas / Sugerencias: You are not allowed to view links. Register or Login

    Wintx Hack

    Visitante

  • Desconectado
  • You are not allowed to view links. Register or Login
    ¿Ignorancia? Ninguna.

    Las cosas están para preguntar y si uno no entiende una cosa se explica con total claridad!.



    Ves donde pone "Código" si lo desplegas pone XHTML - Javascript ... esas son las etiquetas GeShi que puedes usar según el lenguaje que quieras poner ^^

    Saludos!

    Ha buenisimo Wintx, gracias por aclararme la duda.

    Salu2