★ <!
DOCTYPE HTML> :Define que este documento es html 5
★ <?xml version="1.0" encoding="UTF-8"?>
★
★ <html> indica que es el elemento raíz + se pone junto a lang <html lang=”es”>
★ <title> especifica el titulo de la página (se muestra en el titulo del navegador)
★ <body> define el cuerpo del documento, todos los elementos dentro de body se muestran
en la página
★ <p> es un párrafo </p>
★ <h1> este es para texto con la cabecera h1, grande h2, h3, h4, h5, h6 el más pequeño</h1>
★ <br> salto de línea
★ <a> para hipervinculo se usa asi→ <a href=”https://…”>nombre visible del vínculo</a>
★ <img> para meter imágenes, se usa→ <imgm src=”ruta de la imagen”>. que puede ser
absoluta (href): con archivos, o relativa(src):src si está al mismo nivel que el html.
★ width y height es ancho y alto en pixeles
★ atributo alt es un texto alternativo en caso que no sirva la imagen
★ style para atribuir, ej→<p style=”color:blue”>bla bla bla</p> seria asi: bla bla bla
★ “background-color:”/-image: ur(“”)/…
★ “border: n°px red”
★ “font-family:”
★ “font-size:n°px”
★ <hr> es una línea horizontal
★ <b> texto negrita
★ <strong> mas importante en negrita
★ <i> cursiva
★ <small> texto pequeño
★ <blockquote> para citar algo de una página →<b blockquote cite=”http bla bla bla”>cita de
la pag</blockquote></p>
★ <abbr> es para abreviaturas
★ padding espacio entre texto y borde
★ margin margen fuera del borde
★ id y class para nombrar párrafos, etc / para atribuirle en css se pone # o .
★ float para que algo flote
★ <table> se le puede añadir la propiedad border:1px solid black + border-collapse/radius
también se puede poner colspan y rowspan
★ <tr> cada fila de la tabla
★ <th>los nombres de la primera línea de cada columna(añadir th en cuantas primeras
líneas necesite, se añaden en negrita)
★ <td>celda, serian los datos de la tabla (añadir td en cuantas lineas necesite)
★ <ul> comienzo de la lista/ <ol> comienza lista con números
★ <li> elemento de la lista
★ <div> contenedor para elementos, style, class e id
obligatorios en el (+</div>)
★ <head> contenedor de metadatos situado en el <html>
antes del body(no se muestra)
★ <header> encabezado para un documento
★ <hav> enlaces de navegación
★ <aside> contenido en la barra lateral, es un margen
★ <footer> pie de página
★ <form> contenedor de formulario que contiene texto, checkbox, botones, etc para enviar
info al php
★
★ atributos de form→
★ action= define la accion que realizará cuando se envie el formulario, ejemplo: “pagina.php”
★ <label> define etiqueta para elementos del formulario, debe ser igual al id del <input> para
enlazarlos
★ <input type: >
★ text=para texto,
★ radio=botón para seleccionar opciones,
★ checkbox=casilla de verificación de una o más opc,
★ submit=botón de envío, button=botón solo
★ password= campo para contraseña no visible lo que se escribe
★ reset= botón para resetear todo
★ date= agregar fecha dia/mes/año
★ e-mail= te requiere un @ y un .com
★ month= para meter un mes
★ number= para meter un número
★ time= para meter una hora
★ button= botón que se le puede añadir oneclick para mostrar un mensaje que se le debe
poner un value ej: <input type=”button” oneclick=”alert(‘lo que vayas a anunciar’)” value=”el
value que se quiera”
★
★ atributos de input→
★ value para darle “valor” a un botón o sea el nombre que va a mostrar
★ readonly crea un campo que es solo de lectura
★ disabled campo de entrada deshabilitado
★ size es el ancho visible del cuadro de entrada de texto
★ pattern para limitar un numero de caracteres
★ title para informar de que se debe poner en el bloque de texto
★ required para hacer el input sea obligatorio
★ autofocus para que apenas abra la web sea lo primero que se enfoque el mouse
★ ejemplo: <label for=”usuario”>Usuario:</label><br>
★ <input type=”text” id=”usuario” name=”usuario”><br>
★ <select> lista desplegable
★
★
★
★
★
★
★
★
★ <textarea> campo de texto (raro)
★ <fieldset> agrupar datos relacionados en un formulario con un recuadro
★ <legend> define un “título” en los elementos del fieldset que se muestra entre ese cuadro
★
★
★
★
★
★
★
★
★ <datalist> una lista desplegable de opciones predefinidas para un input
