CSS3中p標籤上的雙重文字陰影

是否可以在CSS3中的一個p標籤上應用兩個文字陰影？我想用1像素邊框創建一個非常淺的黑色背景。CSS3中p標籤上的雙重文字陰影

事情是這樣的：

text-shadow: 0 0 55px black; (very light black background to increase white text readabilitiy) 
& 
text-shadow: 0 1px 0 rgba(0,0,0, .25); (one pixel black drop shadow)

來源

2014-03-04 Warre Buysse

你能不能同時陰影存儲在一個類中的每個並將其應用到了必要的p標籤？ –

你甚至可以用'text-shadow'創建3D文本，只需要在逗號分隔的列表中結合一些文本陰影，某人已經在那裏做了一些示例，只是搜索自己以查看「文本陰影」的實際操作。 –

你可以簡單的用逗號單獨的陰影：

text-shadow: 0 0 55px black, 0 1px 0 rgba(0,0,0, .25);

Demo fiddle

您可能要have a look at this article on MDN進一步的信息。

text-shadow CSS屬性爲文本添加陰影。它接受要應用於文本的逗號分隔的陰影列表以及元素的文本裝飾。

將每個陰影指定爲與文本的偏移以及可選顏色和模糊半徑值。多個陰影是從前到後應用的，第一個指定的陰影在上面。

來源

2014-03-04 09:59:27 SW4

啊甜，我正在嘗試文字陰影：0 0 55px黑色，文字陰影：...和（顯然）沒有工作。謝謝！ –

似乎這種方法在Safari（在OSX上）中不起作用。 Safari上的結果：http：//d.pr/i/U6bp Chrome上的結果：http：//d.pr/i/xT20 Chrome瀏覽器具有非常輕的盒子陰影，Safari採用了不同的方式。任何解決方案使用的代碼：text-shadow：0 0 55px rgba（0,0,0，.5），0 1px 0 rgba（0,0,0，.25）; –

您需要尋找一個Javascript解決方案，例如http://www.hintzmann.dk/testcenter/js/jquery/textshadow/ – SW4

您可以嘗試使用此代碼：

p { text-shadow: 1px 1px 1px #000, 3px 3px 5px blue; }

REF：CSS SHADOW TRICKS

來源

2014-03-04 10:02:00

CSS3中p標籤上的雙重文字陰影

回答

相關問題