您现在的位置： 用CSS实现圆角边框效果的方法
飞速资源网| http://www.ff70.com |网页设计|人气:140次| 06-11
我们在网页制作中常常为了页面的美观，而设计一些圆角的边框。常用的方法是事先做好圆角效果的图片，然后把图片进行分割处理。这样做的缺点就是网页中附带了好多图片，影响网页的打开速度，其实我们完全可以用CSS来实现圆角边框的效果，具体方法请接着往下看。
用CSS实现圆角边框效果截图如下所示：
用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>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>用CSS实现圆角边框效果的方法-HTMer</title>
<style type="text/css">
<!--
b{display:block;overflow:hidden;height:1px;}
.htmer_circle1{margin:0 2px; background:#333;}
.htmer_circle2,.content{border-color:#333;border-style:solid;border-width:0 1px;clear:both;}
.htmer_circle2{margin:0 1px;}
-->
</style>
</head>
<body>
<b class="htmer_circle1"></b>
<b class="htmer_circle2"></b>
<div class="content">用CSS实现圆角边框效果的方法——<a href="http://www.ff70.com">HTMer.Com</a></div>
<b class="htmer_circle2"></b>
<b class="htmer_circle1"></b>
</body>
</html>
如果觉得《用CSS实现圆角边框效果的方法》网页设计,网页设计教程,网页设计知识不错，可以推荐给好友哦。
本文Tags： 电脑教学 - 网页设计,网页设计教程,网页设计知识,
相关 网页设计文章- ·上一篇：利用javascript进行进制转换的方法
- › 用CSS实现圆角边框效果的方法
- › 用CSS控制文章落款右对齐且垂直居中的方法
- › 使用CSS截断过长标题文字的方法
- › 网页设计中用CSS设置文字竖排的方法
中查找"用CSS实现圆角边框效果的方法"更多相关内容
中查找"用CSS实现圆角边框效果的方法"更多相关内容- 在soso中搜索相关文章：用CSS实现圆角边框效果的方法
- 在搜狗中搜索相关文章：用CSS实现圆角边框效果的方法
分类导航
