CSS에서 Max-Font-Size는 어떻게합니까?

CSS에는 최대 폰트 크기가 없으므로 그 라인을 따라 무언가를하는 것이 필요하다면 까다로워 야합니다.

왜 전혀 필요합니까? 글쎄, 글꼴 크기 자체는 역동적 인 방식으로 설정할 수 있습니다. 예를 들어, 글꼴 크기 : 10VW;. 이는 "뷰포트 장치"를 사용하여 유형의 크기를 사용하여 브라우저 창의 크기에 따라 점점 커지고 있습니다. 우리가 최대 필 크기의 크기를 가지고 있다면, 우리는 그것이 얼마나 큰지를 제한 할 수 있습니다 (마찬가지로 Min-font-size의 다른 방향).

한 가지 해결책은 글꼴 크기를 비 관계형 장치로 설정하는 특정 화면 크기 중단 점에서 미디어 쿼리를 사용하는 것입니다.

 몸 {
  글꼴 크기 : 3VW;
}
@Media 화면 및 (min-width : 1600px) {
  몸 {
     글꼴 크기 : 30px;
  }
}

CSS 잠금 장치라는 개념이 여기에서 더 열렬 해지고 최소값과 최대 사이의 값을 천천히 스케일링합니다. 우리는 그것을 다루었습니다. 마치…

 몸 {
  글꼴 크기 : 16px;
}
@Media 화면 및 (min-width : 320px) {
  몸 {
    글꼴 크기 : calc (16px 6 * ((100vw -320px) / 680));
  }
}
@Media 화면 및 (min-width : 1000px) {
  몸 {
    글꼴 크기 : 22px;
  }
}

우리는 또한 그것이 얼마나 간단한 지 (또는 얻을 것) 방법을 다루었습니다.

CSS에는 max () 함수가 있으므로 위의 예제는 하나의 라이너가됩니다.

 글꼴 크기 : MAX (30VW, 30px);

또는 최소와 최대로 두 배로 늘리십시오.

 글꼴 크기 : Min (max (16px, 4VW), 22px);

다음과 동일합니다.

 글꼴 크기 : 클램프 (16px, 4VW, 22px);

이 기능에 대한 브라우저 호환성은이 글을 쓰는 것처럼 매우 드문 일이지만 Chrome은 현재 가지고 있습니다. 거기에 도착하지만 지금 필요하다면이 기사의 첫 번째 옵션을 살펴보십시오.

이제 우리는 이러한 기능을 가지고 있으므로 기능이 거의 더 명확하기 때문에 CSS에서 최소-폰트 크기 및 최대 폰트 크기를 얻을 것 같지 않습니다.

위 내용은 CSS에서 Max-Font-Size는 어떻게합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!