使用HTML和CSS创建L形边框,是否可能？

Question

是否可以仅使用HTML和CSS创建这样的L形边框？

编辑:这就是我现在所拥有的:http://jsfiddle.net/cBwh8/

编辑2:我想复制上面的图片 - 适当弯曲的圆角.这是我在这里遇到困难的主要原因:http://jsfiddle.net/cBwh8/1/

Answer 1

是的。

http://jsfiddle.net/HwKGx/1/

<div id="one">
    <div id="two">&nbsp;</div>
</div>   

#one {
    margin:10px;
    width:45px;
    height:75px;
    border:2px solid #333; }
#two{
    float:left;
    width:35px;
    height:65px;
    border-width:2px;
    border-style:solid;
    margin:-2px 0 0 -2px;
    border-color:#FFF #333 #333 #FFF;
}?

Answer 2

试试这个：为我工作

div.outer {
    margin: 10px;
    width: 200px;
    height: 200px;
    border: 1px solid blue;
    border-radius: 10px;
}

div.inner {
    width: 160px;
    height: 160px;
    border-right: 1px solid blue;
    border-bottom: 1px solid blue;
    margin-top:-1px;
    margin-left:-1px;
    background:#FFF;
}