0
点赞
收藏
分享

微信扫一扫

文字阴影与盒子阴影的对比效果

罗子僧 2022-05-02 阅读 56
html5

<!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>文字阴影与盒子阴影的对比</title>

    <style>

        h1{

            font-size:60px;

            color: rgb(169, 235, 247);

            font-weight:700;

            font-family:'隶书';

            text-shadow:10px 10px 12px rgb(161, 164, 165);

             }

      div{

        width:200px;

        height:200px;

        background-color: rgb(42, 151, 165);

        padding:5px;

        box-shadow: 10px 10px 5px #888888;

        text-align: center;

    }

    </style>

</head>

<body>

    <h1>忠于自己热爱生活</h1>

    <div>前程似锦,未来可期。</div>

</body>

</html>

举报

相关推荐

0 条评论