본문 바로가기

분류 전체보기

 (239)
Vertical-Align Vertical-Align 개요 : 이 속성은 요소의 베이스라인을 행 높이를 기준으로 수직 정렬한다. 정의 vertical - align 설명 값 baseline | sub | super | top | text-top | middle | bottom | text-bottom | | | inherit 기본값 baseline 적용대상 인라인 요소와 테이블 셀 요소 상속 안됨 백분율 자신의 line-height 를 참조 미디어 visual 값 값 설명 길이를 지정한다. '0'은 'baseline'과 같다 백분율(%)값을 지정한다. 'line-height'를 기준으로 계산되며, '0(%)'는 'baseline' 과 같다. baseline 기준선에 정렬하도록 지정한다. middle 가운데 정렬하도록 지정한다. s..
Word-Spacing Word-Spacing 개요 : 이 속성은 요소에 포함된 단어 사이의 공백의 크기(단어간/어간)를 지정한다. 단어란 공백문자(white space)에 둘러싸인 문자열을 의미한다. (예: "word spacing"의 단어는 "word"와 "spacing" 2개며, "word-spacing"의 단어는 "word-spacing" 1개다.) 공백문자의 출력 방식은 white-space 속성으로 지정할 수 있다. 정의 word-spacing 설명 값 normal | | inherit 기본값 normal 적용대상 모든 요소 상속 됨 백분율 사용 불가 미디어 visual 값 값 설명 normal 기본 간격을 지정한다. 길이를 지정한다. 이 길이는 단어 사이의 간격을 추가되며, 글자를 양쪽정렬(justify) 하려면 ..
Letter-Spacing Letter-Spacing 개요 : 이 속성은 요소의 글자 사이의 공백의 크기(자간)를 지정한다. 글자나 단어 사이의 공백도 하나의 글자로 보기에, "나는 너를"에선 "나,는, ,너,를" 5개의 글자에 사이의 공백에 영향을 준다. 음수 길이값을 지정할 수 있으나, 텍스트를 인식하는데 장애를 줄 수 있기 때문에 사용에 신중해야 한다. 정의 letter-spacing 설명 값 normal | | inherit 기본값 normal 적용대상 모든 요소 상속 됨 백분율 사용 불가 미디어 visual 값 값 설명 normal 기본 간격을 지정한다. 길이를 지정한다. 이 길이는 글자 사이의 간격에 추가되며, 글자를 양쪽정렬(justify)하려면 크기를 지정할 수 없다. inherit 부모 요소의 값을 상속하도록 지정..
Text-Decoration Text-Decoration 개요 : 이 속성은 요소의 글자에 밑줄(underline)이나 윗줄(overline), 취소선(line-through) 등의 꾸밈을 지정합니다. 줄을 그어 꾸미는 효과는 글자를 읽기 어렵게 할 수 있습니다. 영어와 달리, 한글은 글자가 밑줄과 윗줄과 겹칠 수 있기 때문입니다. "잘"이라는 글자를 예를 들면, 자음 "ㅈ"과 윗줄(overline)이 겹치고, 받침글자 "ㄹ"과 밑줄이 겹칩니다. 또한, 취소선(line-through)은 del 태그를 사용하는 게 바람직합니다. 정의 text-decoration 설명 값 none | [underline || overline || line-through || blink ] | inherit 기본값 none 적용대상 모든 요소 상속 안됨..
Text-TransForm Text-TransForm 개요 : 이 속성은 요소 글자의 대/소문자를 전환한다. 대문자를 소문자로 변경하거나, 소문자를 대문자로 변경할 수 있고, 단어의 첫 글자만 대문자로 변경할 수 있다. 물론, 대소문자 구분이 없는 한글엔 사용할 수 없다. 정의 text-transform 설명 값 capitalize | uppercase | lowercase | none | inherit 기본값 none 적용대상 모든 요소 상속 됨 백분율 사용 불가 미디어 visual 값 값 설명 capitalize 단어의 첫번째 글자를 대문자로 지정한다. uppercase 단어의 모든 글자를 대문자로 지정한다. lowercase 단어의 모든 글자를 소문자로 지정한다. none 정상적으로 지정한다. 대/소문자 변형을 지정하지 않는..
Text-Shadow Text-Shadow 개요 : 이 속성은 요소의 글자에 그림자 효과를 지정한다. 글자의 그림자는 화면의 배치에 영향을 주지 않는다. 정의 text-shadow 설명 값 none | [ || ?,]* [ || ?] | inherit 기본값 none 적용대상 모든 요소 상속 안됨 백분율 사용 불가 미디어 visual 값 값 설명 그림자 색상을 지정한다. 그림자 크기나 간격(offset) 지정한다. inherit 부모 요소의 값을 상속 하도록 지정한다. 그림자 효과를 쉼표(,)로 분리해서 여러번 지정 할 수 있다. 그림자 효과의 크기는 박스의 크기를 벗어날 수 있으나, 배치에 영향을 주지 않는다. 두개의 는 각각 수평(x축) 거리와 수직(y축) 간격을 지정한다. 세개의 는 각각 수평(x축) 거리와 수직(y축)..
Direction Direction 개요 : 이 속성은 요소가 위치할 가로 방향를 지정한다. 글자나 이미지와 같은 인라인 요소 뿐만 아니라, 테이블 셀 요소의 방향도 지정할 수 있다. 정의 direction 설명 값 ltr | rtl | inherit 기본값 ltr 적용대상 모든 요소 상속 됨 백분율 사용 불가 미디어 visual 값 값 설명 ltr 왼쪽에서 오른쪽으로(left-to-right) 지정한다. rtl 오른쪽에서 왼쪽으로(right-to-left) 지정한다. inherit 부모 요소의 값을 상속하도록 지정한다. -----------------------------------------------------------------------------------------------------------------..
Color Color 개요 : 이 속성은 요소의 색상(전경색)을 지정한다. 요소에 포함된 글자 색상을 지정하며, border-color 에게 상속된다. 정의 color 설명 값 | inherit 기본값 화면 표시 장치의 기본 스타일 참조 적용대상 모든 요소 상속 됨 백분율 사용 불가 미디어 visual 값 값 설명 색상을 지정한다. inherit 부모 요소의 값을 상속하도록 한다. 예제 View Source : 문단의 글자색을 빨강으로 지정한다. 문단의 글자색을 녹색으로 지정한다.

티스토리툴바