En este artículo, veremos qué caracteres se pueden usar para los triángulos arriba/abajo (flecha sin tallo) para mostrar en HTML.
Unicode es una forma simple y rápida de agregar caracteres básicos a su página web. No requiere requests externas y reduce el tiempo de carga de la página. No requiere que se incluya una imagen, lo que significa que se puede ajustar manualmente.
Enfoque: Unicode se puede usar tanto en HTML como en CSS de dos maneras ligeramente diferentes. Entonces, aquí está el Unicode para varias puntas de flecha:
- ▲ – U+25B2 – Triángulo negro apuntando hacia arriba sin vástago
- ▼ – U+25BC – Triángulo negro apuntando hacia abajo sin tallo
- ▴ – U+25B4 – Pequeño triángulo negro apuntando hacia arriba sin tallo
- ▾ – U+25BE – Pequeño triángulo negro apuntando hacia arriba sin tallo
Nota: No olvide agregar ‘;’ después del Unicode.
Ejemplo 1: Este ejemplo describe el uso de Unicode que puede mostrar triángulos arriba/abajo en HTML.
HTML
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name="viewport" content= "width=device-width, initial-scale=1.0"> <title>Using Unicode Characters</title> </head> <body> <h2>Welcome To GFG</h2> <p> You can find more information below ▼ </p> </body> </html>
Producción:
También puede usar CSS para usar caracteres Unicode. Esto se hace usando pseudo-elementos como ::antes y ::después de los selectores. Los beneficios de usar Unicode en su CSS es que se puede diseñar de forma independiente.
Ejemplo 2: En este ejemplo, queremos mostrar un triángulo arriba/abajo después de un elemento HTML <p>, usando CSS.
HTML
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content=
"width=device-width, initial-scale=1.0">
<title>Using Unicode Characters</title>
<style>
p::after {
content: '\25BC';
}
</style>
</head>
<body>
<h2>Welcome to GeeksforGeeks</h2>
<a href=
"https://www.geeksforgeeks.org/data-structures/">
Data Structures & Algorithms
</a>
<p>
Click the above DSA link
to find more information
</p>
</body>
</html>
Lo incluimos reemplazando ‘U +’ con ‘\’ antes del Unicode.
Producción:
Publicación traducida automáticamente
Artículo escrito por rrozario958 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA