2008/04/06 23:26
웹 접근성을 위한 CSS(1) HCI & UX2008/04/06 23:26
글씨크기
- 픽셀단위를 지정했을 경우의 장점
- 어떤 브라우저나 장치든 동일한 크기의 폰트를 볼 수 있다.
- MS 브라우저 외의 다른 장치에서는 px로 지정된 글자 크기를 조절할 수 있음.
- CSS에서 font-size를 지정하는 4가지 방법
- 상대갑과 절대값을 이용
- 상대값
- em: 상위 엘리먼트에 지정된 글씨 크기에 상대적
- ex: 지정된 글꼴의 x의 높이에 상대적
- px: 특정 장치의 해상도에 상대적(가장 일반적인 단위)
- 절대값
- in: 인치
- cm: 센티미터
- mm: 밀리미터
- pt: 포인트
- pc: 피카
- 상대크기(상위엘리먼트의 현재 크기에 따라 결정됨)
- larger:
- smaller
- 퍼센트값
- 상위 엘리먼트에 지정된 글씨 크기에 상대적인 크기로 지정됨
- 절대크기 키워드(브라우저나 장치에서 결정하는 글씨 크기의 집합)
- 각 키워드간의 비율을 1.5배로할 것을 권고(W3C)
- xx-small
- x-small
- small
- medium
- large
- x-large
- xx-large
- 표현 문법이 간단함(장점)
- lagrge > medium(1.5배), small < medium(1.5배)
- 윈도우용 IE5를 위한 핵
- body {
- font-size: x-small; /* IE5 적용 */
- voice-family: "\"}\"";
- voice-family: inherit;
- font-size: small /* 일반브라우저 적용 */
- }
- html>body {
- font-size: small; /* 오페라 적용 */
- }
- 단순화된 박스모델 핵(http://www.info.com/ph/~etan/w3pantheon/style/modifiedsbmh.html)
- 에드워드슨 탠이 개발
- body{
- font-size: small;
- }
- * html body{
- font-size: x-small; /* IE 전용 */
- f\ont-size: small; /* 기타브라우저 */
- }
- 기본 글씨 크기 지정
- <body> 엘리먼트에 기본 글씨 크기를 지정한다.
- 글씨 크기값을 정확하게 잡아가기
- <div>를 이용하여 키워드값을 조절한다.
'HCI & UX' 카테고리의 다른 글
| User Experience Architecture (4) | 2008/06/23 |
|---|---|
| Remix08 Beyond RIA (0) | 2008/06/07 |
| User Experience란? (0) | 2008/06/04 |
| Rich Internet Applications (0) | 2008/05/05 |
| Scott Guthrie가 발하는 Silverlight2의 RIA(Rich Internet Application) (0) | 2008/04/27 |
| 웹 접근성을 위한 CSS(1) (0) | 2008/04/06 |
TAG css
