Scribd Logo
Cargar

¡Te damos la bienvenida a Scribd!

  • HTML Parte 1

    Cargado por

    Daniela Artiga
    12 vistas21 páginas

    Derechos de autor

    © © All Rights Reserved

    Formatos disponibles

    PPTX, PDF, TXT o lea en línea desde Scribd

    ¿Le pareció útil este documento?

    ¿Este contenido es inapropiado?

    Denunciar este documento

    Copyright:

    © All Rights Reserved
    Descargue como PPTX, PDF, TXT o lea en línea desde Scribd
    Marcar por contenido inapropiado
    12 vistas21 páginas

    HTML Parte 1

    Cargado por

    Daniela Artiga

    Copyright:

    © All Rights Reserved
    Descargue como PPTX, PDF, TXT o lea en línea desde Scribd
    Marcar por contenido inapropiado
    de 21

    Universidad Tecnológica de El Salvador

    Parte I

    LENGUAJE HTML
    • Estructura de un documento HTML
    • Cuerpo de un Documento
    • Tamaño y Tipo de Letra
    • Texto de Colores
    • Párrafos, Saltos de Línea, Bloque Tabulados
    • Línea Horizontal. Divisiones. Recuadros
    • Texto Pre-formateado
    • Negrita, Itálica, Centrado, otros efectos

    https://www.yadaline.com

    Prof. Carlos Antonio Aguirre carlos99ayala@yahoo.com


    ESTRUCTURA DE UNA PAGINA
    HTML

    <!Tipo de documento>
    <HTML>
    <HEAD>
    <TITLE> Documento de prueba </TITLE>
    </HEAD>
    <!-- Esto es un comentario-->
    <BODY>
    Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto
    Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto
    Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto
    </BODY>
    </HTML>

    Prof. Carlos Antonio Aguirre carlos99ayala@yahoo.com


    <HEAD> Inicio de la cabecera

    </HEAD> Fin de la cabecera

    <BODY> Inicio de Cuerpo

    </BODY> Fin de Cuerpo


    <!Tipo de documento>

    No es obligatorio es decir que la página se verá igual tanto


    si lo escribes como si no. Sólo sirve como identificación del
    tipo de contenido del fichero a los efectos de cumplir las
    especificaciones de estándar recomendadas por el
    consorcio W3C.

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0


    Transitional//EN" "http://w3.org/TR/REC-
    html40/loose.dtd"> Indica que cumple el estándar HTML 4.0

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0


    Frameset//EN" "http://w3.org/TR/REC-html40/frameset.dtd">
    Definición de marcos que cumple el estándar HTML 4.0

    Prof. Carlos Antonio Aguirre carlos99ayala@yahoo.com


    Cabecera (HEAD) de un documento
    HTML

    En la HEAD reside información acerca del documento, y


    generalmente no se ve cuando se navega por él

    <TITLE> Permite establecer una breve descripción que


    identifica la página en la barra de Titulo.
    <HEAD> <TITLE>Head de un documento </TITLE> <META HTTP-
    EQUIV="Refresh" CONTENT="10"> </HEAD>
    <HEAD> <TITLE>Head de un documento </TITLE>
    <META HTTP-EQUIV="Expires" CONTENT="no-
    cache"> </HEAD>
    <HEAD> <TITLE>Head de un documento </TITLE> <META NAME="keywords"
    CONTENT="HTML, internet "> </HEAD>

    Prof. Carlos Antonio Aguirre carlos99ayala@yahoo.com


    Cuerpo (BODY) de un documento

    El cuerpo (BODY) es la segunda y última de las dos partes


    en que se estructura un documento HTML

    <BODY>
    texto texto texto texto texto texto texto texto texto texto texto
    texto texto texto texto texto texto texto texto texto texto texto
    texto texto Color de Vínculos
    </BODY>
    LINK
    VLINK
    Modificación de Márgenes ALINK
    leftmargin="pixels", para el margen izquierdo
      topmargin="pixels", para el margen superior
      rightmargin="pixels", para el margen derecho
      bottommargin="pixels", para el margen inferior

    Prof. Carlos Antonio Aguirre carlos99ayala@yahoo.com


    <BODY BGCOLOR=#FF0000>

    White rgb=#FFFFFF
    Red rgb=#FF0000
    Green rgb=#00FF00
    Código Blue rgb=#0000FF
    Hexadecimal Magenta rgb=#FF00FF
    Cyan rgb=#00FFFF
    Yellow rgb=#FFFF00
    Black rgb=#000000
    Aquamarine rgb=#70DB93
    Baker's Chocolate rgb=#5C3317

    Prof. Carlos Antonio Aguirre carlos99ayala@yahoo.com


    Tamaños y tipos de letra en HTML

    Para definir distintos tamaños de letra, en HTML se utiliza


    el elemento lleno <Hx> </Hx> donde x es un número
    que puede variar entre 1 y 6, siendo 1 el tamaño mayor

    <H1> Texto de prueba (H1)</H1>


    <H2> Texto de prueba (H2)</H2>
    <H3> Texto de prueba (H3)</H3>
    <H4> Texto de prueba (H4)</H4> <H5>
    Texto de prueba (H5)</H5>
    <H6> Texto de prueba (H6)</H6>
    Parámetro de
    Alineación de Texto
    <H3 align=center> Texto en H3 </H3>

    Prof. Carlos Antonio Aguirre carlos99ayala@yahoo.com


    <CENTER> y </CENTER>
    Centra el Texto

    texto texto texto texto texto texto texto texto texto texto texto texto
    <CENTER>texto centrado texto centrado</CENTER>
    texto texto texto texto texto texto texto texto texto texto texto texto

    Otros Efectos

    Texto en negrita: <B>Texto en negrita</B>


    Texto realzado: <STRONG>Texto realzado</STRONG>
    Texto en itálica: <I>Texto en itálica</I>
    Texto con énfasis: <EM>Texto con énfasis</EM>

    Texto subrayado: <U>Texto subrayado</U>


    Texto tachado: <STRIKE>Texto tachado</STRIKE>
    Texto intermitente <BLINK>Texto intermitente</BLINK>
    Ejercicio 5

    Ejercicio 6
    <FONT >

    Es otra forma de cambiar los tamaños de letra

    <font size=3>A</font>
    <font size=4>A</font>
    <font size=5>A</font>
    <font size=6>A</font>
    <font size=7>A</font>
    <font size=6>A</font>
    <font size=5>A</font>
    <font size=4>A</font>
    <font size=3>A</font>
    Prof. Carlos Antonio Aguirre carlos99ayala@yahoo.com
    <FONT >

    Es otra forma de cambiar los <font size=3>A</font>


    tamaños de letra, así como Tipo de <font size=4>A</font>
    Letra, y Color
    <font size=5>A</font>
    <font face="impact" size=6 <font size=6>A</font>
    color="red"> Texto de prueba 12345 <font size=7>A</font>
    con tipo IMPACT</FONT>
    <font size=6>A</font>

    <FONT FACE="raro, courier" <font size=5>A</font>


    SIZE=4 COLOR="red"> Texto <font size=4>A</font>
    de prueba 12345 con tipos
    alternativos</FONT> <font size=3>A</font>

    Prof. Carlos Antonio Aguirre carlos99ayala@yahoo.com


    Cambios de párrafo y de línea. Línea
    horizontal. Divisiones de texto.
    Enmarcado
    Saltos de párrafo <P> </P>
    <P ALIGN=LEFT>
    Texto 1 Texto 1 Texto 1 Texto 1 Texto 1 Texto 1 Texto 1 Texto 1 Texto 1

    <P ALIGN=RIGHT>
    Texto 2 Texto 2 Texto 2 Texto 2 Texto 2 Texto 2 Texto 2 Texto 2 Texto 2

    <P ALIGN=CENTER>
    Texto 3 Texto 3 Texto 3 Texto 3 Texto 3 Texto 3 Texto 3 Texto 3 Texto 3

    <P ALIGN=JUSTIFY>
    Texto 4 tex Texto 4 Texto 4 tex Texto 4 Texto 4 tex Texto 4 Texto 4 Texto
    4

    Prof. Carlos Antonio Aguirre carlos99ayala@yahoo.com


    Ejercicio 7

    Ejercicio 8
    Ejercicio
    <B>
    <FONT COLOR="red">Texto ROJO </FONT> <br>
    <FONT COLOR="blue">Texto AZUL </FONT> <br>
    E <FONT COLOR="navy">Texto AZUL MARINO </FONT> <br>
    s <FONT COLOR="green">Texto VERDE </FONT> <br>
    <FONT COLOR="olive">Texto OLIVA </FONT> <br>
    c <FONT COLOR="yellow">Texto AMARILLO </FONT> <br>
    r <FONT COLOR="lime">Texto LIMA </FONT> <br>
    i <FONT
    <FONT
    COLOR="magenta">Texto MAGENTA </FONT> <br>
    COLOR="purple">Texto PURPURA </FONT> <br>
    b <FONT COLOR="cyan">Texto CYAN </FONT> <br>
    i <FONT COLOR="brown">Texto MARRON </FONT> <br>
    <FONT COLOR="black">Texto NEGRO </FONT> <br>
    r <FONT COLOR="gray">Texto GRIS </FONT> <br>
    <FONT COLOR="teal">Texto TEAL </FONT> <br>
    <FONT COLOR="white">Texto BLANCO </FONT> <br>
    </B>

    Prof. Carlos Antonio Aguirre carlos99ayala@yahoo.com


    <DIV>
    Atributos

    ALIGN=LEFT ALIGN=RIGHT y ALIGN=CENTER

    <DIV ALIGN=“LEFT”> texto1 texto1 texto1 texto1 texto1 texto1 texto1 texto1
    texto1 texto1 texto1 texto1 texto1 texto1 texto1 texto1 texto1 texto1 texto1 texto1
    </DIV>

    <DIV ALIGN=“RIGHT”> texto2 texto2 texto2 texto2 texto2 texto2 texto2 texto2
    texto2 texto2 texto2 texto2 texto2 texto2 texto2 texto2 texto2 texto2 texto2 texto2
    </DIV>

    <DIV ALIGN=“CENTER”> texto3 texto3 texto3 texto3 texto3 texto3 texto3


    texto3 texto3 texto3 texto3 texto3 texto3 texto3 texto3 texto3 texto3 texto3 texto3
    </DIV>

    Prof. Carlos Antonio Aguirre carlos99ayala@yahoo.com


    <BLOCKQUOTE>
    sirve para presentar párrafos adentrados (como
    si estuviesen tabulados)

    <BLOCKQUOTE> texto texto texto texto texto texto texto texto


    texto texto texto texto texto texto texto texto texto texto texto

    <BLOCKQUOTE> texto texto texto texto texto texto texto texto


    texto texto texto texto texto texto texto texto texto texto texto

    </BLOCKQUOTE> </BLOCKQUOTE>

    Prof. Carlos Antonio Aguirre carlos99ayala@yahoo.com


    <HR> (por Horizontal Rule)

    Admite dos parámetros: WIDTH y SIZE

    <HR WIDTH=“400” SIZE=“5”>

    <HR WIDTH=“80%” SIZE=“5” ALIGN=“LEFT”>

    Prof. Carlos Antonio Aguirre carlos99ayala@yahoo.com


    CONTINUARA…

    Prof. Carlos Antonio Aguirre carlos99ayala@yahoo.com

    También podría gustarte