html怎么写圆形

1.html圆圈内容怎么写如图 在线等 急 设计师 要做一个圆圈,首先要做一个正方形的div,然后加上border边框,边框要用border-radius圆角,当圆角像素等于div长宽的一半时,就变成了一个圆形边框中间的文字用line-height和text-align上下左右居中还有那个箭头应该是图片来的,可以当背景图片插入,这个我就不写了 。
2.用html做一个网页背景,要求为圆形,且文字要居中如果要插入个网页背景,要求为圆形,文字居中,用背景图片直接插入是比较难办到的,我们可以用div来做个圆形,文字也放在div中,通过div的定位技术把文字放到圆形中间,把圆形放到屏幕中间,以下是我的html代码
<html>
<head>
<style>
.circle{
background-color: red;
width: 500px;
height: 500px;
border-radius: 250px;
position: relative;
}
.text{
position: absolute;
top: 200px;
right: 200px;
}
</style>
</head>
<body>
<div class="circle">
<div class="text">
saasdfs
</div>
</div>
</body>
</html>
3.怎么把DIV变成一个圆1、【第一步】打开Dreamweaver cc 2014软件,选择建立html界面,里面自动生成一些必要代码的代码格式,不需再浪费时间去写 。
2、【第二步】在body标签内输入:<div class="Odiv"></div>;,这里的div就是用于画圆形的标签 。
3、【第三步】在相对靠前的位置,输入
.Odiv{ width:200px; height:200px; border-radius:50%; background-color:#1EFD0C;}
这就是css样式用于修饰div标签,使得div形成一个绿色的圆图形 。
4、【第四步】保存好代码,回到Dreamweaver 界面,摁F12键,弹出对话框,就能看所画绿色圆图形 。
4.html中在li的标签下写的数字怎么才能使边框为圆形跟椭圆形呢语法:
border-radius : none | <length>{1,4} [ / <length>{1,4} ]?
相关属性: border-top-right-radius , border-bottom-right-radius , border-bottom-left-radius , border-top-left-radius
取值:
<length>:
由浮点32313133353236313431303231363533e4b893e5b19e31333361303565数字和单位标识符组成的长度值 。不可为负值 。
border-top-left-radius:
由浮点数字和单位标识符组成的长度值 。不可为负值 。
【html怎么写圆形】说明:
第一个值是水平半径 。
如果第二个值省略,则它等于第一个值,这时这个角就是一个四分之一圆角 。
如果任意一个值为0,则这个角是矩形,不会是圆的 。
值不允许是负值 。
在Adobe Dreamweave 软件里写如以下代码:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "">
<html xmlns="">
<head>
<meta ; charset=gbk" />
<title>;在HTML中如何把块的边框做成圆角</title>
<style type="text/css">
.a {
background-color: #c7dec6;
border: 1px solid #000;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
height:200px;
width:500px;
padding:20px;
}
</style>
</head>
<body>
<p class="a">
在HTML中如何把块的边框做成圆角
</p>
</body>
</html>
样式注释
各个边角的样式分开显示:
border-top-left-radius: 10px;左上部边框圆角10个像素
border-top-right-radius: 10px;右上部边框圆角10个像素
border-bottom-left-radius: 10px;左下部边框圆角10个像素
border-bottom-right-radius: 10px;右下部边框圆角10个像素