simbolos lista especiales español codigo charset caracteres caracter acentos aacute html unicode character html-entities arrow

lista - Códigos de caracteres HTML para esto ▲ o este ▼



simbolos ascii (6)

Consulte esta página http://www.alanwood.net/unicode/geometric_shapes.html , primero es "9652 ▲ 25B2 NEGRO UP-POINTING TRIANGLE (presente en WGL4)" y segundo "9660 ▼ 25BC NEGRO DOWN-POINTING TRIANGLE (presente en WGL4) ".

¿Cuáles son los códigos de caracteres de la entidad HTML para esta flecha hacia arriba ( ▲ ) y su versión de perro hacia abajo ( ▼ )?

He estado usando GIF para representar estas flechas ya que no conozco sus códigos.

Hay varias formas correctas de mostrar un triángulo que apunta hacia abajo y hacia arriba.

Método 1: usar entidad HTML decimal

HTML:

▲ ▼

Método 2: usar entidad HTML hexadecimal

HTML:

▲ ▼

Método 3: usa el personaje directamente

HTML:

▲ ▼

Método 4: usa CSS

HTML:

<span class=''icon-up''></span> <span class=''icon-down''></span>

CSS:

.icon-up:before { content: "/25B2"; } .icon-down:before { content: "/25BC"; }

Cada uno de estos tres métodos debe tener el mismo resultado. Para otros símbolos, existen las mismas tres opciones. Algunos incluso tienen una cuarta opción, que le permite utilizar una referencia basada en cadenas (por ejemplo, &hearts; para mostrar ♥).

Puede usar un sitio web de referencia como Unicode-table.com para encontrar qué iconos son compatibles con UNICODE y con qué códigos se corresponden. Por ejemplo, puede encontrar los valores para el triángulo que apunta hacia abajo en http://unicode-table.com/en/25BC/ .

Tenga en cuenta que estos métodos son suficientes solo para iconos que están disponibles por defecto en cada navegador. Para símbolos como ☃, ❄, ★, ☂, ☭, ⎗ o ⎘, es mucho menos probable que este sea el caso. Si bien es posible proporcionar compatibilidad con varios navegadores para otros símbolos UNICODE, el procedimiento es un poco más complicado.

Si desea saber cómo agregar soporte para los caracteres UNICODE menos comunes, vea Crear fuente web con símbolos Unicode Supplementary Multilingual Plane para obtener más información sobre cómo hacer esto.

Imágenes de fondo

Una estrategia totalmente diferente es el uso de imágenes de fondo en lugar de fuentes. Para un rendimiento óptimo, es mejor incrustar la imagen en su archivo CSS mediante codificación de base, como se menciona, por ejemplo. @ weasel5i2 y @Obsidian. Yo recomendaría el uso de SVG en lugar de GIF, sin embargo, es mejor tanto para el rendimiento como para la nitidez de sus símbolos.

El siguiente código es el base64 para la versión SVG del ícono:

/* size: 0.9kb */ url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48IURPQ1RZUEUgc3ZnIFBVQkxJQyAiLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4iICJodHRwOi8vd3d3LnczLm9yZy9HcmFwaGljcy9TVkcvMS4xL0RURC9zdmcxMS5kdGQiPjxzdmcgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iMTYiIGhlaWdodD0iMjgiIHZpZXdCb3g9IjAgMCAxNiAyOCI+PGcgaWQ9Imljb21vb24taWdub3JlIj48L2c+PHBhdGggZD0iTTE2IDE3cTAgMC40MDYtMC4yOTcgMC43MDNsLTcgN3EtMC4yOTcgMC4yOTctMC43MDMgMC4yOTd0LTAuNzAzLTAuMjk3bC03LTdxLTAuMjk3LTAuMjk3LTAuMjk3LTAuNzAzdDAuMjk3LTAuNzAzIDAuNzAzLTAuMjk3aDE0cTAuNDA2IDAgMC43MDMgMC4yOTd0MC4yOTcgMC43MDN6TTE2IDExcTAgMC40MDYtMC4yOTcgMC43MDN0LTAuNzAzIDAuMjk3aC0xNHEtMC40MDYgMC0wLjcwMy0wLjI5N3QtMC4yOTctMC43MDMgMC4yOTctMC43MDNsNy03cTAuMjk3LTAuMjk3IDAuNzAzLTAuMjk3dDAuNzAzIDAuMjk3bDcgN3EwLjI5NyAwLjI5NyAwLjI5NyAwLjcwM3oiIGZpbGw9IiMwMDAwMDAiPjwvcGF0aD48L3N2Zz4=

