css中的航空效果

如何使用css獲取航空玻璃箱效果。我的用戶可以動態地將背景圖像設置爲他感興趣的任何東西。所以我想要一個玻璃盒，這將是動態的，而不是像根據具體背景開發的玻璃盒......css中的航空效果

準確地說..我想實現什麼顯示在這個鏈接..標題下：他們叫我Mr.Glass： http://dev.opera.com/articles/view/beautiful-ui-styling-with-css3-text-shadow-box-shadow-and-border-radius/#glassbox

但是這必須是動態的，應該適用於任何背景。此外，我還想了解如何才能知道適合我們目的的顏色值，並創建這樣的效果，即使它是特定於背景的。它只是經驗或是他們的任何工具..？請解釋.... 我會非常喜歡上述的css技術...

來源

2010-12-11 sasidhar

我認爲你必須更具體一點。 – Trufa 2010-12-11 18:26:31

具體關於什麼..？我的意思是，我想要這個玻璃盒，它應該適用於所有背景，這就是我的要求...... – sasidhar 2010-12-11 18:29:25

好，我真的不明白你的問題是什麼，因爲你給的例子似乎很好地工作動態設置背景，看看下面這個例子：

http://jsfiddle.net/GGhKg/1603/

相關代碼：

background: rgba(0,0,0,0.25); 
    box-shadow: 0 2px 6px rgba(0,0,0,0.5), inset 0 1px rgba(255,255,255,0.3), inset 0 10px rgba(255,255,255,0.2), inset 0 10px 20px rgba(255,255,255,0.25), inset 0 -15px 30px rgba(0,0,0,0.3); 
    -o-box-shadow: 0 2px 6px rgba(0,0,0,0.5), inset 0 1px rgba(255,255,255,0.3), inset 0 10px rgba(255,255,255,0.2), inset 0 10px 20px rgba(255,255,255,0.25), inset 0 -15px 30px rgba(0,0,0,0.3); 
    -webkit-box-shadow: 0 2px 6px rgba(0,0,0,0.5), inset 0 1px rgba(255,255,255,0.3), inset 0 10px rgba(255,255,255,0.2), inset 0 10px 20px rgba(255,255,255,0.25), inset 0 -15px 30px rgba(0,0,0,0.3); 
    -moz-box-shadow: 0 2px 6px rgba(0,0,0,0.5), inset 0 1px rgba(255,255,255,0.3), inset 0 10px rgba(255,255,255,0.2), inset 0 10px 20px rgba(255,255,255,0.25), inset 0 -15px 30px rgba(0,0,0,0.3);

只需點擊鏈接，看看我在說什麼。

這是你的意思嗎？

祝你好運！

來源

2010-12-11 18:55:36 Trufa

該技術將：將glassBox CSS代碼放入一個類。代替div {}使用.glass {}，並將其放在背景圖片上，爲此，您需要從背景div中複製希望用戶更改的CSS屬性。

來源

2010-12-11 18:42:34

正如Akinator所說，你需要更具體，因爲它看起來低估了實現這一過程的複雜性。 – 2010-12-11 18:44:14

我的意思是如果你想要這樣做的代碼。 – 2010-12-11 18:54:16

css中的航空效果

回答

相關問題