自增高度宽度,修饰边框实现终极篇-----金字塔==也就是上下左右的滑动门

achun.shx

这个方案可是终极方案,所有自增高度宽度的问题全都解决了,并且可以对边框进行背景图片的修饰.
其中的css部分我就不写了.
相信只要是熟悉的朋友一看就明白了,问题不在css上,而在你的 DOM 结构上.
看我的blog吧,排版好那么一点
当然其他对应的文章可以也评评.

[ 本帖最后由 achun.shx 于 2007-6-8 17:43 编辑 ]

achun.shx

贴的图是到蓝色上用的
蓝色上可运行,看的清楚,
http://bbs.blueidea.com/thread-2755008-1-1.html

frank533

lz，在firefox上运行不正常。页面被撑破了

[ 本帖最后由 frank533 于 2007-6-17 22:35 编辑 ]

achun.shx

不是被撑破了,而我选用的图片只是为了说明原理.
是你的内容太多,图片太小.实际工作中图片一般选,800,1024,1600宽的,那就撑不破了.
另外蓝色上的css代码是我随手写的.只是说明原理.
下面是正确的css定位例子

1. 
   
2. .tr{
   
3. position:relative;
   
4. right:-14px;
   
5. }
   
6. 
   
7. .bl{
   
8. position:relative;
   
9. left:-14px;
   
10. padding:11px 0px 0px;
    
11. }
    
12. .br{
    
13. position:relative;
    
14. padding:0px 0px 15px;
    
15. right:-14px;
    
16. }
    
17. .ml{
    
18. position:relative;
    
19. left:-14px;
    
20. }
    
21. .mr{
    
22. position:relative;
    
23. right:-14px;
    
24. padding:14px 16px 14px 0px;
    
25. }
    

复制代码

其实你仔细观察就会明白其中的 left,right,或者padding中的值对应的就是
边框的四条边(角)的尺寸.