테스트 사이트 - 개발 중인 베타 버전입니다
SIR

이미지 없는 라운드테이블 만들기 입니다.

혀니천사
프로필 보기이 회원 글보기이 회원의 댓글보기
 · 9년 전 · 354 · 1

이미지 없이 스타일쉬트로만 만들어 봅니다...

<!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>  

목록
이전글 다음글

댓글 작성

댓글을 작성하시려면 로그인이 필요합니다.

로그인하기

댓글 1개

불량학생
프로필 보기이 회원 글보기이 회원의 댓글보기
 9년 전
오~ 좋네요 b 태그를 div로 변경해도 잘되는군요

게시글 목록

번호 제목
12211
PHP 썸네일 생성시 Sharpen 적용하기 입니다.
12210
PHP PHP에서 싱글톤 패턴 구현하기 입니다.
12208
PHP Apache DOS 공격 방어 - mod_evasive - web 입니다. 1
12207
PHP apache의 httpd.conf 설정 방법입니다.
12206
PHP 세션만을 이용한 현재 접속자. 로케이션 표시 입니다.
12205
MySQL MYSQL에 대용량 SQL파일 import하기
20383
반응형 반응형 코딩할때 height:100% 에 관해서... 2
12204
JavaScript Fiddler - 데이타 송수신 상태 체크 프로그램
12203
PHP 웹서버(아파치)를 이용한 인증 입니다.
12202
PHP php로 엑셀 만들기 입니다.
12201
PHP User Management 관련 입니다.
12199
웹서버 LEMP(ubuntu14.04 + nginx + mysql + php-fpm + memcached) 스택 설치방법 소개 1
350
css 자동생성 사이트 2
12197
PHP 관리자 및 회원의 페이지 접근 권한 간단구현 입니다. 1
12196
PHP [서버운영] 아파치로그] sql로 바로 저장 입니다.
12195
PHP [서버운영] 아파치로그] 보기좋고 파싱하기 좋은 통합로그 입니다.
12193
PHP (win) xdebug와 xampp 사용하기 입니다. 1
12190
PHP 계정별 register_global 설정 입니다. 2
12189
PHP apache log처리에 대해서 입니다.
12188
PHP 이름기반 가상호스트 설정관련 입니다.
12187
PHP exif 익스텐션 실행이 안되는 경우 입니다.
12186
PHP 타겟(target) 쓰는 법 입니다.
12185
PHP 파일이름의 확장자로 파일 종류를 확인하는 함수 입니다.
12183
PHP 이미지 없는 라운드테이블 만들기 입니다. 1 현재글
12182
PHP 문자셋 인코딩 바꾸는 팁 입니다.
이전 다음
전체 목록