html中图片阴影怎么写,html – 如何组合CSS文本阴影和“background-image：-webkit-gradient”...

渐变“消失”,因为文本阴影位于背景上方.

>文字(透明)

阴影

>背景.

我们可以通过复制文本并将其放在原始图层下面,然后在那里应用阴影,for example：

h1 {

position: relative;

font-size: 100px;

text-align: center;

}

h1 div {

background-image: -webkit-gradient(linear, left top, left bottom, from(white), to(black));

-webkit-background-clip: text;

-webkit-text-fill-color: transparent;

position: absolute;

width: 100%;

}

h1:after {

text-shadow: 10px 10px 11px #fff;

color: transparent;

}

#hello:after {

content: 'Hello World';

}

Hello World