css3数字字体样式,css

css

body {

padding: 5rem 0;

background: -webkit-linear-gradient(45deg, #f857a6, #e65245);

background: linear-gradient(45deg, #f857a6, #e65245);

background-attachment: fixed;

}

p {

position: relative;

z-index: 5;

text-align: center;

font: caption;

font-size: 10vw;

font-weight: 900;

text-shadow: 5px 5px 0px rgba(0, 0, 0, 0.1);

margin: 0;

max-width: 900px;

margin: 0 auto;

}

.gradient:nth-child(1) {

background: -webkit-linear-gradient(0deg, #1CD8D2, #93EDC7);

background: linear-gradient(90deg, #1CD8D2, #93EDC7);

-webkit-background-clip: text;

-webkit-text-fill-color: transparent;

}

.gradient:nth-child(2) {

background: -webkit-linear-gradient(0deg, #ECE9E6, #FFFFFF);

background: linear-gradient(90deg, #ECE9E6, #FFFFFF);

-webkit-background-clip: text;

-webkit-text-fill-color: transparent;

}

.gradient:nth-child(3) {

background: -webkit-linear-gradient(270deg, #C9FFBF, #FFAFBD);

background: linear-gradient(180deg, #C9FFBF, #FFAFBD);

-webkit-background-clip: text;

-webkit-text-fill-color: transparent;

}

.gradient:nth-child(4) {

background: -webkit-linear-gradient(0deg, #B993D6, #8CA6DB);

background: linear-gradient(90deg, #B993D6, #8CA6DB);

-webkit-background-clip: text;

-webkit-text-fill-color: transparent;

}