刚看了哪个圆角的帖子~自己做了一个~兼容IE6 IE7 FF
缺点:不能自适应Width,css代码有点长. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.divhome.com/#.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.divhome.com/#.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title></title>
<base />
<style type="text/css">
<!--
*{ margin: 0;padding:0; }
body { background:#fff; font: 12px/130% arial,''宋体'',verdana,sans-serif;color: #333333; }
.main {border-top: 1px solid #1E90FF;border-left:none; width:250px; text-align: left; margin: 10px; position: relative;}
.s{ position: absolute; margin:-3px 0 0 -5px; color: #1E90FF; font-size: 15px; }
.s2{margin:-3px -4px 0 0; right:0;font-size: 16px; }
.s3{ margin:0 0 -2px -5px;*margin:0 0 -6px -5px; left:0;bottom:0;font-size: 16px; }
.s4{ margin:0 -4px -3px 0;*margin:0 -4px -7px 0;right:0; bottom:0; }
.diva{ position: relative; z-index: 2; background: #fff; height: 2px; }
.divb{ position: relative; z-index:3; background:#fff;border-bottom: 1px solid #1E90FF; height: 3px; margin:0 0 -4px 0px; overflow: hidden; }
.content{ border-left: 1px solid #1E90FF;border-right: 1px solid #1E90FF; width:245px; padding: 2px 5px; position: relative; z-index:3;
background: #fff; margin: 0 -2px 0 -4px!important;margin: -12px -2px -1px -4px ;}
-->
</style>
</head>
<body>
<div class="main">
<a class="s">S</a><a class="s s2">0</a><a class="s s3">0</a><a class="s s4">S</a>
<div class="diva"></div>
<div class="content">
字符做的css圆角
<br />
<br />
<br />
<br />
<br />
</div>
<div class="divb"></div>
</div>
</body>
</html> |
