슬래시가있는 CSS의 글꼴 크기


133

슬래시의 의미는 다음과 같습니다.

font: 100%/120%;

4
font-size슬래시를 허용하지 않습니다. 올바른 속성은 font입니다.
BoltClock

이건 어때? 배경 : "RGBA (0, 0, 0, 0) 없음 반복 스크롤 0 % 0 % / 자동 패딩 박스 경계 박스"
jerinho.com

답변:


196

이것은 실제로 두 가지 속성을 설정하며 다음과 같습니다.

font-size: 100%;
line-height: 120%;

공식 문서 를 인용하려면 :

이 속성의 구문은 글꼴과 관련된 여러 속성을 설정하기 위해 전통적인 인쇄상의 속기 표기법을 기반으로합니다.

David M은 주석에서 말했듯이 서체 크기를 " x  pt on y  pt" 로 지정하여 조판 크기를 선 높이에 표시하는 조판 전통을 반영합니다 .

그러나 귀하의 질문에있는 예제는 실제로 잘못되어 브라우저에서 무시됩니다.이 두 속성을 font속기 표기법 만 결합 할 수 있으며 적어도 글꼴 크기와 패밀리를 모두 지정 해야합니다 . font: 100%/120%;그러므로 글쓰기 만으로는 충분하지 않습니다. 그래도 일반 패밀리 이름을 추가하여 유효하게 만들 수 있습니다. 예 :

font: 100%/120% serif;

53
예를 들어 "10pt on 12pt"또는 "10pt / 12pt"와 같이 글꼴을 설정 한 오래된 조판 설정 구문을 반영합니다.
David M

1
나는 실제로 이것을 꽤 많이 사용합니다. 내가 작업하는 디자이너는 항상 크기를 예를 들어 "14 over 22"라고합니다. 언젠가 우연히 넣어 작업했을 때 놀랐습니다.
Dylan Lukes

1
요약 :이 형식은 font-family를 지정할 필요도 없습니까? 브라우저가이 속성을 무시하고 있습니다 : font : 12px / 16px; 그러나 이것을 받아들이는 것 : font : 12px / 16px sans-serif; 이 동작은 여기에
kumarharsh

@Harsh 네, 공식 정의font 에서 볼 수 있듯이 속기 속성 에는 가족 (크기와 함께)이 최소한으로 필요합니다 .
Konrad Rudolph

설명 주셔서 감사합니다. 아마도 독자는 SIZE / LINE_HEIGHT 선언 만 작동한다고 가정 할 수 있기 때문에 약간 오도되어 답변 (또는 질문)을 업데이트 할 수 있습니다.
kumarharsh

15

Konrad는 이것을 얻었지만 스타일 시트를 줄이는 데 사용할 수있는 CSS 속기 속성이 많이 있습니다. 당신이 그들을 모른다면 그들 중 일부는 조금 비밀스러워 보입니다.


그러나 대부분의 속기는 관련 스타일 속성을 다룹니다 (예 :) border-*. 다윗은 나의 대답에 대한 주석에서 좋은 설명을했습니다. 속기는 비밀 스럽습니다 : 확실히 사실이지만 너무나 유용하고 배우기 쉽습니다.
Konrad Rudolph
당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.