블로그 이미지
플로거
Android/J2EE/Web/Spring/Database

calendar

      1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30    

Notice

Statistics Graph
2017.08.16 11:24 Programming/Html 5

CSS3 text-overflow Property


Use of the text-overflow property:

div {
    text-overflow: ellipsis;
}

Definition and Usage

The text-overflow property specifies how overflowed content that is not displayed should be signaled to the user.

Default value:

clip

Inherited:

no

Animatable:

no. Read about animatable

Version:

CSS3le.textOverflow="ellipsis"

JavaScript syntax:

object.style.textOverflow="ellipsis"

CSS Syntax

text-overflow: clip|ellipsis|string|initial|inherit;

Property Values

Value

 Description

 clip

 Default value. Clips the text

 ellipsis

 Render an ellipsis ("...") to represent clipped text

 string

 Render the given string to represent clipped text

 initial

 Sets this property to its default value. 

 inherit

 Inherits this property from its parent element.


Example

<style> 

#div1 {

    white-space: nowrap; 

    width: 12em; 

    overflow: hidden;

    text-overflow: clip; 

    border: 1px solid #000000;

}


#div2 {

    white-space: nowrap; 

    width: 300px; 

    overflow: hidden;

    text-overflow: ellipsis;     

}

</style>


This document refers to W3Schools.com

저작자 표시 비영리 변경 금지
신고

'Programming > Html 5' 카테고리의 다른 글

ellipsis - CSS3 text-overflow Property  (0) 2017.08.16
실전 HTML 5 가이드 - Web Standards Korea  (0) 2010.12.26
posted by 훈즈 플로거