[已解决]求助 直角边框 在线等

1.jpg (6.38 KB)

2010-6-4 08:13

这样的直角边框如何实现?  在线等.

..我的做法是..- -..
<div style="右边框">
<div style="下边框"></div>
</div>

请大侠不吝赐教.. 一个Div可以做俩个边框么..

[ 本帖最后由 yzbczq 于 2010-6-4 13:22 编辑 ]

作者: yzbczq   发布时间: 2010-06-04

作者: lifee   发布时间: 2010-06-04

没看到你这个图有什么左边框，扩展性好一点的话，背景图和底边可以作为一个背景，然后右边那跟线repeat-y。
用sprites图的话，可以考虑直接大背景...

作者: 14px   发布时间: 2010-06-04

作者: harky   发布时间: 2010-06-04

引用:

原帖由 14px 于 2010-6-4 09:29 发表
没看到你这个图有什么左边框，扩展性好一点的话，背景图和底边可以作为一个背景，然后右边那跟线repeat-y。
用sprites图的话，可以考虑直接大背景...

不好意思..是右边框和下边框~
大哥..
右边那根线怎么搞?  囧rz..
不是一个div只能设置一个背景图片么...

=============
同时谢谢cloudgamer童鞋帮我转移
谢谢14px童鞋帮我选择分类.~.. 太感动了..

[ 本帖最后由 yzbczq 于 2010-6-4 10:28 编辑 ]

作者: yzbczq   发布时间: 2010-06-04

作者: yzbczq   发布时间: 2010-06-04

最好用图片实现，毕竟IE对CSS3不是很支持，不过，现在有一个htc可以让IE通过VML的方式支持CSS3的border-radius（圆角），box-shadow（阴影），text-shadow（文本阴影）：

复制内容到剪贴板

代码:

.box {
  -moz-border-radius: 15px; /* Firefox */
  -webkit-border-radius: 15px; /* Safari and Chrome */
  border-radius: 15px; /* Opera 10.5+, future browsers, and now also Internet Explorer 6+ using IE-CSS3 */
  -moz-box-shadow: 10px 10px 20px #000; /* Firefox */
  -webkit-box-shadow: 10px 10px 20px #000; /* Safari and Chrome */
  box-shadow: 10px 10px 20px #000; /* Opera 10.5+, future browsers and IE6+ using IE-CSS3 */
  behavior: url(ie-css3.htc); /* 可以让IE 6,7,8模拟部分的CSS3属性 */
}

注意：htc文件是要放在服务器上，放在本地测试是不行的！

附件

ie-css3.zip (3.52 KB)

2010-6-4 11:08, 下载次数: 3

IE简单支持CSS

作者: candysfm   发布时间: 2010-06-04

作者: yzbczq   发布时间: 2010-06-04

作者: coderjoy   发布时间: 2010-06-04

作者: coderjoy   发布时间: 2010-06-04