怎么在网页设计里面弄圆角矩形

1、html如何做圆角矩形

<style type="text/css">

.wrapper{width:181px;background:#8cc355 url(bottom.gif) no-repeat left bottom;}

.wrapper h1{padding:10px 20px 0 20px;background:url(top.gif) no-repeat left top;}

.wrapper p{padding:0 20px 10px 20px;}

 

</style>

 

<div class="wrapper">

<h1>标题</h1>

<p>内容</p>

</div> 

 

top.gif

bottom.gif

2、CSS圆角矩形设置

CSS圆角矩形可以使用 Border-radius 属性即可实现。

Border-radius 属性相关定义功能及其案例：

对浏览器的支持：IE9+、Firefox 4+、Chrome、Safari 5+ 以及 Opera 支持 border-radius 属性。

定义和用法：border-radius 属性是一个简写属性，用于设置四个 border-*-radius 属性。该属性允许您为元素添加圆角边框！

默认值：0；

继承性：no；

版本：CSS3；

JavaScript 语法：object.style.borderRadius="5px"。

语法：border-radius: 1-4 length|% / 1-4 length|%。

length：定义圆角的形状。

%：以百分比定义圆角的形状。

案例：

案例1：border-radius:2em;

等同于：
border-top-left-radius:2em;
border-top-right-radius:2em;
border-bottom-right-radius:2em;
border-bottom-left-radius:2em;案例2：border-radius: 2em 1em 4em / 0.5em 3em;等同于：
border-top-left-radius: 2em 0.5em;
border-top-right-radius: 1em 3em;
border-bottom-right-radius: 4em 0.5em;
border-bottom-left-radius: 1em 3em

注意事项：

按此顺序设置每个 radii 的四个值。如果省略 bottom-left，则与 top-right 相同。如果省略 bottom-right，则与 top-left 相同。如果省略 top-right，则与 top-left 相同。

3、怎么用css写出圆角矩形？

http://jimmypassport.spaces.live.com/blog/cns!5782FBEA32A8C375!135.entry

看看这个 是否对你有帮助

4、怎么设置css圆角矩形

你好我的回答请采纳吧！

border-radius: 4px;    /*目标元素四角都为4px的圆角*/
border-top-right-radius: 4px;    /*目标元素右上角为4px的圆角*/
border-top-left-radius: 4px;    /*目标元素左上角为4px的圆角*/

右下角和左下角也同样使用border-top-right-radius的书写格式。

请采纳吧！

5、在网页中实现圆角矩形样式

|这个就是个border边角的样式 border-radius:5em;//左上、右上、右下、左下
也可以这么写
border-radius:2em;
||
border-top-left-radius:2em;
border-top-right-radius:2em;
border-bottom-right-radius:2em;
border-bottom-left-radius:2em;

6、Dreamweaver怎么在网页中显示一个圆角矩形

<!--在代码中写入如下代码-->

<style type="text/css">
.a{
width: 50px;
height: 50px;
border-radius: 5px;
border: 1px solid #000;
}
</style>

<div class="a"></div>

7、在html中怎么填充圆角矩形的背景

<div style="background-color:red;border-radio:10px;width:100%;height:100%;border-radius: 10px;">
</div>

主要做圆角用border-radius这个样式。

8、网页设计中圆角矩形怎么实现例子

您好。【三佳网页设计】为您解答。
圆角矩形的css代码：border-radius:5px； ：5px“代表意思是”上 右 下 左 “都是5px；
希望可以帮到您！

9、div+css如何实现圆角矩形

具体操作步骤如下：

1、首先打开sublime text软件，新建一个html文件，输入基本的html结构：

2、然后设置一个div，并设置div的class属性，在上方的style中设置样式，设置背景颜色、高度和宽度并设置border边框和边框的圆角属性，完成后保存：

3、最后打开浏览器就可以看到效果：