Etiquetas HTML esenciales

Sesión 02: Etiquetas
DISEÑO DE
PÁGINAS WEB
Conocimiento para la transformación digital
INSTITUTO CARLOS CUETO FERNADINI

ÍNDICE
• Etiquetas
• Ejemplos para HTML
• Ejemplos con HTML Y CSS
01

02
Etiquetas
• La etiqueta deﬁne un hipervínculo, que se utiliza para vincular de una página a otra.<a>
• El atributo más importante del elemento es el atributo, que indica el destino del enlace.<a> href
• De forma predeterminada, los enlaces aparecerán de la siguiente manera en todos los navegadores:
· Un enlace no visitado está subrayado y en azul
· Un enlace visitado está subrayado y morado
· Un enlace activo está subrayado y en rojo
• Ejemplo
Crea un enlace a W3Schools.com:
<a href="https://www.w3schools.com">Visit W3Schools.com!</a>
• Ejemplo abrir página en nueva pestaña
El atributo target especiﬁca dónde abrir el documento vinculado:
<a href="https://www.w3schools.com" target="_blank">Visit W3Schools</a>

03
<b>
• La etiqueta especifica el texto en negrita sin ninguna importancia adicional.<b>
Consejos y notas
Nota: De acuerdo con la especificación HTML5, la etiqueta debe usarse como ÚLTIMO recurso cuando ninguna otra etiqueta
es más apropiada. La especificación establece que los encabezados deben denotarse con las etiquetas <h1> a <h6>, el texto
enfatizado debe denotarse con la etiqueta <em>, el texto importante debe denotarse con la etiqueta <strong> y el texto
marcado / resaltado debe denotarse con la etiqueta <mark>.<b>
• Ejemplo
Ponga un texto en negrita (sin marcarlo como importante):
<p>This is normal text - <b>and this is bold text</b>.</p>

04
<article>
• La etiqueta especiﬁca contenido independiente <article>
Un artículo debe tener sentido por sí solo y debe ser posible distribuirlo independientemente del resto del sitio.
Fuentes potenciales para el elemento:<article>
· Publicación en el foro
· Entrada de blog
· Noticia
Nota: El elemento no se representa como nada especial en un navegador. Sin embargo, puede usar CSS para aplicar estilo al
elemento (consulte el ejemplo a continuación).<article><article>
• Ejemplo
Tres artículos con contenido independiente y autónomo:
<article>
<h2>Google Chrome</h2>
<p>Google Chrome is a web browser developed by Google, released in 2008. Chrome is the world's most popular
web browser today!</p>
</article>

05
<article>
<h2>Mozilla Firefox</h2>
<p>Mozilla Firefox is an open-source web browser developed by Mozilla. Firefox has been the second most popular
web browser since January, 2018.</p>
</article>
<article>
<h2>Microsoft Edge</h2>
<p>Microsoft Edge is a web browser developed by Microsoft, released in 2015. Microsoft Edge replaced Internet
Explorer.</p>
</article>
• Ejemplo con CSS
Utilice CSS para aplicar estilo al elemento <article>:
<html>
<head>
<style>
.all-browsers {
margin: 0;
padding: 5px;
background-color: lightgray;
}

06
.all-browsers > h1, .browser {
margin: 10px;
padding: 5px;
}
.browser {
background: white;
}
.browser > h2, p {
margin: 4px;
font-size: 90%;
}
</style>
</head>
<body>
<article class="all-browsers">
<h1>Most Popular Browsers</h1>
<article class="browser">
<h2>Google Chrome</h2>
<p>Google Chrome is a web browser developed by Google, released in 2008. Chrome is the world's most popular
web browser today!</p>
</article>

07
<h2>Mozilla Firefox</h2>
<p>Mozilla Firefox is an open-source web browser developed by Mozilla. Firefox has been the second most popular
web browser since January, 2018.</p>
</article>
<h2>Microsoft Edge</h2>
<p>Microsoft Edge is a web browser developed by Microsoft, released in 2015. Microsoft Edge replaced Internet
Explorer.</p>
</article>
</article>
</body>
</html>

