본문 바로가기

Programing/CSS37

글자 간격 조절 (letter-spacing, word-spacing) 두 스타일 속성의 차이 letter-spacing : 글자와 글자 사이를 조절 (자간) word-spacing : 단어와 단어 사이를 조절 보통은 letter-spacing으로 자간을 조절한다. letter-spacing의 속성값 px, em 같은 단위 또는 % 자간조절테스트 출처 : 웹 표준의 정석 (고경희 저) Programing/CSS 2024. 2. 26.
텍스트의 대소문자를 변환 (text-transform) 한글에는 적용 안 된다. 영어를 대소문자 또는 전각 문자로 변환한다. 속성값 none : 변환하지 않는다. 기본값. capitalize : 첫 번째 글자를 대문자로 변환 uppercase : 모든 글자를 대문자로 변환 lowercase : 모든 글자를 소문자로 변환 full-width : 가능한 모든 문자를 전각 문자로 변환 출처 : 웹 표준의 정석 (고경희 저) Programing/CSS 2024. 2. 26.
텍스트에 그림자 효과 주기 (text-shadow) 입체감 있는 글자를 표현한다. 속성값 none : 그림자를 없앤다 (지정하지 않았을 때 기본값임.) 가로 거리 : 필수 속성. 양수는 글자의 오른쪽, 음수는 글자의 왼쪽에 그림자를 만든다. 세로 거리 : 필수 속성. 양수는 글자의 아래쪽, 음수는 글자의 위쪽에 그림자를 만든다. 번짐 정도 : 기본값은 0. 양수는 모든 방향으로 번짐, 음수는 모든 방향으로 축소. 색상 : 기본값은 현재 글자 색. ㅎㅎ ㅎㅎ ㅎㅎ 출처 : 웹 표준의 정석 (고경희 저) Programing/CSS 2024. 2. 26.
텍스트 줄 표시/미표시 (text-decoration) 밑줄을 긋거나, 취소선을 표시할 때 사용한다. 하이퍼링크를 생성하면 밑줄이 자동으로 생기는데 이를 없앨 때도 사용한다. 속성값 none : 밑줄 미표시 underline : 밑줄 표시 overline : 윗줄 표시 line-through : 취소선 표시 취소선입니다. 또는 p { text-decoration: line-through; } 출처 : 웹 표준의 정석 (고경희 저) Programing/CSS 2024. 2. 26.
텍스트 정렬 스타일 속성(text-align, text-height) 텍스트 정렬(text-align) 속성값 (지정하지 않으면 왼쪽 정렬이 default) start : 현재 텍스트 줄의 시작 위치에 맞추어 문단 정렬 end : 현재 텍스트 줄의 끝 위치에 맞추어 문단 정렬 left : 왼쪽에 맞추어 문단 정렬 right : 오른쪽에 맞추어 문단 정렬 center : 가운데에 맞추어 문단 정렬 justify : 양쪽에 맞추어 문단 정렬 match-parent : 부모 요소를 따라 문단 정렬 .container { text-align: center; } 줄 간격 조절 (line-height) 속성값 0px; : 줄 간격을 픽셀로 지정 2.0; : 해당 폰트의 배율. 이 경우 2.0배 200% : 해당 폰트의 배율. 이 경우 200%이므로 2.0배 보통 줄 간격은 글자 크기.. Programing/CSS 2024. 2. 26.

티스토리툴바