css中clip屬性是什么意思

發(fā)布時(shí)間：2022-03-02 11:11:56 來源：億速云閱讀：266 作者：小新欄目：web開發(fā)

小編給大家分享一下css中clip屬性是什么意思，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！

一、css什么是clip屬性？

clip屬性剪裁絕對(duì)定位元素。clip屬性允許定義一個(gè)元素的可見尺寸，當(dāng)一幅圖像的尺寸大于包含此元素時(shí)，此圖像就會(huì)被修剪并顯示為這個(gè)元素定義的形狀。

1.語法

img{

position:absolute;

clip:rect(0px,60px,200px,0px);

}

代碼示例：

<!DOCTYPEhtml>

<html>

<head>

<metacharset="UTF-8">

<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">

<imgsrc="css.jpg"width="200"height="131"/>

<imgclass="img"src="css.jpg"width="200"height="131"/>

</div>

</body>

</html>

css中clip屬性是什么意思

以上是“css中clip屬性是什么意思”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對(duì)大家有所幫助，如果還想學(xué)習(xí)更多知識(shí)，歡迎關(guān)注億速云行業(yè)資訊頻道！

向AI問一下細(xì)節(jié)

猜你喜歡