css盒子阴影

最新推荐文章于 2024-08-31 09:24:27 发布

原创最新推荐文章于 2024-08-31 09:24:27 发布 · 199 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#css

js 同时被 2 个专栏收录

65 篇文章

订阅专栏

css

45 篇文章

订阅专栏

文章介绍了CSS的box-shadow属性，用于给网页元素添加阴影，包括设置水平和垂直偏移量、模糊半径、阴影扩展以及颜色，以此提升页面视觉细节和用户体验。

作用:给盒子添加阴影效果，吸引用户注意，体现页面的制作细节
属性名: box-shadow
取值:

参数	作用
h-shadow	必须，水平偏移量。允许负值
V-shadow	必须，垂直偏移量。允许负值
blur	可选，模糊度
spread	可选，阴影扩大
color	可选，阴影颜色
inset	可选，将阴影改为内部阴影

<style>
        div{
            width: 1200px;
            height: 30px;
            /*          水平 垂直 模糊度 阴影扩大*/
            box-shadow: 10px 10px 20px 10px gray ;
        }
    </style>
</head>
<body>
    <div></div>
</body>