CSS 如何实现让div的四个边框都有阴影的效果?

用三个div叠加的方法我试过,给html加了个背景色就不行了,还有没有别的方法?... 用三个div叠加的方法我试过,给html加了个背景色就不行了,还有没有别的方法? 展开
 我来答
e日分享
2018-08-29 · 热衷于互联网分享,部分素材来自网络侵删
e日分享
采纳数:6 获赞数:13106

向TA提问 私信TA
展开全部

<title>css怎么给4个边框添加阴影</title>

<style type="text/css">

span{         box-shadow: 2px 4px 6px #000;         }        </style>

</head>    <body>        <span>百度知道“css怎么给4个边框添加阴影”</span>    </body>

简单的解释一下相关的代码属性

box-shadow: 2px 4px 6px #000

首先2px :  表示水平阴影的位置,然后4px : 表示垂直阴影的位置,接着5px : 表示模糊距离,最后#000 : 表示阴影的颜色(#000  黑色)

拓展资料:

层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。CSS不仅可以静态地修饰网页,还可以配合各种脚本语言动态地对网页各元素进行格式化。

参考资料:百度百科-CSS

迷夨灬果兒ゞ6e3a8f
2015-09-10 · TA获得超过963个赞
知道小有建树答主
回答量:486
采纳率:100%
帮助的人:385万
展开全部

用CSS3中的box-shadow属性就可以了

.class{box-shadow: 1px 1px 5px 5px #888888;}
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
菲律宾英语游学
2018-06-20 · 南崎菲律宾游学,出国英语培训
菲律宾英语游学
从中国到菲律宾,从菲律宾到世界。南崎立足中国,致力于架起一座中国与菲律宾的桥梁,欢迎广大学员随时随地联系我们。
向TA提问
展开全部

CSS 实现让div的四个边框都有阴影的效果:

首先:

HTML代码

<h1>CSS 如何实现让div的四个边框都有阴影的效果?</h1>

<div class="g1">

<div class="g2"></div>

</div>

CSS代码

body{background:#f00;}

html{background:#f00;}/*html加背景色*/

.g1{

width:500px;

height:500px;

border:2px solid #fff;

margin:30px auto;

background-color:#fff;

box-sizing:border-box;

}

.g2{

width:400px;

height:400px;

margin:50px auto;

border:2px solid #000;

box-shadow:5px 5px 5px #000,5px -5px 5px #000,-5px 5px 5px #000,-5px -5px 5px #000;

}

具体效果:

本回答被网友采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
百度网友12136da
高粉答主

2018-06-02 · 繁杂信息太多,你要学会辨别
知道大有可为答主
回答量:634
采纳率:100%
帮助的人:11.6万
展开全部

使用CSS3中的box-shadow属性“.class{box-shadow: 1px 1px 5px 5px #888888};”即可。

拓展资料:


1、CSS:层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言,CSS不仅可以静态地修饰网页,还可以配合各种脚本语言动态地对网页各元素进行格式化。

2、CSS 能够对网页中元素位置的排版进行像素级精确控制,支持几乎所有的字体字号样式,拥有对网页对象和模型样式编辑的能力。


已赞过 已踩过<
你对这个回答的评价是?
评论 收起
dfang2012
2012-09-08 · 超过21用户采纳过TA的回答
知道答主
回答量:120
采纳率:0%
帮助的人:57.5万
展开全部
做成有阴影效果的图片 在css里面写background
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
收起 更多回答(7)
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式