Estoy trabajando en un sensible sitio donde cada página tendrá un gran héroe de la imagen, que se define en el CMS. Me gustaría evitar tener que descargar la imagen de fondo en los teléfonos móviles.

La única manera que se me ocurre para hacerlo es tener algo de CSS en línea en el head de la página, así:

<style type="text/css">
    @media only screen and (min-width: 680px) {
        .hero-image { background-image: url(../images/image.jpg); }
    }
</style>

Primero, ¿puedo usar media queries en CSS en línea?

Segundo, evitar la descarga de la imagen en los móviles?

Tercero, hay una manera mejor?

Gracias

lo que aquí se describe se llama «interna css», no en línea.
solucionado, era engañosa.
posibles duplicados de ¿Es posible poner CSS @las reglas de medios en línea?

OriginalEl autor GusRuss89 | 2012-10-16

3 Comentarios

  1. 6

    Sí, usted puede utilizar consultas de medios de comunicación en un <style> etiqueta. La imagen es de solo carga si el CSS es preciso, por lo que si no coincide con el selector de no molestar a la carga de la imagen.

    Probablemente sería mejor incluir la consulta de medios de comunicación en su archivo CSS externo, aunque. No hay ninguna razón para incluirlo inlline.

    Gracias. La razón para incluirla en línea es que debe ser la salida de la CMS (habrá un único héroe de la imagen por página).
    He utilizado la forma similar a lograr <pre> background-image: url(«{{ $vía de acceso_recurso }}/fotos/btn_menu_show.png») < pre>

    OriginalEl autor Niet the Dark Absol

  2. 4

    No, parece que no se puede en línea @media etiquetas:

    Por favor refiérase a este:
    Es posible poner CSS @las reglas de medios en línea?

    Aunque la redacción de la pregunta original (al menos a día de hoy) ¿el estado «en línea», el código de OP da muestra de que están haciendo acerca de poner preguntas de los medios internamente, no en línea. Error común, lo hago una vez a la semana. =)

    OriginalEl autor Natalya Hoota

Dejar respuesta

Please enter your comment!
Please enter your name here