Scribd Logo
Carica

Benvenuto in Scribd!

  • Guia, HTML

    Caricato da

    Alejandro Carvajal García
    33 visualizzazioni6 pagine
    fjghdfjd

    Titolo originale

    GUIA, HTML

    Copyright

    © © All Rights Reserved

    Formati disponibili

    DOC, PDF, TXT o leggi online da Scribd

    Hai trovato utile questo documento?

    Questo contenuto è inappropriato?

    Segnala questo documento
    fjghdfjd

    Copyright:

    © All Rights Reserved
    Scarica in formato DOC, PDF, TXT o leggi online su Scribd
    Segnala contenuti inappropriati
    33 visualizzazioni6 pagine

    Guia, HTML

    Caricato da

    Alejandro Carvajal García
    fjghdfjd

    Copyright:

    © All Rights Reserved
    Scarica in formato DOC, PDF, TXT o leggi online su Scribd
    Segnala contenuti inappropriati
    di 6

    INSTITUCION EDUCATIVA SAN LORENZO DE ABURRA

    TECNICA EN SISTEMAS
    PROFESORAS BELTSY JANETH VELEZ MURCIA
    PRACRICA PARA EL GRADO ONCE
    MEDELLÍN 2018

    GUIA, EDITORES DE TEXTO, BLOC DE NOTAS,


    PROGRAMACION EN HTML

    Objetivos:
     Conocer de manera básica, qué es lenguaje de programación aplicado a la creación de
    páginas para la WWW.
     Crear y dar estructura a documentos en lenguaje HTML.
     Dar formato a páginas web por medio de opciones avanzadas para mejorar la
    apariencia del documento.

    Valoracion: 10% del periodo.

    Metodologia de Solucion: para ser resuelto en clase e individual, puede hacer uso del
    internert, el tiempo estimada para resolver los ejercicios es acorde antes de dar inicio a
    este, y sera retroalimentacion para las proximas clases.

    Metodo de presentacion: la solucion de la guia debe ser salvada en el blog tecnico.

    INTRODUCCION AL HTML

    El HTML ( HiperText Markup Language ) es el lenguaje utilizado para representar


    documentos en la WWW (World Wide Web). Además de texto normal incluye también,
    elementos multimedia (gráficos, vídeo, audio) y existen enlaces (links) que permiten saltar
    a otras partes del documento o a otro sitio cualquiera de Internet.
    Otra característica muy importante de este lenguaje es que es portable, es decir, se
    pueden visualizar las páginas con cualquier sistema operativo y, por supuesto también
    crearlas

    Las etiquetas constituyen la filosofía de este lenguaje. Por medio de ellas se pueden
    controlar los elementos tipográficos del texto: tipo, color y tamaño de las fuentes, el estilo
    ( negrita, cursiva, etc ), así como también la inclusión de tablas, listas, formularios, la
    inserción de fotos, sonidos, fondos, los enlaces mencionados anteriormente. etc.
    Las etiquetas se pueden modificar por medio de sus atributos, éstos son del tipo
    atributo="valor" y se colocan detrás del nombre de la etiqueta
    El nombre de la etiqueta y sus atributos se colocan entre los símbolos < y > y normalmente
    se usan dos, una de inicio y otra final, para conseguir el efecto deseado.

    Por ejemplo si escribimos


    <FONT COLOR="#ff0000" size="2">El texto se verá rojo y en tamaño un poco menor de
    lo normal </font>

    Se verá como El texto se verá rojo y en tamaño un poco menor de lo normal

    El uso de estas etiquetas, y por ende el aprendizaje del HTML, no es difícil. Precisamente el
    objetivo de esta pequeña guía es servir de introducción y referencia de las características
    más usadas del HTML.

    ESTRUCTURA BÁSICA DE UN DOCUMENTO HTML

    Todos los documentos Html tienen la estructura que se muesta a continuación, aunque la
    etiqueta <body> puede ser sustituida por <frameset> para un tipo de páginas que dividen
    la ventana del navegador en varios cuadros (frames).

    <HTML>
    <HEAD>
    <TITLE>Título de la página</TITLE>
    </HEAD>
    <BODY>
    Aquí iría el contenido de la página
    </BODY>
    </HTML>

    Vamos a analizar más detenidamente las distintas secciones que componen la página

    CONSULTA N°1
     QUE SON LAS ETIQUETAS
     CUAL ES LA FUNCION QUE REALIZA CADA UNA DE LAS ETIQUETAS DE LA ESTRUCTURA
    ANTERIOR. (<HTML><HEAD><TITLE><BODY>)
    El cuerpo está delimitado por las etiquetas <body> y </body> La etiqueta <body> suele
    contener algunos atributos, a saber:

    <BODY BGCOLOR=#0000FF> o <BODY BGCOLOR=blue>


    <BODY BACKGROUND="ruta/archivo.gif">

    CONSULTA N°2
    CUAL ES LA FUNCION QUE REALIZA CADA UNA DE LOS ATRIBUTOS DE LA ESTRUCTURA
    ANTERIOR DE BODY.

    TALLER N°1: MI PRIMERA PAGINA WEB

    1. Cree una carpeta en el escritorio y asígnele como nombre “mi primera pagina web”

    2. Se debe abrir un editor de Texto que puede ser Bloc de Notas o Notepad++ en este
    caso Siga los siguientes pasos para abrir Bloc de Notas:
     De clic en el botón inicio
     De clic en todos los programas
     De clic en accesorios De clic en bloc de notas

    3. Abierto el bloc de notas escriba lo siguiente tal y como aparece aquí:


    <html>
    <head>
    <title> Mi primera página
    </title> </head>
    <body> Aquí van a colocar el texto del documento, o gráficos, enlaces, etc.
    </body>
    </html>
    Crea una carpeta llamada WEB HTML y luego en esta crea una subcarpeta como
    PRACTICA N°1, a dentro de esta subcarpeta guarde dos documentos llamados asi: con el
    nombre practica1.txt y nuevamente lo guarda como practica1.html.

    4. Nuevamente Habra otro archive en Bloc de notas y realiza: haga los cambios
    necesarios del punto 3 para que el código quede de la siguiente manera:
    <html>
    <head>
    <title> Mi primera página
    </title> </head>
    <body>
    <h1>Mucha importancia</h1>
    <h2>Menos importancia</h2>
    <h3>Mucha menos importancia</h3>
    </body>
    </html>
    En la carpeta llamada WEB HTML y realice otra subcarpeta como PRACTICA N°2, y dentro
    de esta subcarpeta guarde dos documentos llamados asi: con el nombre practica2.txt y
    nuevamente lo guarda como practica2.html

     Investiga para que se utilizan las etiquetas h1. h2. h3, etc

    5. Haga los cambios necesarios para que el código quede de la siguiente manera:

    <html>
    <head>
    <title color=“Yellow” > Mi primera página
    </title> </head>
    <body> <font color=“blue” size=“4” face=“Comic Sans MS, Arial, MS
    SansSerif”> Bienvenidos a mi primera página </font>
    </body>
    </html>
    En la carpeta llamada WEB HTML y realice otra subcarpeta como PRACTICA N°3, y dentro
    de esta subcarpeta guarde dos documentos llamados asi: con el nombre practica3.txt y
    nuevamente lo guarda como practica3.html
    Investiga para que se utilizan las etiquetas nuevas que encuentres en la practica 3 y cual
    etiqueta se utiliza para escribir el texto en negrilla.

    6. Defina la function de las siguientes etiquetas: la etiqueta de tablas, filas, columnas,


    imagen, sonido, boton, vincula, texto centrado, texto a la izquierda, ala derecho y
    justificado.

    PRIMERA PRACTICA GENERAL


    Realice una página Web básica del tema que usted desee, en esta página debe de ir todas
    las etiquetas que han consultado hasta el momento.
    Solucion
    Consulta N°1

    Etiquetas
    Es una marca con clase que delimita una región en los lenguajes basados en XML. También
    puede referirse a un conjunto de juegos informáticos interactivos que se añade a un elemento
    de los datos para identificarlo (Oxford English Dictionary).. Esto ocurre, por ejemplo, en los
    archivos MP3 que guardan información sobre una canción así como sobre el artista que la ha
    cantado o compuesto.

    - <Html>: Esta Etiqueta Reprecenta La Raiz Del Documento, Los Demas Elementos
    Deben Ser Decendientes De Este Elemento
    - <Head>: Este Representa El Encabezado O La Primera Precentacion De La Pagina
    - <Title>: Tiene La Function De “Definir” El Titulo De La Web El Cual Se Muestra En La
    Barra De Titulo Del Navegador
    - <Body>: “Representa El Contenido Principal De Un Documento Html”

    Consulta N°2
    La function de <BODY BGCOLOR=#0000FF> o <BODY BGCOLOR=blue> Es la de darle a la
    etiqueta <Body> el color azul.

    La function de <BODY BACKGROUND="ruta/archivo.gif"> es que el archivo “archive.gif” Se


    muestre como fondo de la pagina web

    Taller

    Tablas:
    <table>Esta tiene la fundacion de comenzar una table

    Filas:
    <Tr>Esta representa una fila de celdas en una table

    Columna:
    <col>Representa una table

    Imagen:
    <img> Representa una imagen

    Sonido:
    <Audio> Representa audio

    Boton:
    <button> representa un boton

    Texto centrado:
    <<center> sirve para centrar un texto

    Texto a la Izquierda:
    <p align=”LEFT”>sirve para poner texto a la izquierda

    Texto a la derecha: <P ALIGN=”RIGHT”= sirve para poner el texto a la derecha

    Potrebbero piacerti anche