Question

是否可以在不使用图片的情况下在div框内显示阴影？相反，我想使用css命令。

那么有一些命令如：-webkit-box-shadow: 1px inset;？

Answer 1

是的，有一个命令inset。像这样：

-webkit-box-shadow: 0 0 1px 3px #000 inset;
-moz-box-shadow: 0 0 1px 3px #000 inset;
box-shadow: 0 0 1px 3px #000 inset;

您可以从此处生成http://css3generator.com/

Answer 2

在CSS3 theres box-shadow中也可以插入来完全按照您的需要进行操作。以下浏览器支持此功能：

chrome＆gt; = 10.0（＆gt; = 4.0，-webkit - 前缀）
firefox＆gt; = 4.0（＆gt; = 3.5，-moz - 前缀）
IE＆gt; = 9.0
opera＆gt; = 10.5
safari＆gt; = 5.1（＆gt; = 5.0，-webkit - 前缀）

Answer 3

您可以使用Box shadow generator进行阴影效果。我将举例说明如何使用盒子阴影生成器。

第1步：转到：Box Shadow Generator

第2步：调整要添加的阴影属性。

步骤3：然后使用＆＃34;复制文本＆＃34;复制css代码。按钮。

步骤4：然后您可以将css代码传递到样式表文件中。

这样做。

<html>
<head>
    <title>Title</title>
    <style type="text/css">
    #banner{

        position: absolute;
        width: 100%;
        height: 150px;
        background-color: #4E6C88;
        -webkit-box-shadow: -1px 9px 18px 0px rgba(0,0,0,0.75);
        -moz-box-shadow: -1px 9px 18px 0px rgba(0,0,0,0.75);
        box-shadow: -1px 9px 18px 0px rgba(0,0,0,0.75);
    }

    </style>
</head>
<body>
 <div id="banner">    

 </div>
</body>
</html>

谢谢...;）

div里面的阴影

3 个答案: