CSS clip ÊôÐÔ

ʵÀý

¼ô²ÃͼÏñ£º

img
  {
  position:absolute;
  clip:rect(0px,60px,200px,0px);
  }

Ç××ÔÊÔÒ»ÊÔ

ä¯ÀÀÆ÷Ö§³Ö

ËùÓÐÖ÷Á÷ä¯ÀÀÆ÷¶¼Ö§³Ö clip ÊôÐÔ¡£

×¢ÊÍ£ºÈκεİ汾µÄ Internet Explorer £¨°üÀ¨ IE8£©¶¼²»Ö§³ÖÊôÐÔÖµ "inherit"¡£

¶¨ÒåºÍÓ÷¨

clip ÊôÐÔ¼ô²Ã¾ø¶Ô¶¨Î»ÔªËØ¡£

µ±Ò»·ùͼÏñµÄ³ß´ç´óÓÚ°üº¬ËüµÄÔªËØÊ±»á·¢ÉúÊ²Ã´ÄØ£¿"clip" ÊôÐÔÔÊÐíÄú¹æ¶¨Ò»¸öÔªËØµÄ¿É¼û³ß´ç£¬ÕâÑù´ËÔªËØ¾Í»á±»ÐÞ¼ô²¢ÏÔʾΪÕâ¸öÐÎ×´¡£

˵Ã÷

Õâ¸öÊôÐÔÓÃÓÚ¶¨ÒåÒ»¸ö¼ô²Ã¾ØÐΡ£¶ÔÓÚÒ»¸ö¾ø¶Ô¶¨ÒåÔªËØ£¬ÔÚÕâ¸ö¾ØÐÎÄÚµÄÄÚÈݲſɼû¡£³öÁËÕâ¸ö¼ô²ÃÇøÓòµÄÄÚÈÝ»á¸ù¾Ý overflow µÄÖµÀ´´¦Àí¡£¼ô²ÃÇøÓò¿ÉÄܱÈÔªËØµÄÄÚÈÝÇø´ó£¬Ò²¿ÉÄܱÈÄÚÈÝÇøÐ¡¡£

ĬÈÏÖµ£º auto
¼Ì³ÐÐÔ£º no
°æ±¾£º CSS2
JavaScript Óï·¨£º object.style.clip="rect(0px,50px,50px,0px)"

¿ÉÄܵÄÖµ

Öµ ÃèÊö
shape ÉèÖÃÔªËØµÄÐÎ×´¡£Î¨Ò»ºÏ·¨µÄÐÎ×´ÖµÊÇ£ºrect (top, right, bottom, left)
auto ĬÈÏÖµ¡£²»Ó¦ÓÃÈκμô²Ã¡£
inherit ¹æ¶¨Ó¦¸Ã´Ó¸¸ÔªËؼ̳Рclip ÊôÐÔµÄÖµ¡£

TIY ʵÀý

ÉèÖÃÔªËØµÄÐÎ×´
±¾ÀýÑÝʾÈçºÎÉèÖÃÔªËØµÄÐÎ×´¡£´ËÔªËØ±»¼ôÈëÐÎ×´ÖУ¬È»ºóÏÔʾ³öÀ´¡£

Ïà¹ØÒ³Ãæ

CSS ½Ì³Ì£ºCSS ¶¨Î»

HTML DOM ²Î¿¼Êֲ᣺clip ÊôÐÔ

VUE