이용 상황

묘사 방법

장치 너비로 적용된 CSS를 CSS 파일에 직접 쓰기

@media screen and (min-width:横幅サイズ) {
  ."クラス名"{
  }
}

/* 記述例 */
@media screen and (min-width:480px) and (max-width:768px) {
  .sample{
  /* ここに適用したいCSSを記載 */
  }
}

장치 너비로 로드된 CSS 변경

<link rel="stylesheet" href="style.css" media="screen and (max-width:横幅サイズ)">

<!-- 記述例 -->
<link rel="stylesheet" href="style.css" media="screen and (max-width:1040px)">

Tips

/*縦向き*/
@media screen and (orientation:portrait){
  .sample{
  }  
}

/*横向き*/
@media screen and (orientation:landscape){
  .sample{
  }  
}

장치 크기 표준