DIV與圓角和尖角

Question

我正在做一個DIV，我想使兩側圓角。問題是，我不希望角落圓角，但尖尖。有什麼建議麼？

Answer 1

like tv screen 

#tv { 
    position: relative; 
    width: 200px; 
    height: 150px; 
    margin: 20px 0; 
    background: red; 
    border-radius: 50%/10%; 
    color: white; 
    text-align: center; 
    text-indent: .1em; 
} 
#tv:before { 
    content: ''; 
    position: absolute; 
    top: 10%; 
    bottom: 10%; 
    right: -5%; 
    left: -5%; 
    background: inherit; 
    border-radius: 5%/50%; 
} 

FIDDLE：http://jsfiddle.net/arjun_chaudhary/LBaNY/

Answer 2

我真的不知道我知道你要問什麼，但像這樣的東西嗎？

您可以通過使用兩個div的是這樣實現的：

<div class="container"> 
    <div class="inner"> 
     Here's some text 
    </div> 
</div> 

然後你就可以將背景圖片只需添加到您的「容器」 DIV或CSS玩。以下是我在前面的示例中使用的內容：

<style type="text/css"> 
.container { 
    border-radius: 80px; 
    background-color: #d6d6d9; 
    padding: 10px; 
    width: 200px; 
} 
.inner { 
    background-color: #d6d6d9; 
    padding: 40px; 
    text-align: center; 
} 
</style> 

我強烈建議您上傳圖片以闡明您的請求。