1
我試圖創建具有不同寬度/高度的多個DIV的可變寬度和高度的圓角和粗糙邊緣的背景圖像。使用部分來創建高度和寬度可變的背景圖片的最佳方式是什麼？
您可以在開發here的網頁上看到我意思的圖像種類的示例。
這樣做對我來說最有意義的方法是在Photoshop中設計一個圖像，然後拼接兩個部分，一個20px乘20px的角部分，一個20px乘200px的部分。然後，這個想法將重用這些圖像，旋轉90,180和270度，以減少所需圖像的數量。然後，我將創建一個細分爲多個部分的DIV。這些部分將對應於角的大小，並且每個角都具有角的圖像的背景URL（旋轉3圈），或者對於側面部分將具有變化的寬度或高度，即20px。如果這些DIV的寬度/高度大於200像素，則會重複背景圖像。很明顯，我需要注意角部分如何與側面部分相連，由於邊緣的粗糙，這可能並不總是一個完美的連接，但我希望因爲它很粗糙也無所謂許多！由於整個圖像只使用一種顏色，因此圖像中央的DIV /部分將具有純色的背景色。
所以，我想知道這是否是最好的方式去做這件事，如果沒有，是什麼。如果是這樣，我將如何處理轉角/側面部分。我不認爲有一個可以做到這一點的背景屬性。這將是一個JavaScript的任務嗎？
感謝，
尼克
謝謝，我會考慮這一點。據我瞭解，雖然在IE中邊界圖像屬性不起作用。所以，我想知道是否最好在跨瀏覽器解決方案上工作，或者使用具有IE回退功能的border-image屬性，如果是這樣，那麼對於IE還有什麼回退？ – Nick
也許這將有助於：http://stackoverflow.com/questions/3567501/border-image-workaround-for-ie – Variant
謝謝。我現在使用邊界屬性。我無法得到IE版本的工作，所以我使用替代CSS樣式的IE瀏覽器 – Nick