取巧的边框等高

来源:Prower 时间:2009-12-16 12:11:00 

左右结构是平常页面中最经常看到的结构,简洁一些的页面就会使用边框将左右两边隔开,但往往由于左右两边的内容可能是不等高的,所以就会有一高一低的现象。这个时候不管是给A写个边框还是给B写个边框,都会有高低不平,解决这个边框的高低不平之前有看过很多解决方法,但总的来说有些复杂,其实有一种取巧的方法就可以做到,那就是利用CSS属性中的负值。

比如这个示例图中的边框,取一个DIV将A、B两部分都包容起来,然后写border:1px solid #000;再给A容器写右边框border-right:1px solid #000;B容器也写边框border-left:1px solid #000;这样不管哪边高哪边低,都会保证起码有一条边框线是从头到底的。

但这样两条边框线就会造成重复,于是可以给B容器写margin-left:-1px;这样让两条边框重叠在一起,即可解决边框重复的问题。

标签:边框,等高,css,border
0
投稿

猜你喜欢

  • asp中字符编码转换的10个函数[荐]

    2007-11-11 10:32:00
  • 如何防止Application对象在多线程访问中出现错误?

    2009-11-22 19:18:00
  • 详解CSS3中的属性选择符

    2008-04-24 14:30:00
  • PS笔刷,样式,形状、渐变、滤镜载入方式及使用

    2007-10-17 11:47:00
  • js随机永不重复数

    2011-04-25 19:26:00
  • 从浏览器想开去

    2008-07-29 12:52:00
  • 一个拖动层和Onmouse自动下拉效果

    2007-10-08 21:25:00
  • 如何优化网站图片以快速显示

    2008-04-05 10:09:00
  • ASP把数字用逗号每3位隔开显示代码

    2008-01-02 13:11:00
  • JavaScript Date()在页面内显示日期

    2008-02-05 10:18:00
  • asp获取客户端的MAC地址

    2007-08-17 10:58:00
  • window.location.hash的应用及浏览器的支持测试

    2009-07-07 11:52:00
  • 从语义开始–概念、意义、实践

    2010-06-13 18:06:00
  • { hide_text } CSS文字隐藏总结报告

    2010-06-13 17:19:00
  • CSS网页设计时关于字体大小的设计

    2008-10-23 13:42:00
  • IE8"开发人员工具"使用详解

    2009-03-26 12:51:00
  • 用正则表达式表示不包含2950的字符串

    2010-03-02 22:10:00
  • 解析:轻松掌握 字符串文字字符集和校对

    2008-12-17 17:07:00
  • Mini,又个 Javascript 选择器

    2009-10-06 14:48:00
  • 提高javascript的速度系列(序)

    2008-07-15 12:38:00
  • asp之家 网络编程 m.aspxhome.com