[CSS] 사이즈에 따라 텍스트를 보이고 숨기는 처리 (꼼수)ㅋ
2016. 9. 20. 18:41ㆍHTML / CSS
1. 해당 글에서는 폭이 400px이하 일 때 텍스트를 숨김
2. 우선 가로폭이 400px이하에 대한 텍스트 숨김 스타일 추가
@media screen and (max-width: 400px) {
#head .cont .none_txt{display: none;}
}
3. 400px이상일 경우 텍스트 표시 스타일 추가.
#head .cont .none_txt{display:inline}
5. html
<div style="display:inline">홍길동</div>
<div class="none_txt">천재</div>
6. 위와 같은 작업을 하고나면 폭이 400이 되었을 때 텍스트를 숨기며, 커졌을 경우 다시 텍스트가 표시된다.
'HTML / CSS' 카테고리의 다른 글
[CSS] position absolute, relative (0) | 2016.11.07 |
---|---|
[HTML/CSS] 가변폭 레이아웃 (0) | 2016.10.19 |
[CSS] 테이블 TD의 가로폭에 따라 폭을 넘는 글자 "..." 표시 (0) | 2016.09.19 |
[CSS3] div 배경만 투명도 (텍스트는 제외) (0) | 2014.08.14 |
[CSS] Opacity 브라우저 별 설정 (0) | 2014.06.17 |