이 글은 CSS3 한자 및 글꼴과 관련된 속성을 소개합니다. 도움이 필요한 친구들이 참고할 수 있기를 바랍니다.
(1) 함수
은 페이지에 그림자효과 를 추가하세요.
(2) 사용 방법
text-shadow : 길이 길이 길이 색상(텍스트에서 그림자의 가로 거리, 세로 거리, 흐림 반경 그림자, 그림자의 색상 )
참고:
텍스트에서 그림자의 가로 및 세로 거리 # 🎜🎜#: 반드시 지정해야 하며, 음수 값을 지정할 수 있습니다.
그림자의 흐림 반경: 그림자가 바깥쪽으로 흐려질 때의 흐림 범위를 나타냅니다. 반경이 클수록 그림자가 바깥쪽으로 더 넓어집니다. 선택적 매개변수이며 생략할 경우 기본값은 0입니다. 이는 그림자가 바깥쪽으로 흐려지지 않음을 의미합니다.
Shadow color: 선택 매개변수, 지정하지 않으면 색상 속성의 색상이 CSS2에서 사용됩니다(실제 Firefox 및 Opera, 기타에서는 생략을 지원하지 않습니다. 그렇지 않으면 그려지지 않습니다), 브라우저에서 지정한 기본 색상이 CSS3에서 사용됩니다.
(4) 여러 그림자 지정text-shadow:10px 10px #f39800, 40px 35px #fff100, 70px 60px #c0ff00;Chrome, Firefox, Opera 브라우저에서만 이 기능을 지원합니다. (3) 브라우저 지원 현재까지: Safari, Chrome, Firefox 및 Opera 브라우저는 이 속성을 지원합니다. text-shadow: 5px 5px 5px 회색(회색 그림자, 그림자는 가로 및 세로 방향 모두에서 분자를 5픽셀로 유지)
텍스트 자동 줄 바꿈
(2) 값: 일반(브라우저 사용) 기본 래핑 규칙), keep-all(반각 공백이나 하이픈에서만 줄 바꿈 가능), break-all(단어 내 줄 바꿈 허용) (3) 브라우저 지원# 🎜🎜 #지금까지: Safari, Chrome 및 IE 브라우저는 이 속성을 지원합니다.
3 단어 줄 바꿈 속성. (2) 값: 일반(브라우저 기본 처리), break-word(긴 단어 또는 URL 주소 내부의 줄바꿈)
(3) 브라우저 지원: 모든 브라우저.
4개 웹 글꼴 및 @font-face 속성(2) 사용 방법:
@font-face{ font-famliy:WebFont; src:url(‘font/Fontin_Sans_R_45b.otf’) format(“opentype”); font-weitht:normal; } h1{ font-family:WebFont; }
5 글꼴 크기 조정 속성
(2) 사용 방법:
aspect 값(비례 값): 사용할 수 있습니다. 다른 글꼴로 변경할 때 글꼴 크기를 거의 동일하게 유지하십시오. (상수) 계산 방법: x 높이 값(이 글꼴에 쓰여진 소문자 X의 높이(픽셀 단위))를 글꼴 크기로 나눈 값입니다.p{ font-size:16px; font-famliy:Times New Roman; font-size-adjust:0.46(aspect值) }(3) 브라우저의 가로세로 값 계산 방법: font-size-adjust 속성에 가로세로 값을 지정하고 글꼴을 다른 글꼴로 변경한 후 찾아보기 프로세서에 의해 수정된 글꼴 크기의 계산 공식: c = (a / b)sa: 실제로 사용된 글꼴의 가로세로 값을 나타냅니다. b: 수정 전을 나타냅니다. 글꼴의 가로세로 값
s: 지정된 글꼴 크기를 나타냅니다.
, c: 브라우저에 실제로 표시되는 글꼴 크기입니다.(4) 속성 값은 "none"으로 설정할 수 있습니다.
이는 글꼴 크기 조정 속성을 설정하지 않고 원본에 따라 표시하는 것과 같습니다. 글꼴의 크기.6 rem 단위를 사용하여 글꼴 크기 정의
html{font-size:62.5%}(大多数浏览器中,默认字体大小为16个像素,使用62.5%, 使浏览器自动计算出10个像素) small{font-size:1.1rem;} strong{font-size:1.8rem;}
(2) 브라우저 지원: 지금까지: IE9를 포함한 모든 브라우저가 지원됩니다.
(3) IE8 및 이전 버전과 호환됩니다(rem 글꼴 단위는 사용할 수 없습니다)
html{font-size:62.5%} small{font-size:11px;font-size:1.1rem;} strong{font-size:18px;font-size:1.8rem;}
관련 권장 사항:
How CSS3을 사용하려면 선택기는 필요한 콘텐츠를 페이지에 코드와 함께 삽입합니다css3의 변환 속성으로 구현된 네 가지 기능(회전, 크기 조정, 기울이기, 이동)
위 내용은 CSS3의 한자 및 글꼴 관련 속성 소개의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!