EntradaEjemplos de etiquetas en html. Etiquetas y atributos HTML
Los atributos se especifican en la etiqueta de inicio de un elemento y constan de nombre y sentido que están separados entre sí por un signo igual (=). Por ejemplo, en el atributo href = "http: //www.site/" href es un nombre y http: //www.site/ valor.
Las etiquetas HTML pueden contener uno o más atributos. Los atributos se agregan a la etiqueta para informar al navegador sobre cómo se debe mostrar la etiqueta dada en el documento html.
Título Atributo
Considere el siguiente ejemplo:
Este ejemplo usa la etiqueta que pretende representar una abreviatura o un acrónimo. Se ha agregado un atributo adicional a la etiqueta de inicio del elemento. Este atributo contiene el título del elemento.
Nombre del Atributo título... En este ejemplo, le dimos el valor Lenguaje de marcado de hipertexto.
El atributo de título se puede utilizar opcionalmente en cualquier elemento HTML para proporcionar información adicional sobre el contenido del elemento.
Cuando se usa el atributo de título, la mayoría de los navegadores mostrarán su valor como una "información sobre herramientas" cuando el usuario pase el cursor sobre el elemento.
Atributo alt
Ya sabes que las imágenes se insertan en páginas web usando una sola etiqueta. ... El atributo alt se agrega dentro de la tera
y define un texto alternativo para el agregado a la página web del elemento rpaic. Este texto se llama alternativo porque se puede mostrar en la pantalla como una alternativa a la imagen en sí.
En el siguiente ejemplo, verá cómo funciona el navegador con el atributo alt cuando aparece una imagen "faltante". Si no se puede encontrar la imagen o por alguna razón no se carga, se muestra el valor del atributo alt. Cambie el nombre del archivo de imagen de orange.jpg a pencil.jpg. De hecho, no existe tal archivo, por lo que obtiene una imagen "perdida".
Atributo Href
Puede agregar varios atributos a un elemento a la vez.
A continuación, se muestra un ejemplo de cómo agregar dos atributos a un elemento. (que se utiliza para crear un hipervínculo a otra página web).
HTML de ejemplo:
Pruébelo usted mismo Tutoriales HTMLEl atributo href especifica la ubicación de la página web a la que conduce el enlace.
También usamos el atributo title para proporcionar al usuario algún tipo de consejo sobre herramientas.
Puede especificar atributos solo dentro de las etiquetas de apertura y, si hay varios atributos, se coloca un espacio entre ellos. Al mismo tiempo, es imposible establecer dos atributos idénticos en una etiqueta, incluso si tienen valores diferentes, es decir, está prohibido duplicarlos. Los atributos, como las etiquetas, no distinguen entre mayúsculas y minúsculas, es decir, pueden escribirse en mayúsculas y minúsculas. Los valores de los atributos pueden incluirse entre comillas dobles opcionales ("") o comillas simples ("").
A veces es necesario utilizar comillas. En este ejemplo, el atributo de título no se mostrará correctamente porque el valor del atributo contiene espacios:
¿Comillas simples o dobles?
El más utilizado en HTML es " doble comillas", pero también puede usar" single ". A veces, debe usar comillas simples si hay una parte en el valor que debe citarse por separado:
HTML
Puede viceversa:
HTML
Atributos generales
A continuación se muestra una lista de algunos de los atributos que son estándar para la mayoría de los elementos html:
| Atributo | Sentido | Descripción |
|---|---|---|
| alinear | derecha, izquierda, centro | Alineación horizontal de etiquetas |
| valignar | arriba, medio, abajo | Alineación vertical de etiquetas dentro de un elemento HTML. |
| antecedentes | URL | Ubicación de la imagen de fondo |
| identificación | Nombre único | Un nombre único para usar con hojas de estilo en cascada. |
| clase | regla de clase o estilo de clase | Clasifica un elemento para su uso con hojas de estilo en cascada. |
| ancho | Valor numérico | Determina el ancho de tablas, imágenes o celdas de tabla. |
| altura | Valor numérico | Determina la altura de tablas, imágenes o celdas de tabla. |
| título | Texto de información sobre herramientas | El texto que se muestra en la información sobre herramientas. |
Para obtener una lista completa de todos los atributos de cada elemento HTML, consulte nuestra referencia: Atributos HTML.
Tareas
La primera tarea final
Te familiarizaste con las etiquetas necesarias para crear una página HTML simple, así como con los atributos y sus valores, que son muy importantes para la correcta visualización del documento, optimización y promoción en los buscadores.
Es hora de repetir lo aprendido y completar tareas simples:
Descripción emergente
- Decide por ti mismo "
Cree una información sobre herramientas con el texto "Buen sitio" que aparece cuando pasa el mouse sobre un párrafo, como se muestra en la Fig. 1.
Título = "(! LANG: Buen sitio">сайт - сайт для разработчиков.!}
Dimensiones de la imagen
- Decide por ti mismo "
Cambie el tamaño de la imagen a 200 píxeles de ancho por 150 píxeles de alto.
Una persona no puede vivir solo con palabras.
en cualquier cantidad que los ingiera.
Adlai Stevenson.
En realidad, HTML no es un lenguaje de programación. Es un lenguaje de marcado de hipertexto. Es decir, no es correcto llamarlo "lenguaje HTML".
En pocas palabras, HTML es lista de etiquetas(palabras de control) que le permiten representar texto sin formato en forma formateada. Por ejemplo, resáltalo negrita, o En itálica y así sucesivamente. Pero el texto se puede presentar de esta manera solo en programas especiales ah - (programas con los que navega por Internet).
Solo muestran texto formateado y se ocultan Etiquetas HTML que se utilizaron para formatear. Para que le quede más claro de lo que estoy hablando, haga clic con el botón derecho en esta página y seleccione el elemento " Fuente" o algo similar. Esta página se abrirá frente a usted en su forma actual.
Puede crear código HTML tanto en programas convencionales como utilizar programas especiales, los llamados. Los editores visuales se diferencian de los editores de texto en que están adaptados a un conjunto de código HTML, CSS, JavaScript, PHP, etc., es decir, para la programación web. Además, le permiten ver inmediatamente los frutos de su trabajo en el navegador integrado y resaltar algunos errores en el código escrito.
Recomiendo encarecidamente escribir todo el código a mano (para mejorar la rectitud de estas mismas manos), los editores visuales facilitan mucho este proceso. Personalmente, uso. Esto está lejos de ser el más ultima versión, pero sus capacidades me bastan en abundancia.
Hago esto: escribo el código en Dreamweaver, luego lo guardo y hago clic en el botón Ver en el navegador (usted mismo edita la lista de navegadores en este menú), luego regreso a Dreamweaver y continúo con la edición. Aquí . Esto es cuando se trata de herramientas, ahora vayamos directamente a las etiquetas HTML.
Comencemos con la estructura de la página html, o mejor dicho, con sus etiquetas principales.
Etiquetas de página HTML requeridas
Las etiquetas HTML necesarias (principales) que se utilizan en cada documento html incluyen lo siguiente:
Nota. Para que el navegador muestre el código HTML como texto (no lo interprete en código), después de cada corchete de ángulo de apertura " »Dejo un espacio en blanco. Tú, cuando marcas el código, espacios NO TE VAYAS.
Como ves, todas las etiquetas están emparejadas(hay una etiqueta de apertura y una etiqueta de cierre), en HTML casi todas las etiquetas son así. La etiqueta de apertura se diferencia de la etiqueta de cierre en que la etiqueta de cierre está precedida por una barra " / ". Estas etiquetas también se denominan envase, porque se pueden insertar otras etiquetas entre ellos, p. ej. poner en un recipiente. Usted mismo puede ver que entre las etiquetas y hay otras etiquetas.
Los nombres de las etiquetas se pueden escribir tanto en mayúsculas como en minúsculas, no hay diferencia. Es decir, los registros del formulario y para el navegador no tienen diferencias y se interpretan de la misma forma. Ahora hablemos con más detalle sobre lo que significan estas etiquetas.
Entonces, las etiquetas principales muestran a los navegadores y otros programas para ver páginas de hipertexto que están tratando con un documento de hipertexto. Cualquier documento html debe comenzar con y terminar con. Es decir, entre estas etiquetas hay TODOS código de página html.
Entre las etiquetas y hay metaetiquetas (título de la página, descripción, palabras clave etc.). Almacenan información sobre la página html y detalles técnicos... En general, esta etiqueta es opcional, es decir, sin ella, los navegadores mostrarán normalmente el documento html. Pero incluso si no planea usar el área de título, entonces manténgalo simple. Esto es por compatibilidad entre diferentes versiones programas.
El navegador no muestra toda la información entre las etiquetas "HEAD" de ninguna manera (excepto la información entre las etiquetas, donde se encuentra el nombre del documento html, que se muestra en el panel superior del navegador). Pero pueden tener un gran impacto en la apariencia de una página html, su vida en línea y su clasificación. Hablaremos más sobre las etiquetas que se encuentran en el encabezado de un documento de hipertexto más adelante.
El contenido principal del documento html se encuentra entre las etiquetas y. Todo lo que vemos cuando abrimos una página html se encuentra aquí: texto, gráficos, menús, botones, etc. Este es el "cuerpo" principal de la página.
Todas las demás etiquetas utilizadas al crear un documento html se encuentran entre (es decir, dentro) estas etiquetas requeridas. Casi todas las etiquetas en HTML tienen varios atributos, propiedades y parámetros que le permiten mostrar información exactamente como lo pretendía el desarrollador. Por ejemplo, si escribe:
Entonces el fondo de toda la página será rojo.
Aquí etiqueta- esto es, de hecho, una etiqueta; bgcolor- su atributo; "# FF0000"- valor de atributo (una etiqueta puede tener varios atributos).
Nota. Todos los atributos de etiqueta y sus valores se especifican en apertura etiqueta (la que sin barra), pero de ninguna manera el cierre.
Y así, descubrimos las etiquetas principales del documento html. Ahora es el momento de echar un vistazo más de cerca al resto. Aquí quiero hacer una pequeña digresión.
Cómo sugiero aprender HTML
Aplicando en la práctica los conocimientos adquiridos, me di cuenta del error que cometían la mayoría de los autores de estos libros y tutoriales. Todos estos tutoriales están, en primer lugar, destinados principiantes en segundo lugar, estudiar Conceptos básicos de HTML va a ellos en orden.
T. Es decir, las etiquetas de encabezado del documento html (y luego las etiquetas del cuerpo () se consideran primero.
Basado en mi propia experiencia, me atrevo a decir que este orden de aprendizaje de los conceptos básicos de HTML para un principiante es categóricamente inaceptable. Un principiante intenta estudiar todas estas etiquetas de título numerosas y oscuras, en primer lugar, sin ver los resultados de su entrenamiento (recuerde, las etiquetas de título no se muestran en el navegador). Y en segundo lugar, sin siquiera sospechar que la mayoría de estas etiquetas no serán necesarias para crear el sitio que ha concebido (al menos al comienzo del trabajo).
Por lo tanto, solo está perdiendo el tiempo y el deseo de continuar. aprendiendo HTML... Al mismo tiempo, afirma en la opinión de que solo los “gurús” pueden hacerlo por un buen dinero. Yo también dejaría esta ocupación, si no me importara un carajo lo que todavía no entiendo y no fuera más allá.
Por lo tanto, le sugiero que primero considere las etiquetas relacionadas con el "cuerpo" del documento html (), y luego continúe con el resto. Además, el "cuerpo" de la página html contiene información a la que acudirán los visitantes del sitio. Y crear o encontrar uno es mucho más difícil que escribir código.
Bueno, ahora, sin dudarlo ni un minuto, presione el botón "Siguiente" y continúe aprendiendo cómo estos tipos sin afeitar y con sueño crean sitios web.
Hola queridos lectores del sitio del blog. De hecho, este término tiene varios significados que realmente no encajan entre sí. Intentaré contarte sobre cada uno de ellos en este artículo.
Aprenderás, que son las etiquetas html y en qué se diferencian de las metaetiquetas, además de aprender a usar las etiquetas como etiquetas en los sitios (su variedad es -) y, finalmente, en términos generales, considerar el musical etiquetas en archivos de audio... Así de multifacético resulta ser el término.
Pero en todos los casos la palabra "etiquetas" significa marcado o páginas web con Código HTML, ya sea todo el sitio con etiquetas o su colección de música especificando un álbum y una canción.
¿Qué son las etiquetas en el sitio (etiquetas para crear navegación)?
Empecemos de forma sencilla. Probablemente todos ustedes han visto que debajo de algunos artículos en sitios hay un campo con las etiquetas de nombre o etiquetas, donde se enumeran algunas palabras. ¿Por qué se hace esto? En general, para facilitar la navegación en este sitio ().
La llamada palabras clave, cuyo conjunto caracteriza brevemente la publicación (por ejemplo, para pagina de inicio El siguiente conjunto de etiquetas sería adecuado para mi blog: creación de sitios web; promoción; promoción de sitios web; ganancias).
Con la ayuda de estas palabras, será posible definir sin ambigüedades de qué trata este artículo. Pero su principal valor no está en esto, sino en el hecho de que un visitante puede hacer clic en cualquier etiqueta y ver una lista de todos los artículos del sitio en el que se encontró. De hecho, es una poderosa herramienta para clasificar información.
Para no buscar las etiquetas necesarias debajo de los artículos, los propietarios de sitios web a menudo crean los llamados Nube de etiquetas, que se puede colocar en la columna izquierda o derecha del sitio o en su pie de página (parte inferior). En la práctica, esta desgracia puede verse así:
Por lo general, enumera las etiquetas más populares y puede ver todas las etiquetas haciendo clic en el enlace correspondiente. A veces, las etiquetas de uso más común (se encuentran en más artículos en este sitio) se muestran en una fuente más grande y los menos frecuentes en una fuente más pequeña.
A veces, para mostrarlos, cree página separada como se muestra en la captura de pantalla anterior.
Por que asi forma de marcar con etiquetas no se utiliza en todos los sitios web si es conveniente para los usuarios? Tampoco están en mi blog, para lo que hay una serie de explicaciones. Aunque su uso se proporciona de forma predeterminada, también hay toneladas de complementos para trabajar con etiquetas.
Sí, las etiquetas funcionan muy bien cuando tienes pocos artículos y recuerdas bien todas las etiquetas que ya has creado y usado en otros artículos. Pero con un aumento en la cantidad de materiales, la cantidad de etiquetas aumenta drásticamente, comienzan a duplicarse parcialmente cuando se usan palabras clave que tienen un significado cercano.
Se hace un lío enorme, cuyo valor en términos de mejorar la navegación, en mi opinión, es bastante dudoso. Para este propósito, en un proyecto web grande, es mejor utilizar la búsqueda de sitios. Aunque las etiquetas funcionan bien en redes sociales donde puede usar etiquetas para combinar información diferentes usuarios y míralo en un solo lugar. ...
¿Qué son las etiquetas HTML?
Por primera vez decidí estudiarlos hace quince años, pero luego no progresé más allá de la etiqueta Título. Luego puse mis manos en el curso de video gratuito de Evgeny Popov en Html y salió bien. Por supuesto, ese curso fue solo la etapa inicial, pero los principiantes a menudo carecen de una presentación tan simple.
En estas lecciones, se consideran etiquetas básicas, con la ayuda de las cuales puede crear fácilmente tablas, insertar imágenes e hipervínculos en el texto, agregar varias formas al sitio y mucho más. Total 33 videos gratis en tema Html .
Pero el curso de video es un curso de video, y debería interesarte para que lo descargues y lo veas. No queda claro a partir de frases comunes qué etiquetas están en el lenguaje Html y por qué debería estudiarlas. Oh, esto es algo grandioso y simple que le permitirá convertirse en el maestro de su propio sitio. ¿Por qué necesita un sitio web?
Bueno, probablemente, en primer lugar para la autoexpresión y la aplicación de esfuerzos, y en segundo lugar -. Solo más silencioso, de lo contrario, todos oirán y correrán a estudiar qué son las etiquetas, crear sitios web y ganar todo lo que solo tú podrías ganar, bueno, estoy a favor de la empresa. Por lo tanto, seguiré hablando exclusivamente en un susurro.
Internet se puede comparar con la televisión, donde usted crea su propio programa pequeño (crea un sitio web usando etiquetas) y obtiene ingresos de la publicidad. Cuanto más popular sea su programa (proyecto de Internet), más ganará. No hay límite superior, aunque tampoco hay límite inferior. Pero no necesita invertir dinero, solo su trabajo y el tiempo dedicado al estudio de las etiquetas, al funcionamiento del motor y, de hecho, a llenar el sitio con contenido.
Entonces, las etiquetas son los elementos más simples del marcado de una página web para que el navegador, al cargarla desde el servidor, entienda cómo mostrar un elemento en particular (texto, imagen, video). Anteriormente, el lenguaje Html era el único responsable de todo, pero luego acudieron a él con ayuda y se volvió mucho más fácil para él. Popov también tiene un curso de video gratuito sobre ellos, que puede descargar desde aquí .
Chicos, cuando dominen las etiquetas Html, comprenderán que fue tan fácil como pelar peras. Lo más importante es empezar y estimularte de alguna manera. Les hablo del aspecto financiero por una razón. El sitio puede convertirse en su principal fuente de ingresos y toda la familia puede alimentarse de él. Necesitas suerte, perseverancia y no tener miedo de conocer cosas nuevas.
Las etiquetas son diferentes, pero no hay muchos de ellos (de los que siguieron siendo relevantes después de la introducción de CSS). Mira qué simple es. Suponga que desea crear un párrafo; simplemente rodee el texto del párrafo futuro con etiquetas P de apertura y cierre (esta es una letra latina y es mejor escribirla pequeña en el código, pero aquí la escribí en mayúscula para mayor claridad). Así es como se verá:
Texto texto ... texto texto
¿Entiende cuál es la diferencia entre la etiqueta Html de apertura (al principio) y la de cierre (al final)? Bueno, por supuesto, acabo de agregar una barra diagonal después del corchete triangular.
Oh, me olvidé de decir cómo el navegador separa las etiquetas(marcado) del contenido principal. ¿Lo adivinaste tú mismo?
Eso es correcto, es corchetes triangulares en el que los adjuntamos. El navegador vio un paréntesis de este tipo al analizar el código de la página web y se dio cuenta de que era una etiqueta y procesa todo lo que contiene de acuerdo con un cierto algoritmo (hace que los párrafos estén separados en altura, aumenta la fuente de los encabezados, etc.) .
Si necesita usar un corchete de triángulo abierto en el texto, asegúrese de hacerlo con la ayuda para que el navegador lo entienda correctamente. Esto debe recordarse.
En el código, pueden verse así:
De hecho, contienen la descripción y las palabras clave de la página web para la que están escritos. Lea más sobre ellos en el artículo anterior.
Las metaetiquetas están escritas en el código de una página web en un lugar estrictamente definido. ¿Sabes cuál? Así es, en el llamado "encabezado" del documento, que es la apertura y el cierre. Etiquetas HEAD.
Todo lo que está escrito dentro de ellos (incluidas las etiquetas META) no se mostrará en la página web. Ésta es información estrictamente propietaria. La descripción y las palabras clave anteriores dicen los motores de búsqueda sobre el contenido de esta página web y la metaetiqueta a continuación.
¿Qué son las etiquetas de música en los archivos de audio?
Cuando reproducía música en el automóvil o en su reproductor (teléfono), probablemente notó más de una vez que se muestran algunos krakozyabra espeluznantes en lugar del nombre de la pista y el nombre del autor-artista. Se podría suponer que estos son los nombres de los archivos de música cargados escritos en la codificación incorrecta del idioma ruso.
Al cambiar el nombre de los archivos con, aún verá una imagen desagradable en su reproductor. ¿Qué hacer? ¿Y quién tiene la culpa de esta situación? Por extraño que parezca, pero la razón es incorrecta. etiquetas prescritas en este archivo de música.
Se cosen directamente en el archivo de audio (al principio o al final) y pueden contener información sobre la composición, su autor, álbum, duración de la pista y algo más no tan importante. En las últimas encarnaciones de etiquetas musicales, incluso se pueden coser imágenes de carátulas de discos (en general, la plaga).
Pero el problema surge, por regla general, no en su disponibilidad, sino en la obtención de la capacidad de editarlos... En la vida de todo amante de la música que se precie, llega un momento en el que está "listo para romper y tirar", simplemente para poner las cosas en orden en su colección y prescribir las etiquetas correctas que son legibles en cualquier dispositivo para todas las pistas. ¿Cómo hacerlo?
Con la ayuda de un software especial. Las etiquetas en sí mismas en archivos de audio aparecieron por primera vez a fines del siglo pasado. Para los archivos MP3, el estándar para agregarlos se llamaba ID3, y para los archivos de música que se comprimían sin pérdida de calidad (como FLAC y similares), el estándar para agregar etiquetas (metadatos) se llamaba comentario de Vorbis.
Para la música grabada en formato Vindosovsky WMA, hay metadatos WM, y para Apple MP4 - metadatos de iTunes (por cierto, escribí recientemente sobre eso).
Entonces, puede editar etiquetas usando programas especiales. El más popular de estos es probablemente Mp3tag(sitio oficial, pero tenga cuidado al descargar, no haga clic accidentalmente en anuncios que ofrecen descargar algo completamente diferente). Creo que encontrará todos los demás programas usted mismo, especialmente porque esto será suficiente para completar esta tarea.
Las etiquetas resultaron ser tan diversas, que en todos estos casos jugaron su papel principal: el marcado (artículos en el sitio, contenido en una página web o metadatos en archivos de música). Espero que ahora tengas menos preguntas sobre este tema.
¡Buena suerte para ti! Nos vemos pronto en las páginas del sitio del blog.
Te puede interesar
Etiquetas para Instagram: por qué son necesarias y dónde ver las más populares 
Hashtags: qué son y cómo se usan los hashtags en Twitter, Instagram y otros lugares Cómo agregar automáticamente el atributo Alt a las etiquetas Img de su blog de WordPress (donde no están presentes) 
Radical: alojamiento de fotos gratuito con carga de fotos rápida y fácil a través de Radikal.ru 
Enlace: que es y como crearlo Que es el caché: cómo borrar el caché en Opera, Mozile, Chrome y otros navegadores 
La gran pregunta es cómo ganar dinero con el servicio de preguntas y respuestas. 
¿Cómo crear tu propio canal en el alojamiento de videos de Youtube?
Decidí crear una tabla en la que puedas ver las etiquetas principales. lenguaje html y para que sirven. Las etiquetas se dividen en categorías para facilitar la navegación.
Cada etiqueta está escrita entre corchetes angulares, así:<название тега>... Para mi propia conveniencia, he mostrado en la tabla solo los nombres de las etiquetas sin paréntesis angulares.
| Etiqueta | Que hace | Más detalles |
|---|---|---|
| Básico | ||
| ! doctype | Define el tipo de documento | Determina cómo renderizar exactamente la página. |
| html | Todo el documento | Contenedor para todos los elementos de una página web |
| cuerpo | Cuerpo de la pagina | Todo el contenido de la página que se mostrará, su estructura. |
| cabeza | Información importante acerca de la página | No se mostrará en la pantalla, pero es necesario para que el sitio funcione (codificación, conexión de una hoja de estilo, etc.) |
| título | Título de la página | El nombre principal se mostrará en el motor de búsqueda y en línea superior navegador |
| Enlace | Conecta archivos externos | Esta etiqueta conecta hojas de estilo y otros archivos externos. |
| texto | Incluye archivos javascript | Atributo obligatorio: src, que especifica la ruta al archivo. |
| meta | Especifica metainformación | La metainformación incluye codificación y metaetiquetas. |
| Etiquetas semánticas html5 | ||
| encabezamiento | Crea un encabezado de sitio o sección | Puede haber varias etiquetas de este tipo en la página. El encabezado puede formarse como el encabezado del sitio en su conjunto, y el título del artículo, etc. |
| pie de página | Etiqueta para crear un pie de página de un sitio o sección | Similar en significado al elemento anterior, pero creado para crear el pie de página del sitio en él. |
| artículo | Contenedor para mostrar contenido en él (principal información de texto) | El texto principal que está presente en su página debe incluirse en esta etiqueta. |
| aparte | Muestra información secundaria que no está relacionada con la principal | Un contenedor para mostrar varios widgets y otra información que no está directamente relacionada al texto principal. |
| Formateo | ||
| pag | Párrafo | La etiqueta crea un párrafo que está separado verticalmente de otros elementos. sangrado. |
| h1-h6 | Encabezados | h1 es el encabezado más importante (artículo, sitio), h6 es el más pequeño. |
| hora | Linea horizontal | Crea una línea horizontal a lo largo de todo el ancho de la caja en la que se coloca. Su altura generalmente 1 píxel. No tiene ningún sentido, es solo un separador. |
| br | Forzar salto de línea | Se puede utilizar cuando no se está creando un nuevo párrafo, pero es necesario escribir el texto en una nueva línea. Etiqueta única, como hr. |
| lapso | Elemento de línea universal | Span fue creado para usarlo para envolver los fragmentos de texto necesarios y aplicarlos diseño unico. |
| div | Elemento de bloque universal | No tiene significado semántico. Esencialmente un contenedor regular con propiedades de bloque. Se utiliza para una variedad de propósitos. |
| pre | Etiqueta para mostrar el texto escrito en el editor | El texto se mostrará con todos los espacios, saltos de línea y sangrías preservados. |
| figura | Un contenedor para agrupar artículos. El ejemplo más simple es agrupar imágenes y leyendas para ellos. | La etiqueta apareció en la especificación html5. |
| figcaption | El título de los elementos ensamblados en la figura. | Puede colocarse por encima o por debajo de la forma, dependiendo de cómo esté colocada en el código. |
| Enlaces | ||
| a | Enlace | La etiqueta tiene un atributo href obligatorio, que especifica la URL. el documento al que conduce el enlace. |
| nav | Contenedor para enlaces importantes | Etiqueta HTML5 que se creó específicamente para incluir los enlaces más importantes. En la pagina. De hecho, fue creado para formar el menú principal del sitio. |
| Liza | ||
| ol | Lista numerada | Contenedor para enumerar los elementos de la lista |
| ul | Lista con viñetas | Contenedor para que los elementos de la lista se marquen con la misma viñeta |
| li | Elemento de lista | Cada elemento individual de la lista se coloca en esta etiqueta emparejada. Por defecto, tiene propiedades de bloque. |
| Imagenes | ||
| img | Muestra cualquier imagen | Atributo requerido - src (ruta a la imagen). Etiqueta única. |
| Para texto | ||
| B | Negrita | Etiqueta emparejada. Todo el texto enmarcado en él se pone en negrita. No da sentido lógico. |
| fuerte | Resalta el texto como importante + lo pone en negrita | Actúa como la etiqueta b, pero también agrega importancia a las palabras. |
| I | Pon el texto en cursiva | Da cursiva |
| em | Pone en cursiva el texto + enfatiza las palabras | Agrega énfasis lógico a las palabras del trasfondo de otros. |
| q | Pequeña cotización | Diseñado para resaltar pequeñas citas en la página. |
| s | Muestra texto tachado | Actúa solo en la decoración, sin añadir ningún significado |
| tu | Muestra texto subrayado | Como s, esta es una etiqueta puramente de estilo. |
| pre | Salida de texto manteniendo el formato | Conserva todos los espacios y saltos de línea que se hacen al escribir. |
| sub | Para mostrar la fuente en subíndice | También reduce el tamaño de la fuente en sí |
| sorber | Para mostrar la fuente en superíndice | Actúa igual con sub |
| Marcos | ||
| iframe | Emite un marco flotante | Parámetro obligatorio: src. También puede establecer el ancho y el alto. |
| Formularios | ||
| formulario | Contenedor de formulario | Contiene todos los campos que deben completarse. Tiene método de parámetros requeridos y acción para que su envío funcione. |
| aporte | Muestra varios campos de formulario | El tipo de campo depende del atributo de tipo. Este puede ser un campo para ingresar texto, contraseña, selector de fecha, etc. |
| campo | Separa una parte del formulario de otra | Por ejemplo, si algunos campos son para datos de registro generales, mientras que otros son para selección de intereses, pueden estar separados por dichas etiquetas, ya que se trata de diferentes grupos de campos. |
| leyenda | Envía un título a un grupo de campos | Este es el nombre del conjunto de campos cotainer |
| etiqueta | Firma de campo | Le permite establecer una relación entre el campo de entrada y este elemento. Cuando haces clic en la etiqueta, transferir el foco al campo con el que está asociado. Y si la etiqueta está asociada con una casilla de verificación o botones de opción, cuando haga clic en ella el botón correspondiente se selecciona automáticamente. La vinculación se realiza mediante el atributo for. |
| Seleccione | Lista desplegable de opciones | Al hacer clic en él, podrá seleccionar una de las opciones configuradas anteriormente. Con el atributo múltiple se pueden seleccionar varios valores en dicha lista. |
| opción | Muestra una opción para un menú desplegable | Esta etiqueta es única, el texto requerido se escribe en el atributo de valor. |
| textarea | Campo para texto de varias líneas | Se usa cuando necesitas escribir mucho texto. Por ejemplo, para comentarios, reseñas, etc. |
| Mesas | ||
| mesa | Recipiente principal para la mesa | Contiene todo su contenido: filas y celdas. |
| subtítulo | Encabezado de la tabla | Puede ubicarse en cualquier lugar del contenedor de la mesa, en cualquier caso se mostrará en la parte superior o inferior. |
| tr | Crea una fila de una tabla | Puede haber un número ilimitado de celdas seguidas. En la fila en sí, no se deben colocar más que celdas. |
| td | Crea una celda | Este texto también está escrito en la celda. Se pueden insertar otros elementos html en él. Por ejemplo, imágenes, videos e incluso otras tablas |
| th | Crea una celda de encabezado | El texto en él se vuelve negrita y centrado. |
| Multimedia | ||
| audio | Le permite insertar un archivo de audio | La inserción se realiza mediante etiquetas de origen único, en las que se escribe la ruta al archivo. Hasta ahora para Los desarrolladores web de varios navegadores tienen que incrustar varios formatos de archivo para que cualquier navegador web podría identificarlo. |
| video | Inserta video | El proceso es el mismo que con el audio. Atributo vacío controles agregan elementos control de video, el atributo de póster: agrega una imagen en miniatura. |
| fuente | Especifica la ruta al archivo multimedia (audio o video) | Insertadas dentro de etiquetas de audio o video, entre sus partes de apertura y cierre. La ruta se establece mediante el atributo src, también se indican los códecs. |
Estas no son todas las etiquetas
Puede encontrar todas las etiquetas principales en esta tabla, pero eso no es todo. Sin embargo, estos son los que te serán de utilidad, el resto se usará solo en un 5-10% de los casos y puedes verlos en algún libro de referencia detallado.
Todo el que lea este tutorial probablemente sepa qué es HTML. Pero observar los conceptos básicos puede ayudar a aumentar el conocimiento y perfeccionar sus habilidades, especialmente frente a las tecnologías web en constante evolución.
Se habla mucho ahora sobre los cambios que ha traído HTML 5. Todas las etiquetas mencionadas en este artículo son compatibles con HTML 4.01 y HTML 5. Si bien algunas de estas etiquetas se utilizan ampliamente, será muy útil volver a visitar el métodos involucrados.
1.
Cada libro sobre programación contiene una mención de que es muy útil explicar lo que está haciendo su código. ¿Por qué comentar es una buena práctica? Esto es muy útil para que el lector de su código comprenda la esencia de lo que está sucediendo.
Para HTML, comentar puede parecer una cláusula de aumento de peso. Sin embargo, los comentarios pueden resultar útiles para definir secciones y para mantener la estructura y organización del código de la página. Marcar el inicio y el final de varias secciones puede ser de gran ayuda cuando se trabaja en un proyecto.
- Elemento de menú 1
- Elemento de menú 2
Este es el contenido principal.
...2. Estilos de mesa: , , y
Hacer buen diseño tablas, debe utilizar las etiquetas especificadas en el subtítulo. Todos afectan a las filas de la tabla y se pueden diseñar fácilmente.
Artículo
Cant.
Suma
7
#1
3
#2
4
Envolvemos las filas de la tabla en
... Así es como se forma el encabezado de la tabla.
Envolviendo las líneas en
formamos las líneas de resumen en la parte inferior de la tabla. Instrumentos de cuerda
debe definirse antes de las líneas
por lo tanto, las filas totales se muestran antes que el resto de las filas de la tabla.
Envolvemos las líneas de datos en
.
Párrafo
Cant.
Suma
7
#1
3
#2
4
3.
Una lista desplegable es una excelente manera de presentar datos para la selección de un usuario. No solo ocupan poco espacio, sino que son familiares para los usuarios y fáciles de usar. Maravillosa propiedad es la capacidad de crear categorías (o subtítulos) para los elementos de la lista.
Tigres de Detroit Cachorros de Chicago Leones de Detroit Osos de Chicago
4. Encabezados - ,,,,, y
Todo el mundo usa títulos, por supuesto. Pero para ser honesto, ¿cuándo fue la última vez que usaste
o un título de nivel aún más bajo? Los encabezados le permiten crear menos construcciones semánticas, como estilos adicionales para texto en
.
No es necesario crear trabajo adicional para usted. Recuerde las etiquetas del título.
5.
Recuperación de contraseña
Envolvemos las filas de la tabla en ... Así es como se forma el encabezado de la tabla.
Envolviendo las líneas en
formamos las líneas de resumen en la parte inferior de la tabla. Instrumentos de cuerda
debe definirse antes de las líneas
por lo tanto, las filas totales se muestran antes que el resto de las filas de la tabla.
Envolvemos las líneas de datos en
.
Párrafo
Cant.
Suma
7
#1
3
#2
4
3.
Una lista desplegable es una excelente manera de presentar datos para la selección de un usuario. No solo ocupan poco espacio, sino que son familiares para los usuarios y fáciles de usar. Maravillosa propiedad es la capacidad de crear categorías (o subtítulos) para los elementos de la lista.
Tigres de Detroit Cachorros de Chicago Leones de Detroit Osos de Chicago
4. Encabezados - ,,,,, y
Todo el mundo usa títulos, por supuesto. Pero para ser honesto, ¿cuándo fue la última vez que usaste
o un título de nivel aún más bajo? Los encabezados le permiten crear menos construcciones semánticas, como estilos adicionales para texto en
.
No es necesario crear trabajo adicional para usted. Recuerde las etiquetas del título.
5.
Recuperación de contraseña
Envolvemos las líneas de datos en
.
| Párrafo | Cant. |
| Suma | 7 |
| #1 | 3 |
| #2 | 4 |
3.
Una lista desplegable es una excelente manera de presentar datos para la selección de un usuario. No solo ocupan poco espacio, sino que son familiares para los usuarios y fáciles de usar. Maravillosa propiedad es la capacidad de crear categorías (o subtítulos) para los elementos de la lista.
Tigres de Detroit Cachorros de Chicago Leones de Detroit Osos de Chicago
4. Encabezados - ,,,,, y
,,,, y
,, y
Todo el mundo usa títulos, por supuesto. Pero para ser honesto, ¿cuándo fue la última vez que usaste No es necesario crear trabajo adicional para usted. Recuerde las etiquetas del título.
o un título de nivel aún más bajo? Los encabezados le permiten crear menos construcciones semánticas, como estilos adicionales para texto en 5.
Recuperación de contraseña