现在的位置: 首页 > 综合 > 正文

[转]HTML图片部分显示–利用矩形区…

2018年08月30日 ⁄ 综合 ⁄ 共 703字 ⁄ 字号 评论关闭


原文来自:
http://www.cnblogs.com/firstdream/archive/2012/01/30/2331663.html


在html  
的img属性里只显示图片的部分区域(矩形,给出开始点和结束点),其他部份不显示,也不要拉伸


方法1:



<div   style=
"position:absolute;left:0px;  
top:0px;width:600px;   height:400px;
  clip:rect(10px   30px
  30px   10px) ">
<img   src= "1.jpg
">
</div> 



rect   (   number
  number   number
  number   )   :
 
 依据上-右-下-左的顺序提供自图片左上角为(0,0)坐标计算的四个偏移数值,其中任一数值都可用auto替换,即此边不剪切
  



你需要rect   (   startY
  endX   endY  
startX   )
  


方法2:



也可以这样写: 



<img   src= "1.jpg "
  width= "600 "   height= "300 "
  style= "position:absolute;left:0px;
  top:0px;clip:rect(100px   300px
  300px   100px)
">



存在的弊病:采用绝对定位,使定位困难



.fleft_tp{background:url(/resource/moneychat/style/images/quamnet/bg_head_home2.jpg)  
no-repeat  
fixed  
360px  
0px;overflow:visible;width:710px;height:90px;}

抱歉!评论已关闭.