CSS - 創建高級形狀。（倒三角形？）

我試圖創建一個消息氣泡，看起來與此類似：CSS - 創建高級形狀。（倒三角形？）

然而，所有我可以管理是這樣的：

使用這CSS：

#messaging #test:after { 
    content: ""; 
    display: block; /* reduce the damage in FF3.0 */ 
    position: relative; 
    bottom: 0px; 
    left: 120px; 
    width: 0; 
    transform: rotate(180deg); 
    border-width: 32px 30px 0; 
    border-style: solid; 
    border-radius-top: 10; 
    border-color: black transparent; 
}

我試着使用border-radius，但它沒有yeild Ë預期的效果

來源

2016-05-12 Hobbyist

此頁面沒有您要查找的形狀，但它可以幫助您瞭解一些可能有所幫助的技巧：https://css-tricks.com/examples/ShapesOfCSS/ – Flynn1179

@ Flynn1179 - 月亮技巧非常酷，感謝鏈接。 – Hobbyist

我不知道這對你有什麼幫助，但我很高興它:) – Flynn1179

我會嘗試這樣的事情 - http://codepen.io/AndrewSepic/pen/EKJxqM

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

你可以添加其他元素從電視機的形狀，突出創建說話泡泡效果。想了解更多關於&不能做什麼的想法，我會去here。

來源

2016-05-12 19:07:44

問題在於如何創建泡沫效果，正如你可以從問題中看到的那樣，我已經有了框，以及附件。問題在於塑造依戀。你提供的鏈接已經在評論中提供，並沒有幫助 – Hobbyist

@愛好者你的消息氣泡對我來說並不直觀。但是，如果我理解正確，你將需要製作兩個形狀並將它們放在一起，以創建你想要的東西。祝你好運！ –

CSS - 創建高級形狀。 （倒三角形？）

回答

相關問題

CSS - 創建高級形狀。（倒三角形？）