08
<aside>
• La etiqueta deﬁne parte del contenido aparte del contenido en el que se coloca.<aside>
• El contenido aparte debe estar indirectamente relacionado con el contenido circundante.
Nota: El elemento no se representa como nada especial en un navegador. Sin embargo, puede usar CSS para aplicar estilo al
elemento (consulte el ejemplo a continuación).<aside><aside>
• Ejemplo
Mostrar algún contenido aparte del contenido en el que se coloca:
<p>My family and I visited The Epcot center this summer. The weather was nice, and Epcot was amazing! I had a great
summer together with my family!</p>
<aside>
<h4>Epcot Center</h4>
<p>Epcot is a theme park at Walt Disney World Resort featuring exciting attractions, international pavilions, award-
winning ﬁreworks and seasonal special events.</p>
</aside>

09
• Ejemplo con CSS
Utilice CSS para aplicar estilo al elemento <aside>:
<html>
<head>
<style>
aside {
width: 30%;
padding-left: 15px;
margin-left: 15px;
ﬂoat: right;
font-style: italic;
background-color: lightgray;
}
</style>
</head>
<body>
<h1>The aside element</h1>

10
<aside>
<p>The Epcot center is a theme park at Walt Disney World Resort featuring exciting attractions, international
pavilions, award-winning ﬁreworks and seasonal special events.</p>
</aside>
</body>
</html>

11
<audio>
• La etiqueta se utiliza para incrustar contenido de sonido en un documento, como música u otras secuencias de
audio.<audio>
• La etiqueta contiene una o más etiquetas con diferentes fuentes de audio. El navegador elegirá la primera fuente que
admita.<audio><source>
• El texto entre las etiquetas y solo se mostrará en navegadores que no admitan el elemento.<audio></audio><audio>
• Hay tres formatos de audio compatibles en HTML: MP3, WAV y OGG.
• Ejemplo
Reproducir un archivo de sonido:
<audio controls>
<source src="horse.ogg" type="audio/ogg">
<source src="horse.mp3" type="audio/mpeg">
Your browser does not support the audio tag.
</audio>

12
<br>
• La etiqueta inserta un solo salto de línea.<br>
• La etiqueta es útil para escribir direcciones o poemas.<br>
• La etiqueta es una etiqueta vacía, lo que significa que no tiene una etiqueta final.<br>
• Ejemplo
Usa <br> en un poema:
<p>Be not afraid of greatness.<br>
Some are born great,<br>
some achieve greatness,<br>
and others have greatness thrust upon them.</p>
<p><em>-William Shakespeare</em></p>
<button>
• La etiqueta define un botón en el que se puede hacer clic.<button>
• Dentro de un elemento puedes poner texto (y etiquetas como , , , , , etc.). ¡Eso no es posible con un botón creado con el
elemento!<button><i><b><strong><br><img><input>

13
• Ejemplo
Un botón en el que se puede hacer clic se marca de la siguiente manera:
<button type="button">Click Me!</button>
• Ejemplo con CSS
Utilice CSS para aplicar estilo a los botones:
<!DOCTYPE html>
<html>
<head>
<style>
.button {
border: none;
color: white;
padding: 15px 32px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
margin: 4px 2px;
cursor: pointer;
}

