-1

我需要在我们的 asp.net html 页面中绘制如下图所示的框。

我能够生成简单的盒子，但是如何在右侧和底部放置一个额外的层。

请建议我可以使用什么CSS？请帮助CSS代码。

谢谢，

在此处输入图像描述

4

6 回答 6

2

你需要盒子阴影。

div{
    width: 100px;
    height: 100px;
    border: 1px solid black;
    box-shadow: 3px 3px 0px 0px rgba(0,0,0,1);
}

类似的东西。

于 2013-10-30T10:14:20.810 回答
0

将此添加到您的盒子图层样式中。

div{   

 background:#fff;
 width:200px; height:200px;
 box-shadow:rgba(0,0,0,1) 1px 1px,
               rgba(0,0,0,1) 2px 2px,
               rgba(0,0,0,1) 3px 3px;

}
于 2013-10-30T10:14:27.733 回答
0 
.elementClass OR #elementId {
    border-bottom: 5px solid black;
    border-right: 5px solid black;
}

应该做的伎俩。只需更改 5px 直到获得正确的大小。

此外，通常你应该首先展示你自己的尝试。这不是一个适合您的网站，而是为已经开始的工作提供建议。这将大大增加您的问题得到解决的机会。

于 2013-10-30T10:14:28.377 回答
0

上面的效果是 box-shadow 效果：

试试这个：

div
{
width:300px;
height:100px;
border:1px solid black;
box-shadow: 10px 10px 5px #000000;
}

参考

于 2013-10-30T10:16:51.430 回答
0 
<div class="logbox"></div>

.logbox{
   height:50px;
    width:50px;
    background-color:#fff;
    border:1px solid #000;
    box-shadow: 0px 0px 0px #888888;
}
于 2013-10-30T10:18:42.143 回答
0

使用过滤器属性：

/* For IE 8 */      
-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, 
 Color='#000000')";     
/* For IE 5.5 - 7 */        
filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, 
Color='#000000');

我希望这对你有用。

于 2013-10-30T14:02:59.660 回答