문제

현재 인트라넷 사이트에서 응답 성을 구현하고 있습니다.최소 너비와 최대 너비 미디어 속성을 기반으로 마스터 페이지에 일반 링크를 추가했습니다.그것은 매력처럼 작동하지만, CSSRegistration을 사용하려고 시도 할 때는 그렇지 않았습니다.일부 알려지지 않은 이유로 CSSRegistration에는 미디어 속성이 없습니다 (내가 알고 있음).일반 HTML 링크 대신 CSSRegistration을 사용 하여이 문제를 극복하는 방법이 있습니까?

<!-- 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" />
.

시도하면 잘 알려진 화면을 얻을 수 있습니다.

여기에 이미지 설명

도움이 되었습니까?

해결책

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
라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 sharepoint.stackexchange
scroll top