如何实现像这样的曲线?

时间:2012-12-03 15:49:15

标签: html css

我正在创建一个新网站,我希望重新创建SAVE 25%横幅的弯角。 http://www.sonycreativesoftware.com/

有谁知道我会用css或html做到这一点?

干杯

4 个答案:

答案 0 :(得分:2)

将图片用作background-image,并在元素

上应用border-radius
div
{
    background-image:url('http://placehold.it/350x150');
    width:350px;height:150px;
    border-radius:5px;
}​

http://jsfiddle.net/mdNCm/1/


您可以使用border-radius.com生成跨浏览器CSS

答案 1 :(得分:2)

是的,使用border-radius

CSS:

div.rounded{
    border-radius: 5px;
    border: 1px solid black;
}

HTML:

<div class="rounded">This text is in a rounded border!</div>

答案 2 :(得分:1)

这是一项css3功能,尚未完全支持所有浏览器。进一步了解此标签:

border-radius: 25px;

答案 3 :(得分:0)

你可以实现这一目标 border-radius:5px;

如果你想要一个走投无路的边框,请使用它。 Border-radius.com 这给了你代码。

注意:border-radius不适用于某些浏览器,例如

或者,你可以在css中使用一些图像作为背景。