與邊框圖像的虛線邊框

-2

我有三個與背景圖像和11或內容疊加的圖層2。與邊框圖像的虛線邊框

在內容我放置了輸入按鈕標籤與虛線寄宿生。

我試圖實現的是從第1層只在破折號獲得相同的背景層圖像。

明顯背景：透明沒有爲第二選擇工作，所以我使用的輸入邊界，並試圖通過從層1

enter image description here

.button { 
font-family:verdana, sans-serif; 
font-size: 20px; 
font-weight: bold; 
background: transparent; 
border-width:5px; 
border-style:dashed; 
border-color: black; }

邊界圖像設置爲背景圖像來模擬此行爲

所以周圍的提交按鈕的所有短劃線應該有一個像左邊

第一層相同的背景我把它改爲：

enter image description here

.button { 
font-family:verdana, sans-serif; 
font-size: 20px; 
font-weight: bold; 
background: transparent; 
border-width:5px; 
border-style:dashed; 
border-color: black; 
border-image: url(/img/bg1.jpg); }

我沒有任何想法如何實現虛線的外觀與邊境圖像

有：邊界圖像：網址（/img/bg1.jpg）30 30發; enter image description here

http://jsfiddle.net/6vKdh/3/

來源

2014-04-05 Tom

如果顯示什麼在第一幅圖像就是你想要實現，那麼我不明白一個簡單的虛線邊框將無法實現這一點。 – CBroe

CSS語法border-image是這樣的：

border-image: source slice width outset repeat|initial|inherit;

所以，你在那裏失去了一些東西。

嘗試更換您border-image

border-image: url(/img/bg1.jpg);

這個例子：

border-image: url(/img/bg1.jpg) 30 30 round;

更多的文檔看看這個：CSS3 Border-Image

來源

2014-04-05 13:24:09 dippas

之前嘗試過，但仍然失去破折號，我在我的問題中添加了截圖。 – Tom

你可以用你的圖像設置一個小提琴，這樣我們可以更好地幫助你嗎？ – dippas

http://jsfiddle.net/6vKdh/3/ – Tom

與邊框圖像的虛線邊框

回答

相關問題