CSS-文本阴影

最新推荐文章于 2024-10-02 23:33:51 发布

骑猪西征

最新推荐文章于 2024-10-02 23:33:51 发布

阅读量122

点赞数

分类专栏： CSS 笔记文章标签： CSS text-shadow 阴影效果网页设计前端开发

本文链接：https://blog.csdn.net/weixin_57936267/article/details/124684713

版权

笔记同时被 2 个专栏收录

29 篇文章 0 订阅

订阅专栏

CSS

21 篇文章 1 订阅

订阅专栏

代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        /* div{
            text-shadow:7px 9px 2px red,7px 9px 2px yellow;
           这么写表示红+黄，两种颜色混合起来，然后就变成橙色了
            
        }
        
        /*第一个值 7px  水平方向的控制  
        第二个值 9px  垂直方向的位移
        第三个值 2px  模糊程度
        
        最后是阴影颜色
        写多个同属性标签会覆盖掉前面的标签
        */
        div{
            text-shadow:7px 9px 2px brown,7px -11px 2px gray;
        }
        /* 上下阴影 */
    </style>
</head>
<body>
<div>
    未经人苦，莫劝人善。
</div>    
</body>
</html>