Programming/HTML CSS
다음 CSS 코드(code)는 표시할 내용이 현재 화면보다 큰 경우 '동해물과 백두산...' 처럼 ...으로 글자를 생략하도록 합니다. white-space, overflow, text-overflow 이 세개의 속성에 주목하십시오.
#main_div {
   width: 150px;
   
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
}
▶CSS
<div id="main_div">
  Military Grid Reference System (MGRS) coordinates may be displayed at the bottom of the A-G Mode page on a black background.
</div>
▶HTML

'Programming > HTML CSS' 카테고리의 다른 글

[CSS3] 스프라이트 이미지(sprite image) 활용  (0) 2013.08.29
[CSS3] 고정바(bar) 생성  (1) 2013.08.27
[CSS3] 글자 생략하기  (0) 2013.08.21
[HTML] viewport meta  (0) 2013.08.20
[CSS] 웹폰트(Web font)  (0) 2013.08.19
[CSS3] 초기화 코드 사이트  (0) 2013.07.01
0 0