이미지 없이 스타일쉬트로만 만들어 봅니다...
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=euc-kr" />
<title>이미지 없이 라운딩 박스 표현하기!</title>
<style type="text/css">
.rtop, .rbottom{display:block}
.rtop *, .rbottom *{display: block; height: 1px; overflow: hidden; background:#CCCCCC}
.r1{margin: 0 5px}
.r2{margin: 0 3px}
.r3{margin: 0 2px}
.r4{margin: 0 1px; height: 2px}
.box { background:#CCCCCC; padding:5px 10px; font-size:12px; font-size:12px}
</style>
</head>
<body>
<div id="container">
<b class="rtop"><b class="r1"></b><b class="r2"></b><b class="r3"></b><b class="r4"></b></b>
<div class="box">이미지 없이 라운딩 박스 표현하기!</div>
<b class="rbottom"><b class="r4"></b><b class="r3"></b><b class="r2"></b><b class="r1"></b></b>
</div>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=euc-kr" />
<title>이미지 없이 라운딩 보더 표현하기!</title>
<style>
.rtop, .rbottom{display:block;}
.rtop *, .rbottom *{display:block; height:1px; overflow:hidden;}
.r1{margin:0 5px; background:#CCCCCC}
.r2{margin:0 3px; border-left:2px solid #CCCCCC; border-right:2px solid #CCCCCC;}
.r3{margin:0 2px; border-left:1px solid #CCCCCC; border-right:1px solid #CCCCCC;}
.r4{margin:0 1px; height:2px; border-left:1px solid #CCCCCC; border-right:1px solid #CCCCCC;}
.box { margin:0; padding:5px 10px; border-left:#CCCCCC solid 1px; border-right:#CCCCCC solid 1px; font-size:12px}
</style>
</head>
<body>
<div id="container" style="background: #fff">
<b class="rtop"><b class="r1"></b><b class="r2"></b><b class="r3"></b><b class="r4"></b></b>
<div class="box">이미지 없이 라운딩 보더 표현하기!</div>
<b class="rbottom"><b class="r4"></b><b class="r3"></b><b class="r2"></b><b class="r1"></b></b></div>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=euc-kr" />
<title>이미지 없이 라운딩 박스 + 보더 표현하기!</title>
<style>
.rtop, .rbottom{display:block;}
.rtop *, .rbottom *{display:block; height:1px; overflow:hidden;}
.r1{margin:0 5px; background:#CCCCCC}
.r2{margin:0 3px; border-left:2px solid #CCCCCC; border-right:2px solid #CCCCCC; background:#EEEEEE}
.r3{margin:0 2px; border-left:1px solid #CCCCCC; border-right:1px solid #CCCCCC; background:#EEEEEE}
.r4{margin:0 1px; height:2px; border-left:1px solid #CCCCCC; border-right:1px solid #CCCCCC; background:#EEEEEE}
.box{ margin:0; padding:5px 10px; border-left:#CCCCCC solid 1px; border-right:#CCCCCC solid 1px; background:#EEEEEE; font-size:12px}
</style>
</head>
<body>
<div id="container" style="background: #fff">
<b class="rtop"><b class="r1"></b><b class="r2"></b><b class="r3"></b><b class="r4"></b></b>
<div class="box">이미지 없이 라운딩 박스 + 보더 표현하기!</div>
<b class="rbottom"><b class="r4"></b><b class="r3"></b><b class="r2"></b><b class="r1"></b></b></div>
</body>
</html>
출처-phpschool + http://www.html.it/articoli/nifty/index.html<div class='small'>[이 게시물은 관리자님에 의해 2011-10-31 17:16:08 PHP & HTML에서 이동 됨]</div>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=euc-kr" />
<title>이미지 없이 라운딩 박스 표현하기!</title>
<style type="text/css">
.rtop, .rbottom{display:block}
.rtop *, .rbottom *{display: block; height: 1px; overflow: hidden; background:#CCCCCC}
.r1{margin: 0 5px}
.r2{margin: 0 3px}
.r3{margin: 0 2px}
.r4{margin: 0 1px; height: 2px}
.box { background:#CCCCCC; padding:5px 10px; font-size:12px; font-size:12px}
</style>
</head>
<body>
<div id="container">
<b class="rtop"><b class="r1"></b><b class="r2"></b><b class="r3"></b><b class="r4"></b></b>
<div class="box">이미지 없이 라운딩 박스 표현하기!</div>
<b class="rbottom"><b class="r4"></b><b class="r3"></b><b class="r2"></b><b class="r1"></b></b>
</div>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=euc-kr" />
<title>이미지 없이 라운딩 보더 표현하기!</title>
<style>
.rtop, .rbottom{display:block;}
.rtop *, .rbottom *{display:block; height:1px; overflow:hidden;}
.r1{margin:0 5px; background:#CCCCCC}
.r2{margin:0 3px; border-left:2px solid #CCCCCC; border-right:2px solid #CCCCCC;}
.r3{margin:0 2px; border-left:1px solid #CCCCCC; border-right:1px solid #CCCCCC;}
.r4{margin:0 1px; height:2px; border-left:1px solid #CCCCCC; border-right:1px solid #CCCCCC;}
.box { margin:0; padding:5px 10px; border-left:#CCCCCC solid 1px; border-right:#CCCCCC solid 1px; font-size:12px}
</style>
</head>
<body>
<div id="container" style="background: #fff">
<b class="rtop"><b class="r1"></b><b class="r2"></b><b class="r3"></b><b class="r4"></b></b>
<div class="box">이미지 없이 라운딩 보더 표현하기!</div>
<b class="rbottom"><b class="r4"></b><b class="r3"></b><b class="r2"></b><b class="r1"></b></b></div>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=euc-kr" />
<title>이미지 없이 라운딩 박스 + 보더 표현하기!</title>
<style>
.rtop, .rbottom{display:block;}
.rtop *, .rbottom *{display:block; height:1px; overflow:hidden;}
.r1{margin:0 5px; background:#CCCCCC}
.r2{margin:0 3px; border-left:2px solid #CCCCCC; border-right:2px solid #CCCCCC; background:#EEEEEE}
.r3{margin:0 2px; border-left:1px solid #CCCCCC; border-right:1px solid #CCCCCC; background:#EEEEEE}
.r4{margin:0 1px; height:2px; border-left:1px solid #CCCCCC; border-right:1px solid #CCCCCC; background:#EEEEEE}
.box{ margin:0; padding:5px 10px; border-left:#CCCCCC solid 1px; border-right:#CCCCCC solid 1px; background:#EEEEEE; font-size:12px}
</style>
</head>
<body>
<div id="container" style="background: #fff">
<b class="rtop"><b class="r1"></b><b class="r2"></b><b class="r3"></b><b class="r4"></b></b>
<div class="box">이미지 없이 라운딩 박스 + 보더 표현하기!</div>
<b class="rbottom"><b class="r4"></b><b class="r3"></b><b class="r2"></b><b class="r1"></b></b></div>
</body>
</html>
출처-phpschool + http://www.html.it/articoli/nifty/index.html<div class='small'>[이 게시물은 관리자님에 의해 2011-10-31 17:16:08 PHP & HTML에서 이동 됨]</div>
댓글 5개
19년 전
이 좋은 것을.....
감사합니다....
제 홈에 언능 가져다가 해 볼렵니다...^^
감사합니다....
제 홈에 언능 가져다가 해 볼렵니다...^^
느낌좋은날
19년 전
저도 저 곳 게시판 보다 소스를 넣어서 봤는데 좋더라구요 얼른 업어가세요 ^^;
19년 전
테스트해본결과.....넘좋군요...감사합니다...^^
18년 전
너무 좋음. ^^ 고맙습니다.
swinter
17년 전
감사합니다.
게시판 목록
프로그램
| 번호 | 제목 | 글쓴이 | 날짜 | 조회 |
|---|---|---|---|---|
| 2230 | 16년 전 | 1293 | ||
| 2229 | 16년 전 | 2161 | ||
| 2228 | 16년 전 | 3226 | ||
| 2227 | 16년 전 | 2169 | ||
| 2226 | 16년 전 | 1755 | ||
| 2225 | 16년 전 | 1514 | ||
| 2224 |
 ideaman |
16년 전 | 2046 | |
| 2223 | 16년 전 | 4730 | ||
| 2222 | 16년 전 | 1412 | ||
| 2221 |
 RINIX |
16년 전 | 2146 | |
| 2220 |
RINIX |
16년 전 | 2137 | |
| 2219 |
RINIX |
16년 전 | 2407 | |
| 2218 |
RINIX |
16년 전 | 2148 | |
| 2217 |
RINIX |
16년 전 | 4440 | |
| 2216 |
RINIX |
16년 전 | 2928 | |
| 2215 | 16년 전 | 2868 | ||
| 2214 | 16년 전 | 1604 | ||
| 2213 | 16년 전 | 1251 | ||
| 2212 |
RINIX |
16년 전 | 3949 | |
| 2211 |
RINIX |
16년 전 | 1622 | |
| 2210 |
RINIX |
16년 전 | 1618 | |
| 2209 | 16년 전 | 2115 | ||
| 2208 | 16년 전 | 1887 | ||
| 2207 |
letsgolee
|
16년 전 | 1495 | |
| 2206 |
RINIX |
16년 전 | 3923 | |
| 2205 | 16년 전 | 1765 | ||
| 2204 | 16년 전 | 3136 | ||
| 2203 | 16년 전 | 3027 | ||
| 2202 | 16년 전 | 1048 | ||
| 2201 | 16년 전 | 1845 | ||
| 2200 | 16년 전 | 1598 | ||
| 2199 |
 MindMap |
16년 전 | 1856 | |
| 2198 |
태양의서쪽
|
16년 전 | 2648 | |
| 2197 |
태양의서쪽
|
16년 전 | 3029 | |
| 2196 |
태양의서쪽
|
16년 전 | 3229 | |
| 2195 | 16년 전 | 3328 | ||
| 2194 | 16년 전 | 1470 | ||
| 2193 |
letsgolee
|
16년 전 | 1423 | |
| 2192 | 16년 전 | 2258 | ||
| 2191 | 17년 전 | 1976 | ||
| 2190 |
 cmpanel |
17년 전 | 2291 | |
| 2189 | 17년 전 | 2811 | ||
| 2188 |
Sizkein
|
17년 전 | 3261 | |
| 2187 |
letsgolee
|
17년 전 | 2360 | |
| 2186 |
Sizkein
|
17년 전 | 1637 | |
| 2185 |
Sizkein
|
17년 전 | 3208 | |
| 2184 |
Sizkein
|
17년 전 | 3064 | |
| 2183 | 17년 전 | 3042 | ||
| 2182 | 17년 전 | 3922 | ||
| 2181 | 17년 전 | 2588 | ||
| 2180 |
 skinartisanCOM |
17년 전 | 2407 | |
| 2179 | 17년 전 | 2654 | ||
| 2178 | 17년 전 | 2899 | ||
| 2177 | 17년 전 | 2617 | ||
| 2176 | 17년 전 | 1453 | ||
| 2175 | 17년 전 | 1897 | ||
| 2174 | 17년 전 | 1495 | ||
| 2173 |
skinartisanCOM |
17년 전 | 1924 | |
| 2172 | 17년 전 | 2524 | ||
| 2171 | 17년 전 | 8709 | ||
| 2170 | 17년 전 | 3160 | ||
| 2169 | 17년 전 | 4251 | ||
| 2168 |
cmpanel |
17년 전 | 1989 | |
| 2167 | 17년 전 | 3659 | ||
| 2166 |
cmpanel |
17년 전 | 1554 | |
| 2165 | 17년 전 | 1388 | ||
| 2164 | 17년 전 | 2324 | ||
| 2163 | 17년 전 | 1319 | ||
| 2162 | 17년 전 | 1644 | ||
| 2161 | 17년 전 | 1460 | ||
| 2160 | 17년 전 | 2530 | ||
| 2159 |
inxps
|
17년 전 | 1503 | |
| 2158 |
inxps
|
17년 전 | 1098 | |
| 2157 | 17년 전 | 1230 | ||
| 2156 | 17년 전 | 3110 | ||
| 2155 | 17년 전 | 2175 | ||
| 2154 | 17년 전 | 1980 | ||
| 2153 |
 똥싼너구리 |
17년 전 | 1224 | |
| 2152 |
letsgolee
|
17년 전 | 2455 | |
| 2151 | 17년 전 | 1172 | ||
| 2150 |
아름다운세상
|
17년 전 | 1130 | |
| 2149 |
아름다운세상
|
17년 전 | 1379 | |
| 2148 |
아름다운세상
|
17년 전 | 2739 | |
| 2147 |
 넥스트스텝 |
17년 전 | 2399 | |
| 2146 | 17년 전 | 2487 | ||
| 2145 | 17년 전 | 1188 | ||
| 2144 | 17년 전 | 1306 | ||
| 2143 | 17년 전 | 3253 | ||
| 2142 | 17년 전 | 2839 | ||
| 2141 | 17년 전 | 4110 | ||
| 2140 | 17년 전 | 2260 | ||
| 2139 | 17년 전 | 2349 | ||
| 2138 | 17년 전 | 1402 | ||
| 2137 | 17년 전 | 2517 | ||
| 2136 | 17년 전 | 2201 | ||
| 2135 | 17년 전 | 2961 | ||
| 2134 |
아름다운세상
|
17년 전 | 2471 | |
| 2133 |
Juinjang
|
17년 전 | 1634 | |
| 2132 | 17년 전 | 2433 | ||
| 2131 | 17년 전 | 1591 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기