div怎么写圆形图表，怎样用CSS写出圆形的样式表

本文目录一览

1，怎样用CSS写出圆形的样式表
2，如何使用CSS创建一个圆形或正方形
3，Dreamweaver 8中做圆角表格
4，css 代码 div圆角矩形怎么写

1，怎样用CSS写出圆形的样式表

-moz-border-radius: 5px 5px;firefox的IE的本身没有说白就是用图片做背景比较实际

搜一下：怎样用CSS写出圆形的样式表

怎样用CSS写出圆形的样式表

2，如何使用CSS创建一个圆形或正方形

正方形：设置div【宽高一样】圆形：设置div【宽高一样】再添加border-radius:50%

正方形，宽高给一样就可以了圆形加个 border-radius就ok了

正方形：设置div【宽高一样】；圆形：设置div【宽高一样】再添加border-radius:50%

正方形就是div，圆形就是边角弧度设置成边的长度，这边建议您先系统的看看基础知识

正方形，宽高给一样就可以了圆形加个 border-radius就ok了

如何使用CSS创建一个圆形或正方形

3，Dreamweaver 8中做圆角表格

如果你采用表格布局，那么想实现圆角的话要依靠图片！可以去懒人图库搜一下BOX，可以找到一堆，原理不说了，无非就是表格嵌套-----太乱了也不方便修改，不推荐使用！如果采用DIV布局，那么实现圆角的方法有两种：1.纯代码，原理为用标签边框模拟圆角处的像素，你把一个圆角效果放大N倍后你会发现再圆的角也是由1px的小块组成，这样就好办了！如下：<div><div class="t1"></div><div class="t2"></div><div class="t3"></div><div class="t4"></div><div class="t5"></div><div>内容</div><div class="t5"></div><div class="t4"></div><div class="t3"></div><div class="t2"></div><div class="t1"></div></div>然后设置，t1 t2 t3 ...高为1px。左右边框为1px。一次左右边距加1.（如T1的margin为5，那么T2就为4.。类推！！）这里讲原理，具体如何才更圆，你可以放大一张图来找找规律。2.使用图片，也是推荐的一种方法！不要盲目追求代码的才是最好的，试想如果一个页面出现10个圆角层，相信大堆的代码会让你很头疼！所以最好的办法是，切两条圆角部分的图片，顶部一张，底部一张，中间的div设置左右边框，这样简洁实用！如果各圆角层的宽度不统一的话，稍麻烦一些，将4个角的图切下来。然后分别通过DIV加FLOAT属性。控制到DIV层的4个角落，中间部分用border填充。（当然，不到万不得以还是避免使用。）我们的目的是，代码简洁精准，维护方便！！希望对你有帮助！！！

做不出了找美工

Dreamweaver 8中做圆角表格

4，css 代码 div圆角矩形怎么写

朋友，我给你来个实例吧，希望采纳答案，谢谢。CSS代码：<style type="text/CSS"> div#niftyHTML代码：<div id="nifty"> <div class="rtop"> <div class="r1"></div> <div class="r2"></div> <div class="r3"></div> <div class="r4"></div> </div> <p>div + css 圆角矩形 www.865171.cn</p> <div class="rtop"> <div class="r4"></div> <div class="r3"></div> <div class="r2"></div> <div class="r1"></div> </div> </div>

用CSS样式吧，比js好有的浏览器会禁止执行脚本，那样就无效了 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"> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>无标题文档</title> </head> <style> .b1, .b2, .b3, .b4, .b1b, .b2b, .b3b, .b4b, .b { display:block; overflow:hidden; } .b1, .b2, .b3, .b1b, .b2b, .b3b { height:1px; } .b2, .b3, .b4, .b2b, .b3b, .b4b, .b { border-left:1px solid #999; border-right:1px solid #999; } .b1, .b1b { margin:0 5px; background:#999; } .b2, .b2b { margin:0 3px; border-width:2px; } .b3, .b3b { margin:0 2px; } .b4, .b4b { height:2px; margin:0 1px; } .d1 { background:#F7F8F9; } </style> <body> <div style=" width:155px; height:15px"> <b class="b1"></b><b class="b2 d1"></b><b class="b3 d1"></b><b class="b4 d1"></b> <div class="b d1" > 这里写字</div> <b class="b4b d1"></b><b class="b3b d1"></b><b class="b2b d1"></b><b class="b1b"></b> </div> </body> </html>

在google里baidu一下就ok了！

用背景图片吧！或者用Js-QUERY 赣榆人才网rc.ganyu.com