Hola @Beginner Web
No comprendí muy bien tu primera pregunta, ¿hablas de imágenes con captions, o simplemente de colocar imagen / texto / imagen / texto?
Si es así, realmente basta con algo así:
<img src="link de la imagen en SVG si quieres" title="titulo de la imagen" />
Y ya, queda una estructura vertical simple... No sé si esa era tu pregunta.
Para dar orden determinado a etiquetas HTML, si buscas algo más complejo que una simple visualización vertical, entonces necesitarás aplicar CSS. Hay maneras básicas como
float, lo cual hará que la imagen se haga hacia un lado y el texto al lado contrario. O bien, mi recomendación sería
flexboxPara tu segunda pregunta, es sencillo; buscas el selector
:hoverhttps://www.w3schools.com/cssref/sel_hover.aspSirve para cualquier elemento HTML, no solo botones y vínculos; ¡y puedes aplicar cualquier parámetro CSS que quieras! (no solo cambiar el color de fondo, por ejemplo)
Ejemplo rápido con enlace:
a {color:red;}
a:hover {color:yellow;}
<a href="#">Un enlace
</a>
La definición de etiquetas HTML en CSS tiene efecto en TODOS los elementos. Por lo que si deseas solamente tocar un elemento en particular, te recomiendo usar clases:
a.lalolanda {color:red;}
a.lalolanda:hover {color:yellow;}
<a class="lalolanda" href="#">Un enlace
</a>
A veces el selector de la etiqueta en particular puede sobrar; por ejemplo, ahí arriba solo ".lalolanda" en la definición CSS habría funcionado. Pero depende de cuán específica quieras ser con el selector. Puede haber, por ejemplo "p.lalolanda" que solo afectaría a los "<p>" que se llamen "lalolanda" pero no a los "<a>" ¿me hago entender?...
Saludos.
Autor
En línea
