扫二维码与项目经理沟通
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流
你需要用到这个属性border-radius:0 0 0 0;
公司主营业务:做网站、成都网站制作、移动网站开发等业务。帮助企业客户真正实现互联网宣传,提高企业的竞争能力。创新互联建站是一支青春激扬、勤奋敬业、活力青春激扬、勤奋敬业、活力澎湃、和谐高效的团队。公司秉承以“开放、自由、严谨、自律”为核心的企业文化,感谢他们对我们的高要求,感谢他们从不同领域给我们带来的挑战,让我们激情的团队有机会用头脑与智慧不断的给客户带来惊喜。创新互联建站推出连云免费做网站回馈大家。
设置两个DIV,里面的DIV比外边的小,定义高度宽度边框线,然后使用上面的样式,按照border-radius:上px 右px 下px 左px;的方式来调整你的DIV,不止可以椭圆,其他形状也可以。
还有一个方法,使用背景图片。
.ellipse{
width: 550px;
height: 150px;
margin: 50px;
background: #FFD900;
border-radius: 50% / 100% 100% 0 0;
}
css如何设置文本框的为半椭圆
CSS画正方形长方形很简单,本文就不说了。
一、三角形
1、CSS画等腰三角形
2、画直角三角形:
二、画圆形
注意:border-radius是width/height的一半(50%)。
画半圆:
半圆的画法是把高度设为宽度的一半,并且也只设置左上角和右上角的半径,且半径为宽度的一半。
画四分之一圆:是把高度和宽度设置为相等,只设置一个圆角,其半径等于高度或宽度。
三、画椭圆
斜杠前面的一组四个值分别表示四个角的水平半径;斜杠后面的一组四个值分别表示四个角的垂直半径。
四、平行四边形
margin-left是为了使得平行四边形可以全部在浏览器中显示出来
五、梯形
高度为0。有宽度没高度。
六、五边形、六边形
style
#box{
width: 200px;
height: 100px;
background: red;
-moz-border-radius: 100px / 50px;
-webkit-border-radius: 100px / 50px;
border-radius: 100px / 50px;
}
/style
div id="box"/div
1、打开CSS新建一个图示的html文件。
2、下一步,需要在body标签那里添加图示的代码。
3、这个时候,可以添加style标签来设置图示的ellipse样式。
4、另外,还要在ellipse属性的里面添加图示的代码。
5、这样一来通过浏览器打开html文件即可把DIV做成椭圆形了。
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流