본문 바로가기

css340

7.3 줄 바꿈(Line Breaking)과 단어 내 줄 바꿈(Word Boundaries) 7.3 줄 바꿈(Line Breaking)과 단어 내 줄 바꿈(Word Boundaries) 인라인 수준의 문장은 라인 단위로 나타내지게 됩니다. 한 라인 박스 단위로 끊어지게 됩니다. 문장이 한 라인을 넘지 않을 정도로 짧으면 줄 바꿈(Line Breaking)은 일어나지 않습니다. 하지만 반대로 한 라인을 넘을 경우는 줄 바꿈이 발생하게 되는데 보통 한 라인 박스 끝이나 시작에서 혹은 강제적인 줄 바꿈 동작을 통해 줄 바꿈이 발생하게 됩니다. 이러한 줄 바꿈은 line-break 속성을 이용하여 설정할 수 있으며 긴 문장 안에 포함된 단어의 중간에 줄 바꿈을 해야 할 경우에는 word-break 속성을 이용할 수 있습니다. 7.3.1 line-break 속성을 이용한 줄 바꾸기 line-break 속.. 2013. 8. 4.
7. 텍스트(Text) 7. 텍스트(Text) CSS3에서 HTML 요소의 내용(content)에 해당하는 부분에 오는 텍스트에 적용할 수 있는 다양한 속성들에 대해서 표준화가 진행중입니다. 현재 CSS3에 대한 최신 버전은 “http://www.w3.org/TR/css3-text/”에서 확인할 수 있으며 2012년 8월 14일날 개정되었으며 여기에는 텍스트에 대한 간단한 대소문자 변형(Tranforming)부터 시작해서 긴 텍스트에 대한 줄 바꿈, 공백은 어떻게 처리할 수 있는지 명시하고 있습니다. 또한 기본적인 정렬이나 텍스트에 밑줄을 긋거나 그림자 효과 같은 재미난 속성들도 이용할 수 있습니다. 가장 기본적인 대소문자 변형부터 알아봅니다. 7.1 대소문자로 변형(Transforming)하기 text-transform 속성.. 2013. 8. 4.
6.5 font-size 속성을 이용하여 글자의 크기를 설정하기 6.5 font-size 속성을 이용하여 글자의 크기를 설정하기 font-size 속성은 글자의 크기를 설정하는데 사용하는 속성으로 다음과 같은 형식을 사용합니다. font-size : 속성값; 대개 “medium”을 기본 속성값으로 사용하며 부모 요소로부터 상속받는 형태인 “inherit”와 “절대 크기”, “상대적 크기”, 그리고 우리가 많이 보아온 15pt, 15px, 15cm 등과 같이 고정된 값을 사용할 수 있으며 마지막으로 부모 요소의 font-size를 기준으로 이를 퍼센트(percentage) 형태로 적용하여 속성값을 설정할 수 있습니다. 예제를 다루기에 앞서 “상대적 크기” 값으로 올 수 있는 값은 가장 작은 크기인 “xx-small”부터 중간 크기인 “medium” 그리고 가장 큰 크기.. 2013. 8. 4.
6.3 font-stretch 속성을 이용한 글자를 좁게 넓게 나타내기 6.3 font-stretch 속성을 이용한 글자를 좁게 넓게 나타내기 font-stretch 속성은 글자를 좁게(narrow) 혹은 넓게(wide)하게 설정하는 속성, 즉 글자의 폭(너비)에 대해서 설정하는 속성으로 다음과 같은 형식을 사용합니다. font-stretch : 속성값; 속성값으로는 기본적으로 “normal”을 사용하며 상속되는 형태인 “inherit”, 가장 폭이 좁은 “ultra-condensed”부터 “extra-condensed”, “condensed”, “semi-condensed”, “semi-expanded”, “expanded”, “extra-expanded”, 가장 폭이 넓은“ultra-expanded”의 값을 가질 수 있습니다. 메모장으로 방금 전 사용한 font-weig.. 2013. 8. 4.

티스토리툴바