14
.button1 {background-color: #4CAF50;} /* Green */
.button2 {background-color: #008CBA;} /* Blue */
</style>
</head>
<body>
<button class="button button1">Green</button>
<button class="button button2">Blue</button>
</body>
</html>
<div>
• La etiqueta deﬁne una división o una sección en un documento HTML.<div>
• La etiqueta se utiliza como contenedor para elementos HTML, que luego se diseña con CSS o se manipula con
JavaScript.<div>
• La etiqueta se diseña fácilmente mediante el atributo class o id.<div>
¡Cualquier tipo de contenido se puede poner dentro de la etiqueta! <div>

15
• Ejemplo
Una sección <div> en un documento con estilo CSS:
<html>
<head>
<style>
.myDiv {
border: 5px outset red;
background-color: lightblue;
text-align: center;
}
</style>
</head>
<body>
<div class="myDiv">
<h2>This is a heading in a div element</h2>
<p>This is some text in a div element.</p>
</div>
</body>
</html>

16
<h1> a <h6>
• Las etiquetas to se utilizan para definir encabezados HTML.<h1><h6>
• <h1> define el epígrafe más importante. define el epígrafe menos importante.<h6>
Nota: Solo use uno por página: esto debe representar el encabezado / tema principal para toda la página. Además, no omita
los niveles de encabezado: comience con , luego use , y así sucesivamente. <h1><h1><h2>
• Ejemplo
Los seis encabezados HTML diferentes:
<h1>This is heading 1</h1>

17
<head>
• El elemento es un contenedor de metadatos (datos sobre datos) y se coloca entre la etiqueta <html> y la etiqueta
<body>.<head>
• Los metadatos son datos sobre el documento HTML. No se muestran los metadatos.
• Los metadatos suelen deﬁnir el título del documento, el juego de caracteres, los estilos, los scripts y otra metainformación.
• Los siguientes elementos pueden ir dentro del elemento:<head>
<title>
(required in every HTML document)
<style>
<base>
<link>
<meta>
<script>
<noscript>

18
<header>
• El elemento representa un contenedor para contenido introductorio o un conjunto de vínculos de navegación.<header>
Un elemento normalmente contiene:<header>
· Uno o más elementos de encabezado (<h1> - <h6>)
· Logotipo o icono
· Información de autoría
• Ejemplo
Un encabezado para un <artículo>:
<article>
<header>
<h1>A heading here</h1>
<p>Posted by John Doe</p>
<p>Some additional information here</p>
</header>
<p>Lorem Ipsum dolor set amet....</p>
</article>

19
<hr>
• La etiqueta define un salto temático (dibuja una línea) en una página HTML (por ejemplo, un cambio de tema).<hr>
El elemento se muestra con mayor frecuencia como una regla horizontal que se utiliza para separar el contenido (o definir un
cambio) en una página HTML.<hr>
• Ejemplo
Utilice la etiqueta <hr> para definir los cambios temáticos en el contenido:
<h1>The Main Languages of the Web</h1>
<p>HTML is the standard markup language for creating Web pages. HTML describes the structure of a Web page, and
consists of a series of elements. HTML elements tell the browser how to display the content.</p>
<hr>
<p>CSS is a language that describes how HTML elements are to be displayed on screen, paper, or in other media. CSS
saves a lot of work, because it can control the layout of multiple web pages all at once.</p>
<hr>
<p>JavaScript is the programming language of HTML and the Web. JavaScript can change HTML content and attribute
values. JavaScript can change CSS. JavaScript can hide and show HTML elements, and more.</p>

20
<img>
• La etiqueta se utiliza para incrustar una imagen en una página HTML.<img>
• Las imágenes no se insertan técnicamente en una página web; las imágenes están vinculadas a páginas web. La etiqueta
crea un espacio de retención para la imagen a la que se hace referencia.<img>
• La etiqueta tiene dos atributos obligatorios:<img>
· src: especifica la ruta de acceso a la imagen
· ALT: especifica un texto alternativo para la imagen, si la imagen por algún motivo no se puede mostrar
Nota: Además, especifique siempre el ancho y el alto de una imagen. Si no se especifican el ancho y el alto, la página puede
parpadear mientras se carga la imagen.
Propina: Para vincular una imagen a otro documento, simplemente anide la etiqueta dentro de una etiqueta (vea el
<a>
ejemplo a continuación). <img>
• Ejemplo
Cómo insertar imágenes desde otra carpeta o desde otro sitio web:
<img src="/images/stickman.gif" alt="Stickman" width="24" height="39">
<img src="https://www.w3schools.com/images/lamp.jpg" alt="Lamp" width="32" height="32">

21
<input>
• La etiqueta especiﬁca un campo de entrada donde el usuario puede introducir datos.<input>
• El elemento es el elemento de forma más importante.<input>
• El elemento se puede mostrar de varias maneras, dependiendo del atributo type.<input>
• Los diferentes tipos de entrada son los siguientes:
· <input type="button">
· <input type="checkbox">
· <input type="color">
· <input type="date">
· <input type="datetime-local">
· <input type="email">
· <input type="ﬁle">
· <input type="hidden">
· <input type="image">
· <input type="month">
· <input type="number">
· <input type="password">
· <input type="radio">
· <input type="range">
· <input type="reset">
· <input type="search">
· <input type="submit">
· <input type="tel">
· <input type="text"> (valor predeterminado)
· <input type="time">
· <input type="url">
· <input type="week">

22
• Ejemplo
Un formulario HTML con tres campos de entrada; dos campos de texto y un botón de envío:
<form action="/action_page.php">
<label for="fname">First name:</label>
<input type="text" id="fname" name="fname"><br><br>
<label for="lname">Last name:</label>
<input type="text" id="lname" name="lname"><br><br>
<input type="submit" value="Submit">
</form>
<label>
• La etiqueta define una etiqueta para varios elementos:<label>
• El uso adecuado de las etiquetas con los elementos anteriores beneficiará:
• Usuarios de lectores de pantalla (leerán en voz alta la etiqueta, cuando el usuario esté centrado en el elemento)
• Usuarios que tienen dificultades para hacer clic en regiones muy pequeñas (como casillas de verificación) - porque cuando
un usuario hace clic en el texto dentro del elemento, alterna la entrada (esto aumenta el área de aciertos). <label>

23
· <input type="checkbox">
· <input type="color">
· <input type="date">
· <input type="datetime-local">
· <input type="email">
· <input type="archivo">
· <input type="mes">
· <input type="number">
· <input type="password">
· <input type="radio">
· <input type="range">
· <input type="search">
· <input type="tel">
· <input type="text">
· <input type="time">
· <input type="url">
· <input type="week">
· <mámetro>
· <progreso>
· <seleccionar>
· <textarea>
• Ejemplo
Tres botones de opción con etiquetas:
<form action="/action_page.php">
<input type="radio" id="html" name="fav_language" value="HTML">
<label for="html">HTML</label><br>
<input type="radio" id="css" name="fav_language" value="CSS">
<label for="css">CSS</label><br>
<input type="radio" id="javascript" name="fav_language"
value="JavaScript">
<label for="javascript">JavaScript</label><br><br>
<input type="submit" value="Submit">
</form>

24
<link>
• La etiqueta deﬁne la relación entre el documento actual y un recurso externo.<link>
• La etiqueta se usa con mayor frecuencia para vincular a hojas de estilo externas o para agregar un a su sitio
favicon
web.<link>
• El elemento es un elemento vacío, contiene solo atributos.<link>
• Ejemplo
Enlace a una hoja de estilos externa:
<head>
<link rel="stylesheet" href="styles.css">
</head>
<nav>
• La etiqueta deﬁne un conjunto de vínculos de navegación.<nav>
• Observe que NO todos los enlaces de un documento deben estar dentro de un elemento. El elemento está destinado solo
para bloques principales de enlaces de navegación.<nav><nav>
• Los navegadores, como los lectores de pantalla para usuarios deshabilitados, pueden usar este elemento para determinar
si se debe omitir la representación inicial de este contenido.

25
• Ejemplo
Un conjunto de enlaces de navegación:
<nav>
<a href="/html/">HTML</a> |
<a href="/css/">CSS</a> |
<a href="/js/">JavaScript</a> |
<a href="/python/">Python</a>
</nav>
<p>
• La etiqueta deﬁne un párrafo.<p>
• Los navegadores agregan automáticamente una sola línea en blanco antes y después de cada elemento.<p>
• Ejemplo
Un párrafo está marcado de la siguiente manera:
<p>This is some text in a paragraph.</p>

26
<section>
• La etiqueta deﬁne una sección de un documento.
• Ejemplo
Dos secciones de un documento:
<section>
<h2>WWF History</h2>
<p>The World Wide Fund for Nature (WWF) is an international organization working on issues regarding the
conservation, research and restoration of the environment, formerly named the World Wildlife Fund. WWF was
founded in 1961.</p>
</section>
<section>
<h2>WWF's Symbol</h2>
<p>The Panda has become the symbol of WWF. The well-known panda logo of WWF originated from a panda named
Chi Chi that was transferred from the Beijing Zoo to the London Zoo in the same year of the establishment of
WWF.</p>
</section>

27
<strong>
• La etiqueta se utiliza para definir texto con gran importancia. El contenido del interior se muestra normalmente en
negrita.<strong>
• Ejemplo
Definir texto importante en un documento:
<strong>This text is important!</strong>
<table>
• La etiqueta define una tabla HTML.<table>
• Una tabla HTML consta de un elemento y uno o más <table>
elementos <tr>, <th> y <td>.
• El elemento <tr> define una fila de tabla, el elemento <th> define un encabezado de tabla y el elemento <td> define una
celda de tabla.

28
• Ejemplo
Una tabla HTML simple, que contiene dos columnas y dos
ﬁlas:
<table>
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
</table>
• Ejemplo CSS
Cómo agregar bordes contraídos a una tabla (con CSS):
<html>
<head>
<style>
table, th, td {
border: 1px solid black;
border-collapse: collapse;
}
</style>
</head>
<body>
<table>
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
<tr>
<td>February</td>
<td>$80</td>
</tr>
</table>
</body>
</html>

29
• Ejemplo
Cómo agregar color de fondo a una tabla (con CSS):
<table style="background-color:#00FF00">
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
<tr>
<td>February</td>
<td>$80</td>
</tr>
</table>
• Ejemplo
Cómo establecer el ancho de la tabla (con CSS):
<table style="width:400px">
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
<tr>
<td>February</td>
<td>$80</td>
</tr>
</table>

30
• Ejemplo
Una tabla HTML con una celda de tabla que abarca dos
columnas:
<table>
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
<tr>
<td>February</td>
<td>$80</td>
</tr>
<tr>
<td colspan="2">Sum: $180</td>
</tr>
</table>
• Ejemplo
Una tabla HTML con una celda de tabla que abarca dos ﬁlas:
<table>
<tr>
<th>Month</th>
<th>Savings</th>
<th>Savings for holiday!</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
<td rowspan="2">$50</td>
</tr>
<tr>
<td>February</td>
<td>$80</td>
</tr>
</table>

31
<td>
• La etiqueta deﬁne una celda de datos estándar en una tabla HTML.<td>
• Una tabla HTML tiene dos tipos de celdas:
· Celdas de encabezado: contiene información de encabezado (creada con el elemento <th>)
· Celdas de datos: contiene datos (creados con el elemento)<td>
• El texto de los elementos es regular y está alineado a la izquierda de forma predeterminada.<td>
• El texto de los elementos <> está en negrita y centrado de forma predeterminada.
• Ejemplo
Una tabla HTML simple, con dos ﬁlas y cuatro celdas de tabla:
<table>
<tr>
<td>Cell A</td>
<td>Cell B</td>
</tr>
<tr>
<td>Cell C</td>
<td>Cell D</td>
</tr>
</table>

32
<th>
• La etiqueta deﬁne una celda de encabezado en una tabla HTML.<th>
• Una tabla HTML tiene dos tipos de celdas:
· Celdas de encabezado: contiene información de encabezado (creada con el elemento)<th>
· Celdas de datos: contiene datos (creados con el elemento <th>)
• El texto de los elementos está en negrita y centrado de forma predeterminada.<th>
• El texto de los elementos <td> son regulares y están alineados a la izquierda de forma predeterminada.
• Ejemplo
Una tabla HTML simple con tres ﬁlas, dos celdas de encabezado y cuatro celdas de datos:
<table>
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
<tr>
<td>February</td>
<td>$80</td>
</tr>
</table>

33
<tr>
• La etiqueta define una fila en una tabla HTML.<tr>
Un elemento contiene uno o más <tr>
elementos <th> o <td>.
• Ejemplo
Una tabla HTML simple con tres filas; una fila de encabezado y dos filas de datos:
<table>
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
<tr>
<td>February</td>
<td>$80</td>
</tr>
</table>

34
<ul>
• La etiqueta define una lista desordenada (con viñetas).<ul>
• Utilice la etiqueta junto con la etiqueta para crear listas desordenadas.<ul>
<li>
• Ejemplo
Una lista HTML desordenada:
<ul>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
<ol>
• La etiqueta define una lista ordenada. Una lista ordenada puede ser numérica o alfabética.<ol>
• La etiqueta se utiliza para definir cada elemento de lista
<ol>

35
• Ejemplo
Dos listas ordenadas diferentes (la primera lista comienza en 1 y la segunda comienza en 50):
<ol>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>
<ol start="50">
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>
<li>
• La etiqueta deﬁne un elemento de lista.<li>
• La etiqueta se utiliza dentro de listas ordenadas ( ), listas no ordenadas y en listas de menús <li>
<ol> (<ul>) (<menu>).
• En <ul> y <menú>, los elementos de la lista generalmente se mostrarán con viñetas.
• En <ol>, los elementos de la lista generalmente se mostrarán con números o letras.

36
• Ejemplo
Una lista HTML ordenada (<ol>) y otra desordenada (<ul>):
<ol>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>
<ul>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
<span>
• La etiqueta es un contenedor en línea que se utiliza para marcar una parte de un texto o una parte de un
documento.<span>
• La etiqueta es fácilmente diseñada por CSS o manipulada con JavaScript usando el atributo class o id.<span>
• La etiqueta es muy parecida al elemento , pero <div> es un elemento a nivel de bloque y es un elemento en
<div>
línea.<span><span>

37
• Ejemplo
Un elemento <span> que se utiliza para colorear una parte de un texto:
<p>My mother has <span style="color:blue">blue</span> eyes.</p>
<textarea>
• La etiqueta define un control de entrada de texto de varias líneas.<textarea>
• El elemento se usa a menudo en un formulario, para recopilar entradas de usuarios como comentarios o
reseñas.<textarea> Un área de texto puede contener un número ilimitado de caracteres, y el texto se representa en una
fuente de ancho fijo (generalmente Courier). El tamaño de un área de texto se especifica mediante los atributos y (o con
CSS).<cols><rows> El atributo es necesario para hacer referencia a los datos del formulario después de enviar el
formulario (si omite el atributo, no se enviará ningún dato del área de texto).name name. El atributo es necesario para
asociar el área de texto con una etiqueta. id
• Ejemplo
Un control de entrada de texto de varias líneas (área de texto):
<label for="w3review">Review of W3Schools:</label>
<textarea id="w3review" name="w3review" rows="4" cols="50">
At w3schools.com you will learn how to make a website. They offer free tutorials in all web development
technologies.3
</textarea>

38
<video>
• La etiqueta se utiliza para incrustar contenido de vídeo en un documento, como un clip de película u otras secuencias de
vídeo.<video>
• La etiqueta contiene una o más etiquetas con diferentes fuentes de vídeo. El navegador elegirá la primera fuente que
admita.<video><source>
• El texto entre las etiquetas y solo se mostrará en navegadores que no admitan el elemento <video>.<video></video>
• Hay tres formatos de video compatibles en HTML: MP4, WebM y OGG.
• Ejemplo
Reproducir un vídeo:
<video width="320" height="240" controls>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>

www.itecperu.org.pe Facebook/itecperú Jr. Arica 309 / Abancay
www.itecperu.org.pe Facebook/Itecperú Tamburco / Victor Acosta
ESCUELA DE TECNOLOGÍA INFORMÁTICA ONLINE
Conocimiento para la transformación digital

Etiquetas HTML esenciales

Recomendados

Recomendados

Más contenido relacionado

Similar a Etiquetas HTML esenciales

Similar a Etiquetas HTML esenciales (20)

Último

Último (13)

Etiquetas HTML esenciales