css中clip屬性的定義和用法-創(chuàng)新互聯(lián)

本篇內(nèi)容主要講解“css中clip屬性的定義和用法”，感興趣的朋友不妨來看看。本文介紹的方法操作簡單快捷，實用性強。下面就讓小編來帶大家學(xué)習(xí)“css中clip屬性的定義和用法”吧!

堅守“ 做人真誠 · 做事靠譜 · 口碑至上 · 高效敬業(yè) ”的價值觀，專業(yè)網(wǎng)站建設(shè)服務(wù)10余年為成都成都石雕小微創(chuàng)業(yè)公司專業(yè)提供企業(yè)網(wǎng)站制作營銷網(wǎng)站建設(shè)商城網(wǎng)站建設(shè)手機網(wǎng)站建設(shè)小程序網(wǎng)站建設(shè)網(wǎng)站改版，從內(nèi)容策劃、視覺設(shè)計、底層架構(gòu)、網(wǎng)頁布局、功能開發(fā)迭代于一體的高端網(wǎng)站建設(shè)服務(wù)。

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

clip屬性語法

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);

瀏覽器支持

所有主流瀏覽器都支持clip屬性。

注釋：任何的版本的InternetExplorer（包括IE8）都不支持屬性值"inherit"。

clip屬性定義和用法

clip屬性剪裁絕對定位元素。

說明

這個屬性用于定義一個剪裁矩形。對于一個絕對定義元素，在這個矩形內(nèi)的內(nèi)容才可見。出了這個剪裁區(qū)域的內(nèi)容會根據(jù)overflow的值來處理。剪裁區(qū)域可能比元素的內(nèi)容區(qū)大，也可能比內(nèi)容區(qū)小。

默認(rèn)值： auto

繼承性： no

版本： CSS2

JavaScript語法： object.style.clip="rect(0px,50px,50px,0px)"

可能的值

值描述

shape 設(shè)置元素的形狀。合法的形狀值是：rect(top,right,bottom,left)

auto 默認(rèn)值。不應(yīng)用任何剪裁。

inherit 規(guī)定應(yīng)該從父元素繼承clip屬性的值。

到此，相信大家對“css中clip屬性的定義和用法”有了更深的了解，不妨來實際操作一番吧！這里是創(chuàng)新互聯(lián)建站，更多相關(guān)內(nèi)容可以進入相關(guān)頻道進行查詢，關(guān)注我們，繼續(xù)學(xué)習(xí)！

網(wǎng)站題目：css中clip屬性的定義和用法-創(chuàng)新互聯(lián)
網(wǎng)頁URL：http://muchs.cn/article10/eisdo.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供商城網(wǎng)站、云服務(wù)器、自適應(yīng)網(wǎng)站、靜態(tài)網(wǎng)站、品牌網(wǎng)站制作、做網(wǎng)站

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源：創(chuàng)新互聯(lián)

猜你還喜歡下面的內(nèi)容