elhacker.net cabecera Bienvenido(a), Visitante. Por favor Ingresar o Registrarse
¿Perdiste tu email de activación?.

 

 


Tema destacado: (TUTORIAL) Aprende a emular Sentinel Dongle By Yapis


+  Foro de elhacker.net
|-+  Programación
| |-+  Desarrollo Web (Moderador: #!drvy)
| | |-+  style content caracter estraño que representa una imagen
0 Usuarios y 1 Visitante están viendo este tema.
Páginas: [1] Ir Abajo Respuesta Imprimir
Autor Tema: style content caracter estraño que representa una imagen  (Leído 1,994 veces)
OssoH


Desconectado Desconectado

Mensajes: 911


Ver Perfil
style content caracter estraño que representa una imagen
« en: 16 Abril 2014, 17:40 pm »

Es algo que he encontrado en varias web y quisiera por curiosidad saber el motivo de porque hacerlo de esta forma y cómo hacerlo.

Por ejemplo : http://www.nethercottconstructions.com/es/modulos-prestashop/15-ajax-desplegables-categorias.html

Si entrais y accedeis por firebus a la imagen del carrito del boton de la derecha de compra. aparece este codigo :

Código:
.box-info-product .exclusive:before {
    border: 1px solid #06B2E6;
    border-radius: 5px 0 0 5px;
    bottom: 0;
    color: #FFFFFF;
    content: "";
    font-family: "FontAwesome";
    font-size: 25px;
    left: 0;
    line-height: 47px;
    position: absolute;
    text-align: center;
    text-shadow: 0 1px #015883;
    top: 0;
    width: 51px;
    z-index: 2;
}

El style content va acompañado de un simbolo raro que hace mostrar la imagen del carrito. ¿esto significa que el jpg de esa imagen no existe en la web? ¿como se logra esto? ¿esta técnica tiene algún nombre? ¿Que sentido tiene hacerlo de esta forma en vez de poner la url de la imagen? 

Gracias.
Un saludo.


En línea

#!drvy
Moderador
***
Desconectado Desconectado

Mensajes: 5.855



Ver Perfil WWW
Re: style content caracter estraño que representa una imagen
« Respuesta #1 en: 16 Abril 2014, 17:50 pm »

Son fuentes.

http://fortawesome.github.io/Font-Awesome/
http://fortawesome.github.io/Font-Awesome/icons/

Tiene muchas ventajas. Ahorras recursos, lo pueden leer dispositivos que no procesan imágenes (lectores), es adaptable (responsive), no tienes que lidiar con las pantallas retina.. etc.

Saludos


« Última modificación: 16 Abril 2014, 17:52 pm por #!drvy » En línea

OssoH


Desconectado Desconectado

Mensajes: 911


Ver Perfil
Re: style content caracter estraño que representa una imagen
« Respuesta #2 en: 16 Abril 2014, 17:59 pm »

Muchas gracias por la aclaración.  ;-) ;-)

Entiendo que la parte negativa de usar este tipo es el hecho de cargar la fuente js y el tiempo de procesarlas.

Es como por ejemplo el hacer uso de fuente de google (u otros). Es más rápido la carga de la web el usar fuentes standars (por ejemplo arial) que usar fuentes comerciales.

Gracias.
En línea

#!drvy
Moderador
***
Desconectado Desconectado

Mensajes: 5.855



Ver Perfil WWW
Re: style content caracter estraño que representa una imagen
« Respuesta #3 en: 16 Abril 2014, 18:05 pm »

Citar
Entiendo que la parte negativa de usar este tipo es el hecho de cargar la fuente js y el tiempo de procesarlas.

No hay ningún JS, solo los archivos de la fuente y el CSS.

Citar
Es como por ejemplo el hacer uso de fuente de google (u otros). Es más rápido la carga de la web el usar fuentes standars (por ejemplo arial) que usar fuentes comerciales.

Si pero el impacto es mínimo (hablamos de mili-segundos) y con un buen cache te sale mejor que hacerlo con imágenes.

Saludos
En línea

OssoH


Desconectado Desconectado

Mensajes: 911


Ver Perfil
Re: style content caracter estraño que representa una imagen
« Respuesta #4 en: 16 Abril 2014, 18:12 pm »

Excelente.
Muchas gracias.

 ;-) ;-) ;-) ;-)
En línea

Páginas: [1] Ir Arriba Respuesta Imprimir 

Ir a:  

WAP2 - Aviso Legal - Powered by SMF 1.1.21 | SMF © 2006-2008, Simple Machines