hanging-punctuation속성은 웹 디자이너가 웹에서 타이포그래피를 세밀하게 제어 할 수 있도록하는 것을 목표로합니다.
교수형 구두점 뒤에 아이디어는 읽기 흐름을 유지하기 위해 상자의”외부”텍스트 요소의 시작부터(또는 끝에 더 적은 확장까지)일부 구두점 문자를 넣는 것입니다.
기본적으로 따옴표,글 머리 기호 또는 왼쪽(또는 오른쪽rtl모드)으로 약간 이동하여 첫 글자가 나머지 문서에 올바르게 정렬되도록합니다.
구문
hanging-punctuation: none | || last ]blockquote p { hanging-punctuation: first;} none
어떤 문자가 중단되지 않습니다. 이 속성의 기본값입니다.
first
요소의 첫 번째 서식이 지정된 줄 시작 부분에 있는 사용 가능한 문자가 중단됩니다.
last
요소의 마지막 서식이 지정된 줄 끝에 있는 사용 가능한 문자가 중단됩니다.
force-end
줄 끝에 있는 중지 또는 쉼표가 중단됩니다.
구두점은 끊기 위하여 강제되고 정당화를 위한 선을 측정할 때 고려되지 않는다.
allow-end
행 끝에 있는 중지 또는 쉼표가 정렬 이전에 맞지 않으면 중단됩니다.
에 대 한 첫 번째 줄의 끝에 구두점 매달려 없이 적합 하기 때문에 중단 되지 않습니다. 그러나 두 번째 줄에는 충분한 공간이 없으므로 중단됩니다.
사용 가능한 문자
| 코드 | 문자 | 이름 |
|---|---|---|
U+002C |
, | 쉼표 |
U+002E |
. | 마침표 |
U+060C |
، | 아랍어 쉼표 |
U+06D4 |
۔ | 아랍어 마침표 |
U+3001 |
、 | 표의 문자 쉼표 |
U+3002 |
。 | 표의 문자 전체 중지 |
U+FF0C |
， | 전각 쉼표 |
U+FF0E |
． | 전각 마침표 |
U+FE50 |
﹐ | 작은 쉼표 |
U+FE51 |
﹑ | 작은 표의 문자 쉼표 |
U+FE52 |
﹒ | 작은 마침표 |
U+FF61 |
｡ | 반각 표의 문자 전체 중지 |
U+FF64 |
､ | 반각 표의 문자 쉼표 |
사용자 에이전트는 이 목록에 문자를 추가할 수 있습니다. 사양 인용:
는 적절한 다른 문자를 포함할 수 있다.
관련 속성
text-indenttext-align
기타 리소스
-
hanging-punctuation
브라우저 지원
이 브라우저 지원 데이터는 캐니 사용,더 자세히 설명합니다. 숫자는 브라우저가 해당 버전 이상에서 기능을 지원한다는 것을 나타냅니다.
데스크톱
| 크롬 | Firefox | IE | 엣지 | 사파리 |
|---|---|---|---|---|
| No | No | No | No | 10 |
모바일/태블릿
| 안드로이드롬 | 안드로이드 Firefox | 안드로이드 | Safari iOS |
|---|---|---|---|
| No | No | No | 10.0-10.2 |
지원되지 않는 브라우저에 대한 적절한 대체는 음수 텍스트 들여 쓰기를 사용하는 것입니다:
blockquote p { text-indent: -0.5em; /* Change according to your font */}글머리 기호 목록의 경우 글머리 기호 위치가outside로 설정되어 있고 컨테이너의 오버플로가hidden로 설정되어 있지 않은지 확인할 수 있습니다.