WordPress 반응형 테마/템플릿을 만드는 방법은 무엇입니까?
이 시대에 WordPress를 사용하여 웹 사이트를 구축하지 않은 사람들은 감히 웹 사이트를 구축했다고 말할 수 없습니다. 워드프레스란 무엇인가요? WordPress는 WP라고도 하는 세계에서 가장 유명한 웹사이트 콘텐츠 관리 시스템(또는 블로그/블로그 시스템)입니다. 관련 조사에 따르면 WordPress의 글로벌 시장 점유율은 2015년에 48%에 달했으며 계속해서 글로벌 오픈 소스 웹 웹 사이트 시스템 챔피언의 자리를 지키고 있습니다. 그리고 지금도 급속히 성장하고 있는데... 국내 오픈소스 CMS를 보면 제대로 살아남아 최신을 유지하고 있는 것은 소수에 불과하다. 한때 강력했던 Dongyi, dedecms, phpcms, Empirecms, phpwind, discuz 등이 여전히 살아남을 수 있을까요?
도구/재료
HTML5
CSS3
Chrome, Firefox, Edge 등과 같은 최신 브라우저
관련 권장 사항: "WordPress Tutorial"
방법/단계
1 . 단순 즉, 웹 페이지 헤드(
) 사이에 다음 쿼리 코드를 추가합니다.<meta name="viewport" content="width=device-width, initial-scale=1.0" />
2 그런 다음 다음과 같은 미디어 쿼리 요소를 CSS 파일에 추가합니다.
@media screen and (max-width:480px) { //当浏览器屏幕小于480px时,此代码块生效 } @media screen and (min-width:481px) and (max-width:720px) { //当浏览器屏幕大于480px小于720px时,此代码块生效 } @media screen and (min-width:721px) and (max-width:1079px) { //当浏览器屏幕大于721px小于1079px时,此代码块生效 }
Notes
디자인 과정에서 CSS의 너비와 높이를 고정하는 것을 피하고, 대신 백분율을 사용하고, 글꼴은 px 대신 rem을 사용하세요.위 내용은 WordPress를 반응형으로 만드는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!