CSS文本效果

Posted 2020-06-25

/* CSS Document */

p{
     font-size:50px;
     text-shadow:1px 1px 2px red;                           【左右阴影、上下阴影、模糊度、颜色】
     text-shadow:-1px -1px 2px blue;                       【负数代表左上】
     text-shadow:1px 0px 2px rgb(15,13,125),          【阴影参数可叠加】
                        3px 0px 2px rgb(150,121,56), 
                        4px 0px 2px rgb(170,221,56),
                        10px 0px 2px rgb(110,21,56),
                        15px 0px 2px rgb(196,56,85),

     width:180px;
     background-color:orange;
     white-space:nowrap;           【不换行】
     overflow:hidden;                 【文本隐藏】
     text-overflow:clip;               【文本裁剪】
     text-overflow:ellipsis;          【文本省略】

-webkit-text-stroke:1px red;
-webkit-text-stroke-width:3px;
-webkit-text-stroke-color:yellow; 【测试前缀：描边】

color:red;
-webkit-text-fill-color:red;*/
font-family:"黑体";
-webkit-text-fill-color:transparent; 【填充：透明】

}