이미지 없이 스타일쉬트로만 만들어 봅니다...
<!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년 전
감사합니다.
게시판 목록
프로그램
| 번호 | 제목 | 글쓴이 | 날짜 | 조회 |
|---|---|---|---|---|
| 1330 | 18년 전 | 1489 | ||
| 1329 | 18년 전 | 1719 | ||
| 1328 | 18년 전 | 1009 | ||
| 1327 | 18년 전 | 1425 | ||
| 1326 | 18년 전 | 2264 | ||
| 1325 | 18년 전 | 1145 | ||
| 1324 | 18년 전 | 1306 | ||
| 1323 | 18년 전 | 1570 | ||
| 1322 | 18년 전 | 1182 | ||
| 1321 | 18년 전 | 976 | ||
| 1320 | 18년 전 | 1198 | ||
| 1319 | 18년 전 | 1523 | ||
| 1318 | 18년 전 | 1651 | ||
| 1317 | 18년 전 | 1602 | ||
| 1316 | 18년 전 | 1213 | ||
| 1315 |
|
18년 전 | 8603 | |
| 1314 | 18년 전 | 1913 | ||
| 1313 | 18년 전 | 1498 | ||
| 1312 | 18년 전 | 1491 | ||
| 1311 | 18년 전 | 1787 | ||
| 1310 | 18년 전 | 1838 | ||
| 1309 | 18년 전 | 1229 | ||
| 1308 | 18년 전 | 989 | ||
| 1307 | 18년 전 | 2760 | ||
| 1306 | 18년 전 | 3111 | ||
| 1305 | 18년 전 | 2177 | ||
| 1304 | 18년 전 | 1559 | ||
| 1303 | 18년 전 | 1428 | ||
| 1302 | 18년 전 | 893 | ||
| 1301 | 18년 전 | 1791 | ||
| 1300 | 18년 전 | 5142 | ||
| 1299 | 18년 전 | 2862 | ||
| 1298 |
mixdesign
|
18년 전 | 2112 | |
| 1297 | 18년 전 | 3081 | ||
| 1296 | 18년 전 | 2550 | ||
| 1295 | 18년 전 | 2243 | ||
| 1294 |
onweb
|
18년 전 | 4560 | |
| 1293 |
onweb
|
18년 전 | 3491 | |
| 1292 | 18년 전 | 3458 | ||
| 1291 | 18년 전 | 4044 | ||
| 1290 | 18년 전 | 1905 | ||
| 1289 | 18년 전 | 1764 | ||
| 1288 | 18년 전 | 1734 | ||
| 1287 | 18년 전 | 1433 | ||
| 1286 | 18년 전 | 1272 | ||
| 1285 | 18년 전 | 1161 | ||
| 1284 | 18년 전 | 1161 | ||
| 1283 | 18년 전 | 1519 | ||
| 1282 | 18년 전 | 921 | ||
| 1281 | 18년 전 | 1272 | ||
| 1280 | 18년 전 | 1134 | ||
| 1279 | 18년 전 | 1150 | ||
| 1278 | 18년 전 | 3027 | ||
| 1277 | 18년 전 | 949 | ||
| 1276 | 18년 전 | 1162 | ||
| 1275 | 18년 전 | 2100 | ||
| 1274 | 18년 전 | 2227 | ||
| 1273 | 18년 전 | 1322 | ||
| 1272 | 18년 전 | 1916 | ||
| 1271 | 18년 전 | 1169 | ||
| 1270 | 18년 전 | 2498 | ||
| 1269 | 18년 전 | 6600 | ||
| 1268 |
페이지팩트
|
18년 전 | 3823 | |
| 1267 |
페이지팩트
|
18년 전 | 2232 | |
| 1266 |
|
18년 전 | 6299 | |
| 1265 | 18년 전 | 2590 | ||
| 1264 | 18년 전 | 2623 | ||
| 1263 | 18년 전 | 2125 | ||
| 1262 | 18년 전 | 2118 | ||
| 1261 |
페이지팩트
|
18년 전 | 2128 | |
| 1260 | 18년 전 | 3889 | ||
| 1259 |
|
18년 전 | 3936 | |
| 1258 |
|
18년 전 | 5047 | |
| 1257 | 18년 전 | 4146 | ||
| 1256 | 18년 전 | 2582 | ||
| 1255 | 18년 전 | 1815 | ||
| 1254 | 18년 전 | 2783 | ||
| 1253 | 18년 전 | 2717 | ||
| 1252 | 18년 전 | 2243 | ||
| 1251 | 18년 전 | 5423 | ||
| 1250 |
jbsstyle
|
18년 전 | 4766 | |
| 1249 |
|
18년 전 | 3775 | |
| 1248 | 18년 전 | 3454 | ||
| 1247 | 18년 전 | 2141 | ||
| 1246 | 18년 전 | 2136 | ||
| 1245 | 18년 전 | 3642 | ||
| 1244 |
|
18년 전 | 2288 | |
| 1243 |
|
18년 전 | 2494 | |
| 1242 | 18년 전 | 1770 | ||
| 1241 | 18년 전 | 4466 | ||
| 1240 | 18년 전 | 2154 | ||
| 1239 | 18년 전 | 2305 | ||
| 1238 | 18년 전 | 4044 | ||
| 1237 |
hwatta
|
18년 전 | 3898 | |
| 1236 | 18년 전 | 2122 | ||
| 1235 | 18년 전 | 2773 | ||
| 1234 | 18년 전 | 5149 | ||
| 1233 | 18년 전 | 2416 | ||
| 1232 |
|
18년 전 | 2955 | |
| 1231 | 18년 전 | 8505 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기