Crea tu primera página web - Aprende a utilizar las etiquetas HTML y a crear estilos con CSS

6

  • 38
  • 0
  • 11.856
  • Reply

    • Open in the desktop app ADD TO PLAYLIST
      Report
    Buzz

    luis96xd

    Published on Oct 28, 2021
    About :

    ¡Hola a todos! Bienvenidos. En el video anterior vimos los conceptos básicos sobre el Desarrollo Web, los bloques básicos (HTML, CSS, JavaScript) ¡Pero toda su teoría necesita su parte práctica!

    Así que en este video crearemos nuestra primera página web, para ello crearemos un documento HTML (Hyper Text Markup Language) y a través de sus etiquetas iremos estructurando el contenido que aparecerá en nuestra página.

    Podemos encontrar títulos o encabezados, párrafos, imágenes, listas ordenadas, listas no ordenadas, contenedores, etc.

    En HTML, la mayoría de las etiquetas funcionan en pares, con una etiqueta de apertura y una etiqueta de cierre, señalada con los signos de menor qué y mayor qué (<>)
    Ejemplo:

    El contenido va aquí

    Etiquetas:

    • : Es la etiqueta principal de todo documento HTML.
    • : Es la cabecera de la página, incluye metadatos importantes para la misma, pero que no son visibles al expectador.
    • ** **:Representa el cuerpo del documento, aquí colocarás todas las etiquetas que representan elementos visibles para tu página.
    • : Representa un contenedor.

    • :       Representa un párrafo.
        • : Crea una lista ordenada. (Enumeradas).
            1. : Crea una lista no ordenada (Solo viñetas)
            • : Crea un elemento de la lista. (Se tiene que colocar dentro de la etiqueta
                o
                  .

                • : Representa un título

                • : Representa un subtítulo
                  ...
                • : Representa el subtítulo más pequeño que puedes lograr.

                También aprenderemos a darle estilos a cada elemento utilizando CSS (Cascading Style Sheets). En la cual utilizamos selectores que indican a que elemento queremos darle estilos diferentes, por ejemplo.

                • **text-align: alineación del texto (valores: **left, right, center, justify)
                • padding: espaciado interno o margen interior. (entre el elemento y su contenido). (valores: númericos + unidad de medida (pixeles (px), porcentajes (%), centímetros (cm).
                • margin: espaciado externo o márgen exterior. (entre elemento y elemento). (valores: númericos + unidad de medida (pixeles (px), porcentajes (%), centímetros (cm).
                • background-color: color fondo del elemento. (valores: colores en hexadecimal #F303F7, colores en formato RGB, rgb(10, 114, 245), nombre del color en inglés):
                • color: color de la fuente o de la letra. (valores: colores en hexadecimal #F303F7, colores en formato RGB, rgb(10, 114, 245), nombre del color en inglés):

                Espero que les guste este video
                ¡Saludos y espero verlos pronto! :D
          Tags :

          developspanish web developer spanish programming web development html css javascript tutorial margin padding css properties markup language markup html tags etiquetas visual studio code

          Woo! This creator can upvote comments using 3speak's stake today because they are a top performing creator! Leave a quality comment relating to their content and you could receive an upvote worth at least a dollar.

          Their limit for today is $0!
          Comments:
          Time until luis96xd can give away $0 to their commenters.
          0 Days 0 Hours 0 Minutes 0 Seconds
          Reply:

          To comment on this video please connect a HIVE account to your profile: Connect HIVE Account

          More from luis96xd
          16:16
          Descripción del Proyecto - REST Countries API - Crea tu propia React App - Parte 0
          luis96xd
          25 views 2 years ago $
          37:05
          Métodos de Factorización - Ejercicios y Ejemplos
          luis96xd
          1 views 2 years ago $
          01:01:50
          HTML and CSS Tutorial: Order Summary Card - Frontend Mentor Challenge
          luis96xd
          14 views 2 years ago $
          15:02
          Propiedades de la potenciación - Clases de matemáticas - Episodio 2
          luis96xd
          6 views 2 years ago $
          37:01
          Componentes de la página - REST Countries API - Crea tu propia React App - Parte 1
          luis96xd
          13 views 2 years ago $

          More Videos

          05:46
          Tutorial #1: Como convertir cualquier imagen en un pincel dentro de Photoshop
          enterlacrea
          10 views 2 years ago $
          13:56
          Bun.js - A Killer Runtime Environment - Node.js GameOver ?
          revivecoding
          5 views 7 months ago $
          11:13
          Acepta y avanza. || Accept and move forward. [ESP | ENG]
          daliacoach
          11 views 9 months ago $
          07:58
          Gota 418 : Ahora en la Cultura de la Enfermedad, donde inventan virus, enfermedades y tratamientos.
          fernandoylet
          171 views a year ago $
          35:22
          Trine 4 atravesando el prologo con mi pareja, (juego multijugador local)
          pablodare
          17 views a year ago $
          07:06
          El Reflejo De Tus Actos - Cuento Para Reflexionar
          acadainstante
          3 views 3 years ago $
          02:05
          Algo de mi entrenamiento | Some of my training [ESP🇪🇦 | ENG🇺🇲]
          manuelcancine
          5 views a year ago $
          17:12
          DAPPLR versión beta para HIVEMOVIL + AIRDROP
          mariana4ve
          29 views 3 years ago $
          14:03
          Fallen allies and dark times, assassins creed iv💀🏴‍☠️🩸💥🧨🔥/GamingBear Playing from the cave🐻👾
          sadbear
          0 views a year ago $
          09:39
          II Serie de Liang Gong Shi Ba Fa (Ejercicios Terapéuticos para la salud, la vitalidad y la longevida
          caballodefuego
          109 views a year ago $
          02:31
          Praise and worship music semana # 1 - Si Tu Presencia Conmigo No Va
          kerfa
          9 views 6 months ago $
          06:58
          DIY-Girasoles eternos [ESP-ENG]
          kellyrsa
          57 views a year ago $
          03:17
          [Esp-Eng] Rutina de espalda y bíceps| Entrenamiento intenso/Back and biceps routine
          angelrosales
          3 views a week ago $
          02:30
          Me puedes pedir lo que sea 🎶 COVER
          jossavendano
          5 views 2 years ago $
          09:53
          HIVE y Twitter [ESP/ENG] || HIVESESSIONS
          fermionico
          43 views a year ago $
          02:04
          Hive Music Festival, Week 72, Round 3 / "Jardín de rosas" Grupo Rojo/ cover by @thonyt05
          thonyt05
          6 views a month ago $
          05:03
          ACCIDENT AND RECOVERY STORY
          nanie.lilla
          13 views 2 years ago $
          08:40
          Torneo Fútbol Kids | Academia Fariñas resbaló en el inicio del torneo frente a Terrazas del Norte -
          anthony2019
          7 views a year ago $
          03:39
          Hive Open Mic 112( Tradición local) 🎶🌟Cover🌟🎶@adrianalara🎶🌟 Cerca de ti Annette Moreno de
          adrianalara
          21 views a year ago $
          15:16
          Death Incoming: toma el rol de la muerte en juego muy original (ES/EN)
          ismaelgranados
          4 views 9 months ago $
          07:08
          Dapplr: la nuovissima App Mobile di HIVE
          dexpartacus
          7 views 3 years ago $
          00:32
          Testing 360 kickflip with my new board.🛹 👊 [Esp/Ing]
          samuelvelizsk8
          1 views 5 months ago $
          02:46
          hive open mic week #80 💕🎶 cada dia empezar de nuevo🎶💕 (cover) @ruthlopez🎶
          ruthlopez
          3 views 2 years ago $
          01:10
          [ESP/ENG] Dibujando unos Labios Carnosos / Drawing Fleshy Lips
          andresrk
          11 views 3 years ago $