인터넷정보

이미지 없이 모서리 없는 둥근 테이블 만들기 3

알 수 없는 사용자 2007. 10. 17. 11:45
<style>
.rtop, .rbottom{display:block; background: #FFFFFF;}
.rtop *, .rbottom *{display: block; height: 1px; overflow: hidden; background: pink;}
.r1{margin: 0 5px}
.r2{margin: 0 3px}
.r3{margin: 0 2px}
.r4{margin: 0 1px; height: 2px}
</style>

<table style="width:300;font-size:9pt;color:#FF00FF;">
<tr>
<td>

<div id="container" style="background: pink;">
<b class="rtop">
  <b class="r1"></b> <b class="r2"></b> <b class="r3"></b> <b class="r4"></b>
</b>
  그냥 바라만 보다<br><br>
  편지를 띄웠다. <br><br>
  투명한 가을 햇살속으로 <br><br>
  친구이고 싶은 한 사람에게... <br><br>
  오후 커피가 향기로우면 그 향기로움으로... <br><br>
  비가오면 그 빗소리로...<br><br>
  좋은 영화의 감동으로 눈물이 날땐 그 순수함으로... <br><br>
  꽃빛이 고와서 눈이 부실때는 그 아름다움으로... <br><br>
  친구가 되고 싶었다.
<b class="rbottom">
  <b class="r4"></b> <b class="r3"></b> <b class="r2"></b> <b class="r1"></b>
</b>
</div>

</td>
</tr>
</table>

미리보기 에서는 하단에 여백이 생기네요.
복사해서 태그연습장에서 테스트 해보세요.
반응형