在談到這個問題:css3 border-image firefox 15.0.1CSS3邊框圖像火狐15.0.1(第二輪)
我解決與Firefox的最新版本(15.0.1),現在邊境圖像特徵去的問題。但是出現了一個新問題。內容沒有填充圖像。
在所有的瀏覽器中,背景填充的都是邊框圖像,除了新版本的firefox。
我的類:
border-style: solid none solid solid;
border-width: 12px 0 12px 12px;
border-image: url("img/contents-entry.png") 12 0 12 12 stretch; /* CSS3 recommendation */
-moz-border-image: url("img/contents-entry.png") 12 0 12 12 stretch stretch; /* old Firefox */
-o-border-image: url("img/contents-entry.png") 12 0 12 12 stretch; /* Opera */
-webkit-border-image: url("img/contents-entry.png") 12 0 12 12 stretch; /* Safari */
background-color: transparent;
感謝
UPDATE: 這是我在http://jsfiddle.net/angelcervera/8YWXs/測試:
div {
border-width:15px;
width:250px;
padding:10px 20px;
background-color: red;
}
#round {
border-style: solid;
border-image:url("http://www.norabrowndesign.com/css-experiments/images/border1.png") fill 30 30 30 30 stretch;
-moz-border-image:url("http://www.norabrowndesign.com/css-experiments/images/border1.png") 30 30 30 30 stretch; /* Firefox */
-webkit-border-image:url("http://www.norabrowndesign.com/css-experiments/images/border1.png") 30 30 30 30 stretch; /* Safari */
-o-border-image:url("http://www.norabrowndesign.com/css-experiments/images/border1.png") 30 30 30 30 stretch; /* Opera */
}
我說:
- background-color:red;以div樣式區分白色背景頁面和div背景。
- border-style:solid; border-image:url(「border.png」)填充30 30 30 30 stretch;在#round樣式工作在Firefox中,但不填寫。
- 我改變了圖像與不透明的圖像。
我用一個示例測試編輯。 – angelcervera