Cuándo usar imágenes de fondo o fuentes

Para muchos casos de uso, las imágenes de fondo basadas en SVG y las fuentes de iconos son en gran medida equivalentes en cuanto a rendimiento y flexibilidad. Para decidir cuál elegir, considere las siguientes diferencias:

Imágenes SVG

  • Pueden tener múltiples colores
  • Pueden incrustar su propio CSS y / o ser diseñados por el documento HTML
  • Se pueden cargar como un archivo separado, incrustado en CSS Y incrustado en HTML
  • Cada símbolo está representado por código XML o código base64. No puede usar el carácter directamente dentro de su editor de código o usar una entidad HTML
  • Los usos múltiples del mismo símbolo implican la duplicación del símbolo cuando el código XML está incrustado en el HTML. La duplicación no es necesaria al incrustar el archivo en el CSS o cargarlo como un archivo separado
  • No puede usar las reglas de estilo de color , font-size , line-height , background-color u otras relacionadas con la fuente para cambiar la visualización de su icono, pero puede hacer referencia individualmente a diferentes componentes del icono como formas.
  • Necesita algún conocimiento de la codificación SVG y / o base64
  • Limitado o sin soporte en versiones anteriores de IE

Fuentes de icono

  • Un ícono solo puede tener un color de relleno, un color de fondo, etc.
  • Un ícono puede estar incrustado en CSS o HTML. En HTML, puede usar el personaje directamente o usar una entidad HTML para representarlo.
  • Algunos símbolos se pueden mostrar sin el uso de un webfont. La mayoría de los símbolos no pueden.
  • Los usos múltiples del mismo símbolo implican la duplicación del símbolo cuando su personaje está incrustado en el HTML. La duplicación no es necesaria cuando se incrusta el archivo en el CSS.
  • Puede usar las reglas de estilo de color , font-size , line-height , background-color u otras relacionadas con la fuente para cambiar la visualización de su icono
  • No necesitas ningún conocimiento técnico especial
  • Soporte en todos los principales navegadores, incluidas las versiones anteriores de IE

Personalmente, recomendaría el uso de imágenes de fondo solo cuando necesite colores múltiples y ese color no se puede lograr por medio de color , color background-color y otras reglas de CSS relacionadas con el color para las fuentes.

El principal beneficio de usar imágenes SVG es que puedes darle a los diferentes componentes de un símbolo su propio estilo. Si incrusta su código SVG XML en el documento HTML, esto es muy similar al estilo del HTML. Sin embargo, esto daría como resultado una página web que utiliza tanto etiquetas HTML como etiquetas SVG, lo que podría reducir significativamente la legibilidad de una página web. También agrega un exceso de hinchazón si el símbolo se repite en varias páginas y debe tener en cuenta que las versiones antiguas de IE no tienen soporte o son limitadas para SVG.

Los triángulos negros grandes y pequeños que miran hacia las 4 direcciones se pueden representar así:

&#x25B2; ▲

&#x25B4; ▴

&#x25B6; ▶

&#x25B8; ▸

&#x25BA; ►

&#x25BC; ▼

&#x25BE; ▾

&#x25C0; ◀

&#x25C2; ◂

&#x25C4; ◄

No necesita usar códigos de caracteres; solo usa UTF-8 y ponlos literalmente; al igual que:

▲▼

Si absolutamente debe usar los entites, son & # x25b2; y & # x25bc ;, respectivamente.

&#9650; es el triángulo negro apuntando hacia arriba (▲) de Unicode mientras &#9660; es el triángulo negro que apunta hacia abajo (▼).

Simplemente puede conectar los caracteres (copiados de la web) en este sitio para una búsqueda.