写进度条的时候用过这个方法，记录一下
它的用法是
.test{ clip: rect(<top>, <right>, <bottom>, <>left); }
方向是按顺时针走的。
具体这四个值代表什么意思，看下面这几张图就明白了。
Demo
<!doctype html> <html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0"> <title>Clip</title> <style type="text/css"> *{ margin: 0; padding: 0; } .wrapper{ width: 100%; position: relative; } .woodman { position: absolute; top: 0; right: 0; clip: rect(52px, 280px, 290px, 95px); } </style> </head> <body> <div class="wrapper"> <img src="woodman.jpg"/> <img src="woodman.jpg" class="woodman"/> </div> </body> </html>
结果如下
