css边框阴影怎么设置


本文摘自PHP中文网,作者藏色散人,侵删。

在css中可以通过box-shadow属性设置一个或多个下拉阴影的框,该属性的使用语法如“box-shadow:Xpx Ypx Zpx #888888;”,其中X表示横向阴影,Y表示纵向阴影,Z表示渐变效果,“#888888”表示阴影颜色。

本文操作环境:windows7系统、HTML5&&CSS3版、Dell G3电脑。

CSS设置边框阴影效果

box-shadow属性可以设置一个或多个下拉阴影的框。

1

box-shadow: Xpx Ypx Zpx #888888;

X:横向阴影(偏移值)

Y:纵向阴影(偏移值)

Z:渐变效果

#888888:阴影颜色

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

<!DOCTYPE html>

<html>

<head>

<style>

div

{

width:300px;

height:100px;

background-color:yellow;

box-shadow: 12px 12px 500px #888888;

}

</style>

</head>

<body>

<div></div>

</body>

</html>

【推荐学习:css视频教程】

以上就是css边框阴影怎么设置的详细内容,更多文章请关注木庄网络博客

相关阅读 >>

css z-index属性怎么用

css hover的用法

如何合理使用css框架?

bootstrap和css区别

html标签伪元素绑定事件的三种方式

css怎么设置首行缩进2字符

css怎么隐藏横向滚动条

css怎么设置文本框大小

css怎么占位隐藏元素

css a不换行怎么设置

更多相关阅读请进入《css》频道 >>




打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

评论

管理员已关闭评论功能...