table td 에서 긴 문장 ... 표시하기

-> TABLE 태그에서 말줄임 표시하기 

 

table 태그에서 td에 긴 문장을 표시할 경우 width 값을 넘으면 여러줄로 표시된다.

 

이럴 경우 문장을 한줄로 표시하고 지정된 넓이를 넘을 경우 ... 로 표시하고 싶다.

 

아래와 같이 css 를 사용하면 된다. 

 

table { 

border-collapse: collapse; 

border-spacing: 0;

width: 100%; 

table-layout: fixed;

}

 

td { 

 

vertical-align: middle; 

padding:5px;

border: 1px solid #000;

 

overflow:hidden;

white-space : nowrap;

text-overflow: ellipsis;

 

}

 

overflow:hidden 는 설정한 범위를 넘어서는 것들을 표시하지 않겠다는 것이다.

 

white-space : nowrap; 는 범위를 넘어서는 텍스트를 ... 로 표시해준다

 

text-overflow: ellipsis; 는 공백 문자가 있는 경우 줄바꿈을 하지 않고 한 줄로 표시해준다.