GaramX

이 문서는 읽기 전용입니다. 원본을 볼 수는 있지만 바꿀 수는 없습니다. 문제가 있다고 생각하면 관리자에게 문의하세요.

==== cascading 적용순서 ====
  - !important
  - style attrribute
  - id selector
    * notation : #[id_name]
  - class selector
    * syntax : .[class_name]
  - tag selector
    * syntax : [tag name] [tag name2]

  * <code html>a:link { color: red; }
a:visited { color: purple }</code>
  * 바로 뒤에 있는 Element만 선택 <code html>ul + p {
  color: red;
}</code>
  * 후계 직계 자식만 선택 <code html>
div#container > ul {
  border: 1px solid black;
}</code>

==== font-size ====
  * px
  * em
  * rem

==== Ellipsis ====
통영의...
<code html>
<div class="txt_line">통영의 신흥보물 강구안의 동쪽벼랑인 동피랑의 벽화마을을 다녀왔다</div>
<style>
.txt_line { 
 width:70px;
 padding:0 5px;
 overflow:hidden;
 text-overflow:ellipsis;
 white-space:nowrap; 
} 
</style>
</code>
Block레벨 테그에서만 적용됨
  * .overflow:hidden : 넓이가 70px를 넒어서는 내용에 대해서는 보이지 않게 처리함
  * text-overflow:ellipsis : 글자가 넓이 70px를 넘을 경우 생략부호를 표시함
  * white-space:nowrap : 공백문자가 있는 경우 줄바꿈하지 않고 한줄로 나오게 처리함 (\A로 줄바꿈가능)

GaramX

사용자 도구

사이트 도구

문서 도구