HTML에서 Chrome 지원 텍스트를 12px보다 작게 만드는 방법은 무엇입니까?-JS 튜토리얼-php.cn

집

웹 프론트엔드

JS 튜토리얼

HTML에서 Chrome 지원 텍스트를 12px보다 작게 만드는 방법은 무엇입니까?

韦小宝

Nov 29, 2017 am 10:56 AM

chrome html 미만

designer사진의 텍스트가 10px인 경우 웹페이지에 구현해 드립니다. 종종 디자이너들이 우리에게 와서 이 글꼴을 더 작게 할 수 있는지 묻습니다. 제가 디자인한 것은 10px 인가요? 왜 12px인가요? 사실 우리 모두는 Chrome의 최소 글꼴 크기가 12px라는 것을 알고 있습니다. 8px 또는 10px로 설정해도 브라우저에는 12px만 표시됩니다. . 그렇다면 이 부정 행위 문제를 해결하는 방법은 무엇입니까? 해결 방법을 살펴보겠습니다!

저희 접근 방식은 다음과 같습니다.

Google Chrome 커널의 경우 웹킷 접두사를 추가하고 변환:scale() 속성을 사용하여 확장하세요!

코드 데모:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style type="text/css">
			span{
				font-size: 12px;
				display: inline-block;
				-webkit-transform:scale(0.8);
			}
		</style>
	</head>
	<body>
		<span>测试10px</span>
	</body>
</html>

로그인 후 복사

위는 HTML에서 Chrome 지원 텍스트를 12px보다 작게 만드는 방법입니다. 모든 내용을 보려면 이 사이트검색으로 이동하세요!

관련 권장 사항:

HTML 웹 페이지를 최적화하는 방법

CSS 스크롤 막대 스타일은 IE8 및 Chrome 브라우저와 어떻게 호환되나요?

HTML에서 텍스트 마지막 줄이 불완전하게 표시되는 문제를 해결하는 방법

위 내용은 HTML에서 Chrome 지원 텍스트를 12px보다 작게 만드는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

본 웹사이트의 성명

본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.