孙肖宁

CSS3中的文本阴影
text-shadow,可分别设置偏移量、模糊度、颜色(可设透明度)。1、水平偏移量 正值向右 负值向左;2、垂直...
扫描右侧二维码阅读全文
22
2018/05

CSS3中的文本阴影

text-shadow,可分别设置偏移量、模糊度、颜色(可设透明度)。
1、水平偏移量 正值向右 负值向左;
2、垂直偏移量 正值向下 负值向上;
3、模糊度是不能为负值;
4、可以设置多个阴影,每个阴影之间使用逗号隔开.
注意:可以有多个影子.
案例:凹凸文字效果

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>凹凸文字效果</title>
    <style>
        body{
            background-color: #666;
        }

        p{
            font-size:80px;
            text-align: center;
            font-weight: bold;
            font-family: "Microsoft Yahei";
            color:#666;
        }
        .tu{
            text-shadow: -1px -1px 1px #fff, 1px 1px 1px #000;
        }

        .ao{
            text-shadow: -1px -1px 1px #000, 1px 1px 1px #fff;
        }
    </style>
</head>
<body>
    <p class="ao">小宁博客--孙肖宁的个人博客</p>
    <p class="tu">小宁博客--孙肖宁的个人博客</p>
</body>
</html>
Last modification:May 22nd, 2018 at 11:07 am
If you think my article is useful to you, please feel free to appreciate

Leave a Comment