Team:Peking S/copy

From 2011.igem.org

(Difference between revisions)
Line 1: Line 1:
<html>
<html>
<head>
<head>
-
<style>
+
<title>css圆角效果</title>
-
#a{border-left:1px #95C17B solid;border-right:2px #95C17B solid;width:780px;height:42px; line-height:42px; text-align:left; font-size:12px;}
+
<meta http-equiv="content-type" content="text/html; charset=gb2312">
-
.b{height:1px;overflow:hidden;border-left:1px #95C17B solid;border-right:1px #95C17B solid;}
+
<style type="text/css">
 +
div.RoundedCorner{background: #9BD1FA}
 +
b.rtop, b.rbottom{display:block;background: #FFFFFF}
 +
b.rtop b, b.rbottom b{display:block;height: 1px;overflow: hidden; background: #9BD1FA}
 +
b.r1{margin: 0 5px}
 +
b.r2{margin: 0 3px}
 +
b.r3{margin: 0 2px}
 +
b.rtop b.r4, b.rbottom b.r4{margin: 0 1px;height: 2px}
</style>
</style>
-
<title></title>
 
</head>
</head>
<body>
<body>
-
<div>
+
<div class="RoundedCorner">
-
<div class="b" style="margin-left:3px;width:894px;background:#95C17B"></div>
+
<b class="rtop"><b class="r1"></b><b class="r2"></b><b class="r3"></b><b class="r4"></b></b>
-
<div class="b" style="margin-left:2px;width:896px;"></div>
+
无图片实现圆角框
-
<div class="b" style="margin-left:1px;width:898px"></div>
+
<b class="rbottom"><b class="r4"></b><b class="r3"></b><b class="r2"></b><b class="r1"></b></b>
-
<div id="a">
+
</div>
 +
<br>
-
城门口las
+
<div class="RoundedCorner">
 +
<b class="rtop"><b class="r1"></b><b class="r2"></b><b class="r3"></b><b class="r4"></b></b>
 +
<br>无图片实现圆角框<br><br>
 +
<b class="rbottom"><b class="r4"></b><b class="r3"></b><b class="r2"></b><b class="r1"></b></b>
 +
</div>
 +
</body>
 +
</html>

Revision as of 09:15, 30 July 2011

css圆角效果

无图片实现圆角框


无图片实现圆角框