|
 
- UID
- 1
- 帖子
- 3801
- 精华
- 66
- 积分
- 8365
- 威望
- 8365 度
- 论坛币
- 12643 元
- 阅读权限
- 200
- 在线时间
- 1528 小时
- 注册时间
- 2007-1-15
- 最后登录
- 2009-1-9
|
1楼
发表于 2007-12-27 00:22
| 只看该作者
超酷圆形边框 div +css 做法
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>新建网页</title>
<meta http-equiv="content-type" content="text/html; charset=gb2312" />
<meta http-equiv="Content-Language" content="zh-CN" />
<meta name="robots" content="all" />
<meta name="author" content="lybykw | www.vistathink.com" />
<meta name="Copyright" content="Copyright (c) 2000-2005
www.vistathink.com" />
<link rel="icon" href="/favicon.ico" type="image/x-icon" media="screen"
/>
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon"
media="screen" />
<meta name="description" content="网页制作" />
<meta name="keywords" content="木瓜S Blog，Ardy.CN， www.ardy.cn" />
<style type="text/css">
<!--
body {font-size:12px;}
.round1 { border:1px solid #AFE8E1; background-color:#fff;
position:relative;}
.round1 .tl,.round1 .tr,.round1 .bl,.round1 .br { width:5px; height:5px;
overflow:hidden; position:absolute; background:url
( ) no-repeat;}
.round1 .tl { left:-1px; top:-1px; _top:0;}
.round1 .tr { right:-1px; top:-1px; _top:0; background-position:-4px 0;}
.round1 .bl { left:-1px; bottom:-1px; background-position:0 -4px;}
.round1 .br { right:-1px; bottom:-1px; background-position:-4px -4px;}
.ovt ul { margin:0; padding:0; }
.ovt li {background:url( ) right no-
repeat; height:22px; line-height:22px; list-style:none; float:left;
color:#088;}
.ovt span { background:url( ) left
no-repeat; display:block; padding:0 1em 0 .5em;}
-->
</style>
<script language="javascript">
<!--
//-->
</script>
</head>
<body>
<div class="p100">
<div class="round1">
<div class="tl"></div>
<div class="tr"></div>
<div class="bl"></div>
<div class="br"></div>
<div style=" position:absolute; top:-35px; _top:-22px; left:-25px;">
<ul class="ovt">
<li><span><img name="" src="" width="1" height="22"
align="absmiddle" />
<img
src="http://cn.yimg.com/i/ks/060928/tab_knowledge.gif" hspace="3" />知识
</span></li>
</ul>
</div>
<div style="padding:10px;">通过下列链接访问参考资料，可帮助你创建引人注目
的 Web 页面。
动态 HTML (DHTML) 对象模型参考
</div>
</div>
</div>
</body>
</html> |
|
