웹마스터 팁
page_full_width" class="col-xs-12" |cond="$__Context->page_full_width">
테이블에 dot 효과를 주자~~~~~~~~~~~~~~~~~~~~
2003.04.08 23:06
http://www.loveisfeel.net/test.htm아래 링크에서 확인 하실 수 있습니다.
http://www.loveisfeel.net/test.htm
이미지로 하는것 보단 상당히 요용합니다.
디자이너 로서, 다양한 디자인을 용이 하게 합니다.
쓸때 없는 테그의 당비를 줄일 수 있습니다.
table , tr, td 하다 못해 링크에도 적용할 수 있습니다.
<style type="text/css">
.love_line{ border-bottom: 1px dotted #B6B6B6; }
.love_line1{ border-bottom: 10px dotted #B6B6B6; }
.love_line3{ border-top: 10px dashed #E4E4E4; }
.love_line2{ border-top: 1px dashed #E4E4E4; }
.love_line4{ border-left: 8px dashed #E4E4E4; border-top: 8px dashed #E4E4E4; padding-top: 5px; }
.love_line2 a:hover {
border-bottom: 1px dashed red;
color: red;
text-decoration: none;
}
</style>
.love_line{ border-bottom: 1px dotted #B6B6B6; }
.love_line1{ border-bottom: 10px dotted #B6B6B6; }
.love_line3{ border-top: 10px dashed #E4E4E4; }
.love_line2{ border-top: 1px dashed #E4E4E4; }
.love_line4{ border-left: 8px dashed #E4E4E4; border-top: 8px dashed #E4E4E4; padding-top: 5px; }
.love_line2 a:hover {
border-bottom: 1px dashed red;
color: red;
text-decoration: none;
<table width="100%" border="0" cellpadding="5" cellspacing="5">
<tr>
<td bgcolor="#FFFFFF" class="love_line"> love_line dotted 효과를 주었습니다.</td>
</tr>
<tr>
<td bgcolor="#FFFFFF" class="love_line1"> love_line1 dotted 효과를
주었습니다.</td>
</tr>
<tr class="padding">
</tr>
<tr class="padding">
<td bgcolor="#FFFFFF" class="love_line2">love_line2 dashed 효과를
주었습니다.링크에 마우스를 대면!?</td>
</tr>
<tr>
<td bgcolor="#FFFFFF" class="love_line3"> love_line3 dashed 효과를
주었습니다. </td>
</tr>
</table>
http://www.loveisfeel.net/test.htm
이미지로 하는것 보단 상당히 요용합니다.
디자이너 로서, 다양한 디자인을 용이 하게 합니다.
쓸때 없는 테그의 당비를 줄일 수 있습니다.
table , tr, td 하다 못해 링크에도 적용할 수 있습니다.
<style type="text/css">
.love_line{ border-bottom: 1px dotted #B6B6B6; }
.love_line1{ border-bottom: 10px dotted #B6B6B6; }
.love_line3{ border-top: 10px dashed #E4E4E4; }
.love_line2{ border-top: 1px dashed #E4E4E4; }
.love_line4{ border-left: 8px dashed #E4E4E4; border-top: 8px dashed #E4E4E4; padding-top: 5px; }
.love_line2 a:hover {
border-bottom: 1px dashed red;
color: red;
text-decoration: none;
}
</style>
.love_line{ border-bottom: 1px dotted #B6B6B6; }
.love_line1{ border-bottom: 10px dotted #B6B6B6; }
.love_line3{ border-top: 10px dashed #E4E4E4; }
.love_line2{ border-top: 1px dashed #E4E4E4; }
.love_line4{ border-left: 8px dashed #E4E4E4; border-top: 8px dashed #E4E4E4; padding-top: 5px; }
.love_line2 a:hover {
border-bottom: 1px dashed red;
color: red;
text-decoration: none;
<table width="100%" border="0" cellpadding="5" cellspacing="5">
<tr>
<td bgcolor="#FFFFFF" class="love_line"> love_line dotted 효과를 주었습니다.</td>
</tr>
<tr>
<td bgcolor="#FFFFFF" class="love_line1"> love_line1 dotted 효과를
주었습니다.</td>
</tr>
<tr class="padding">
</tr>
<tr class="padding">
<td bgcolor="#FFFFFF" class="love_line2">love_line2 dashed 효과를
주었습니다.링크에 마우스를 대면!?</td>
</tr>
<tr>
<td bgcolor="#FFFFFF" class="love_line3"> love_line3 dashed 효과를
주었습니다. </td>
</tr>
</table>
댓글 5
-
niistyle
2003.04.09 22:15
굿잡요~ ^^ -
고냉이 콱!
2003.04.13 11:50
아주 괜찮은 소스네요^^ -
피스♬
2003.05.09 12:44
오오- 미리보기도 있군요- 추천 누르고 갑니다^ ^ -
김용식
2003.06.29 03:59
.DottedBorder_bottom {border-bottom: 1px dotted #999999; }
.DottedBorder_top {border-top: 1px dotted #999999; }
.DottedBorder_left {border-left: 1px dotted #999999; }
.DottedBorder_right {border-right: 1px dotted #999999; }
<태그 ... class='DottedBorder_bottom + DottedBorder_left' >
혹시나 하고 이렇게 해보니 클래스 효과가 더해지네요.. 신기하여라 '-' -
∠ 이건몇도게? :)
2003.10.03 17:01
tag1004.net 소스를 그대로 가져오신거 같군요. 출처표시를 해 주셨으면 합니다.
제목 | 글쓴이 | 날짜 |
---|---|---|
iis+php+mysql+zeroboard 설치 [3] | 이성헌 | 2005.12.15 |
mysql 사용법 요약 정리 | 이성헌 | 2005.12.15 |
apache 의 httpd.conf 에서 alias 사용례... | 이성헌 | 2005.12.15 |
nWmail 서버 구축 방법- 자세한 문서는 w3ip.com 에 있음 | 이성헌 | 2005.12.15 |
zeroboard 아이디 , 비번 분실시 변경법. | 이성헌 | 2005.12.15 |
자바스크립트 인증 | 이성헌 | 2005.12.15 |
아파치 인증-개인 컴퓨터 apache 서버 경우 | 이성헌 | 2005.12.15 |
wo.to (유료서버) 의 아파치 폴더 인증 방법. | 이성헌 | 2005.12.15 |
아파치 인증에서 .htaccess 의 내용. | 이성헌 | 2005.12.15 |
apache 인증에서 .htpasswd 의 내용. | 이성헌 | 2005.12.15 |
apache httpd.conf 의 1차 설치본 - alias 사용 | 이성헌 | 2005.12.15 |
php 4.3.2 의 php.ini 내용 (내컴 설치본) | 이성헌 | 2005.12.15 |
제로보드 data 파일의 모드 변경 | 이성헌 | 2005.12.15 |
계정 사용량 알아보기 | 이성헌 | 2005.12.15 |
아파치 httpd.conf 2차 설정본 - php 연동 | 이성헌 | 2005.12.15 |
mysql 을 이용한 사용자 인증 (통합 설명) | 이성헌 | 2005.12.15 |
mysql 이용한 사용자 인증 2 (auth.inc 파일) | 이성헌 | 2005.12.15 |
mysql 이용한 사용자 인증 3 (index.htm 파일) | 이성헌 | 2005.12.15 |
mysql 을 이용한 사용자 인증 4 (index.htm 인증후 바로 넘기기) | 이성헌 | 2005.12.15 |
존재하지 않은 파일 선택시 에러메시지 보임. [1] | 이성헌 | 2005.12.15 |