1  2  3  4 
       5  6 12 13 14 
      
       15     
       
16 
      
17 18 

html{ height:100%; overflow:hidden;}//此处让其跟文档height一样

body{margin:0;  height:100%; overflow:auto;}//此处也是让其跟html元素的height一样，相对html元素

.box{height:2000px;}

.div{width:100px;height:100px;background:red; position:absolute;left:100px;top:100px;}//此处用了绝对定位，而此处的定位是相对文档的，当滚动条滚动的时候自然这里，没有相对html滚动，从而达到固定定位fix遮掩的效果（兼容性很好）

 

 

1  2  3  4 
       5  6 11 12 13 
      
       14     
       
15 
      
16 17 

_position:absolute;_top:expression(eval(document.documentElement.scrollTop+100)); 这里针对的ie6以下不支持fix属性，来模拟的。性能不是很好

 

 

1  2  3  4 
       5  6 11 12 13 
      
       14     
       
       15 
      
16 17 

图片块中居中，这种方式兼容性很好，语法也简单

 

1 

这种方式没有上面的好用。不推荐

 

 

 

1  2  3  4 
       5  7 13 14 15 
      
       16     
       
17         
18             文字文字文字文字文字字文字文字文字文字文字文字字文字文字文字文字文字文字字文字19             文字20         
21     
22     
       
23         
24             字文字文字字文字25             文字26         
27     
28     
       
29         
30             文文字字文字文字文字文字文字文字字文字31             文字32         
33     
34     
       
35         
36             字文字文字文字字文字37             文字38         
39     
40 
      
41 42 

li元素里分为左右两块元素，右边元素一直跟在左侧内容后边并距离左侧元素10px间距，左侧元素宽度由左侧内容撑开。如果左右两侧内容总宽度超出了li宽度，就把左侧多出的文字隐藏掉