html怎么设置div阴影

html设置div阴影的方法:使用css样式中“box-shadow”属性为div添加阴影效果,只需要在html中添加“box-shadow: 0px 0px 100px 10PX black;”样式代码设置阴影效果即可。

html怎么设置div阴影

示例代码:

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>阴影效果</title>

<style type="text/css">

div{

position: absolute;

left: 300px;

top: 300px;

width: 300px;

height: 300px;

box-shadow: 0px 0px 100px 10PX black;

border: 1px solid black;

}

</style>

</head>

<body>

<div>

</div>

</body>

</html>

效果如下:

html怎么设置div阴影

box-shadow 向框添加一个或多个阴影。该属性是由逗号分隔的阴影列表,每个阴影由 2-4 个长度值、可选的颜色值以及可选的 inset 关键词来规定。省略长度的值是 0。

语法:

box-shadow: h-shadow v-shadow blur spread color inset;

属性值:

  • h-shadow 必需。水平阴影的位置。允许负值。

  • v-shadow 必需。垂直阴影的位置。允许负值。

  • blur 可选。模糊距离。

  • spread 可选。阴影的尺寸。

  • color 可选。阴影的颜色。

  • inset 可选。将外部阴影 (outset) 改为内部阴影。

我们的服务
专业提供中小企业网站建设.公司网站建设.外贸网站建设.营销型网站建设,响应式网站建设,商城网站定制,手机网站,微信小程序定制.php应用开发服务,公司成立于2014年,8年专注网站建设,秉承“以客户为根本,以科技为核心,以市场为导向”的经营理念;服务电话13714666846(微信同号)

声明:本站所有作品(图文、音视频)均由用户自行上传分享,或互联网相关知识整合,仅供网友学习交流,若您的权利被侵害,请联系 管理员 删除。

本文链接:http://news.ew35.com/