CSS背景組合類型

CSS3背景自定義是一個強大的工具，但它對我來說缺少一個特性。我可以通過幾種方式設置背景位置，但我需要這些組合。例如，有一個動態調整大小的div，我需要一個右邊界爲15px的右中心定位圖像。我找不到處理這個問題的方法。我可以使用兩個修復程序，它們都不是很優雅。
1.我在圖片的右側留下一個空白的15px區域。
2.我使用這個：background-position：97％50％
但是，在第二種情況下，如果div被重新調整大小，則計算出的右邊距將不正確。或者，我使用標準圖像而不是bg-image，但我儘量避免這種情況。
那麼，有沒有解決辦法？
謝謝！CSS背景組合類型

來源

2011-08-09 marcias

你還需要div中的文字才能一路走到正確的位置嗎？或者它也可以從右側15px？ – Alex

div內的文字與左邊對齊。當然，文本不能超過img，所以我需要放一個正確的填充。「 – marcias

」而且，當然文字不能超過img。「那麼這與「背景圖像」用於XD的情況大致相反。如果你想讓圖像成爲一個沒有文字的物理實體，我會使用一個img標籤，我可以把這些東西放在一起。 – Alex

CSS3延伸background-position允許。例如，你可以這樣做：

background-position: right 15px bottom 15px;

不幸的是，只有Opera目前支持這個。

但是，你需要的常見原因是你有一個15px的填充。如果是這樣的話，你可以這樣做：

background-origin: content-box; 
background-position: right bottom;

這是每個CSS3瀏覽器支持。

來源

2011-08-10 18:38:18

這絕對是我正在尋找的！正如你所描述的那樣，填充現在將圖像從邊界移開。謝謝！ – marcias

CSS背景組合類型

回答

相關問題