在文本內容周圍顯示內嵌框之後的陰影

我試圖實現一種效果，即具有緊跟文本內容的陰影。在文本內容周圍顯示內嵌框之後的陰影

我已經證明我的進步在這裏：https://codepen.io/wolfr/pen/QEGOdY?editors=1100

text-shadow不適合我的需要。它產生一個劣質的陰影（測試：https://codepen.io/wolfr/pen/KMNyXj?editors=1100）

我目前的做法的問題是，它是非常糟糕的人使用屏幕閱讀器。

我已經嘗試了幾種方法來隱藏HTML內容被另一支筆中的sceen閱讀器讀取。它們包括使用媒體查詢和speak: none屬性。他們都沒有工作。因爲我實際上需要它的佈局，所以我無法將這個箱子放在屏幕外（經典的方法）。我也嘗試在:before attribute中隱藏內容，但這也不起作用。

來源

2016-06-22 Wolfr

請說明您的具體問題或添加額外的細節，突顯正是你需要的。正如目前所寫，很難確切地說出你在問什麼。 –

你想製作一個跟在周圍的文字？如果這樣做，您可以使用多個文字陰影來製作更精細的陰影。

p { 
 
    color: #d53400; 
 
    font-size: 32pt; 
 
    font-weight: 500; 
 
    text-shadow: 2px 0 8px #555, -2px 0 0 #555, 0 2px 0 #555, 0 -2px 0 #555, 1px 1px #555, -1px -1px 0 #555, 1px -1px 4px #555, -1px 1px 0 #555; 
 
    text-align: center; 
 
}

<p>Text shadow<br />This is another line</p>

來源

2016-06-22 13:23:40

在文本內容周圍顯示內嵌框之後的陰影

回答

相關問題