Pregunta

Actualmente estoy implementando el diseño de respuesta en un sitio Intranet.Añadimos enlaces lisos en la página maestra en función de las propiedades de medios de ancho Min-Anch y Max-Width.Funciona como un encanto, pero no lo hizo cuando intenté usar cssregistration.Por alguna razón desconocida, el CSSRegistration no tiene una propiedad multimedia (que estoy al tanto).¿Hay alguna forma de superar este problema utilizando CSSRegistration en lugar de enlaces HTML liso?

<!-- Responsive CSS-files based on width -->
<link type="text/css" rel="stylesheet" media="only screen and (min-width: 801px)" href="/Style%20Library/css/ResponsiveMaster.css" />
<link type="text/css" rel="stylesheet" media="only screen and (min-width: 401px) and (max-width: 800px)" href="/Style%20Library/css/ResponsiveMasterPad.css" />
<link type="text/css" rel="stylesheet" media="only screen and (max-width: 400px)" href="/Style%20Library/css/ResponsiveMasterMobile.css" />

Si lo intento, obtengo una pantalla bien conocida:

ingrese la descripción de la imagen aquí

¿Fue útil?

Solución

As you say, there is no media attribute.

There are a couple of ways I can think of to handle this in SharePoint:

  • Either use Device Channels to target different master pages to different devices
  • Or, add all of your responsive CSS to one file, containing the @media wrappers. This will also be better since if you for example resize your browser window, you get the appropriate css as you go.
  • A third way that comes to mind is using a combination of @media and @import tags in one CSS-file, loading in specific files with the @import into the @media attribute
Licenciado bajo: CC-BY-SA con atribución
scroll top