일부내용 미리보기

기여·2024년 5월 24일
0

소소한 개발팁

목록 보기
24/103

html) td에 class 지정

<tr align="center">
	<td class="td_etc">etc[컬럼명]</td>
    <생략>
    <td class="td_etc2"> <%=m.getEtc() [긴 내용]%>

css:

.td_etc{
	width: 150px;		
}

/* etc내용 일부 미리보기 */
.td_etc2{
	width        : 300px;
	text-overflow: ellipsis;  /* 위에 설정한 width보다 길면 말줄임표처럼 표시*/
	white-space  : nowrap;    /* 줄바꿈 x */
	overflow     : hidden;    /* 내용이 길면 감춤 */
	display      : block;     /* 블럭처리 */
	border: none; /* 블럭의 테두리 제거 */
}

결과:

미리보기 내용만 좌측 정렬 위해 td_etc2{} 안에 text-align: left 입력
컬럼명 포함 남은 모든 내용들은 중앙 정렬 위해 tr 안에 align=center 입력

참고자료

profile
기기 좋아하는 여자

0개의 댓글