-5

我有一个虚线框的设计:

在此处输入图像描述

用css3创建它的最佳方法是什么?

我曾尝试使用'border:dashed' - 但它看起来不像我需要的设计。

我想知道是否有办法只用css而不使用背景图片来做到这一点

4

4 回答 4

4

尝试用两个 DIV 框来实现

<!DOCTYPE html>
<html>
<head>
<style>

#outside {
width:400px;
height:150px;
border-style:dashed; border-width:3px;
position: relative; 
}
#inside {
background-color: white;
width:404px;
height:154px;
position: absolute;
top:-2px;
left:-2px;
}
</style>
</head>

<body>
<div id="outside">
<div id="inside">
</div>
</div>
</body>

</html>

http://jsfiddle.net/RH5R3/

于 2013-10-30T12:01:09.273 回答
3
border:1px dashed grey;

JSFiddle

于 2013-10-30T11:43:17.510 回答
2
.box {
    width: 400px;
    height: 200px;
    border: dashed 1px gray;  
}

JSFiddle:http: //jsfiddle.net/8Gxys/

于 2013-10-30T11:43:12.750 回答
0
 Try this:

    css:

        #xx {
            width: 400px;
            height: 200px; 
        }


        HTML:

        <div style="border:dotted"" id="xx"></div>
于 2013-10-30T11:50:58.450 回答