欢迎来到DIVCSS5查找CSS资料与学习DIV CSS布局技术!
    一、css什么是clip属性?
    clip属性剪裁绝对定位元素。clip属性允许定义一个元素的可见尺寸,当一幅图像的尺寸大于包含此元素时,此图像就会被修剪并显示为这个元素定义的形状。
    1.语法
    img{
    position:absolute;
    clip:rect(0px,60px,200px,0px);
    }
    代码示例:
    <!DOCTYPEhtml>
    <html>
    <head>
    <metacharset="UTF-8">
    <title></title>
    <style>
    .demo{
    width:200px;
    height:500px;
    margin:50pxauto;
    }
    img{
    border:1pxsolid#000;
    }
    .img{
    position:absolute;
    clip:rect(0px,165px,200px,34px);
    }
    </style>
    </head>
    <body>
    <divclass="demo">
    <h4>原图:</h4>
    <imgsrc="css.jpg"width="200"height="131"/>
    <h4>裁剪后</h4>
    <imgclass="img"src="css.jpg"width="200"height="131"/>
    </div>
    </body>
    </html>

5.jpg




本文转载自中文网

 

如需转载,请注明文章出处和来源网址:http://www.divcss5.com/css3-style/c57130.shtml