成人无码视频,亚洲精品久久久久av无码,午夜精品久久久久久毛片,亚洲 中文字幕 日韩 无码

資訊專欄INFORMATION COLUMN

要準(zhǔn)確裁剪背景圖片先要準(zhǔn)確渲染,background-origin與background-clip

zzbo / 2373人閱讀

摘要:當(dāng)然背景圖片默認(rèn)的渲染狀態(tài)是從區(qū)域開始渲染的,我們?cè)跊]有確認(rèn)渲染的區(qū)域時(shí),后期所做的裁剪工作實(shí)際上都是對(duì)照默認(rèn)渲染區(qū)區(qū)域來進(jìn)行裁剪的。

概念

background-origin: 背景圖片從盒子哪里開始渲染
background-clip: 背景圖片裁剪到盒子哪里

取值

background-origin:

默認(rèn)值:背景圖片從padding區(qū)域開始渲染
boder-box: 背景圖片從邊框里面開始
padding-box:背景圖片從padding區(qū)域開始渲染
content-box: 背景圖片從內(nèi)容區(qū)域開始渲染

background-clip:

默認(rèn)值: 背景圖片裁剪到padding區(qū)域最外層邊緣線
boder-box: 背景圖片裁剪到邊框最外層邊緣線
padding-box: 背景圖片裁剪到padding區(qū)域最外層邊緣線
content-box: 背景圖片裁剪到內(nèi)容區(qū)域最外層邊緣線

起步

我們?cè)谑褂帽尘皥D片時(shí),肯定首先是要確認(rèn)我們的背景圖片要從哪里開始渲染,
確定了渲染的狀態(tài), 我們才能準(zhǔn)確的對(duì)背景圖片進(jìn)行裁剪。當(dāng)然背景圖片默認(rèn)的渲染狀態(tài)是從padding區(qū)域開始渲染的,我們?cè)跊]有確認(rèn)渲染的區(qū)域時(shí),后期所做的裁剪工作實(shí)際上都是對(duì)照默認(rèn)渲染區(qū)padding區(qū)域來進(jìn)行裁剪的。

圖文助解

background-origin:

代碼:




    
    
    


圖片:

background-clip:

代碼:




    
    
    


圖片:

以上就是對(duì)background-origin和background-clip的解述,我們?cè)诓眉舯尘皥D片做某些效果時(shí)就一定得準(zhǔn)確的先渲染。如果以上那些地方理解有誤還請(qǐng)指點(diǎn),筆者會(huì)虛心學(xué)習(xí)。

文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址:http://m.hztianpu.com/yun/51186.html

相關(guān)文章

  • 準(zhǔn)確裁剪背景圖片準(zhǔn)確渲染,background-originbackground-clip

    摘要:當(dāng)然背景圖片默認(rèn)的渲染狀態(tài)是從區(qū)域開始渲染的,我們?cè)跊]有確認(rèn)渲染的區(qū)域時(shí),后期所做的裁剪工作實(shí)際上都是對(duì)照默認(rèn)渲染區(qū)區(qū)域來進(jìn)行裁剪的。 概念 background-origin: 背景圖片從盒子哪里開始渲染background-clip: 背景圖片裁剪到盒子哪里 取值 background-origin: 默認(rèn)值:背景圖片從padding區(qū)域開始渲染 boder-box: 背景圖片從邊...

    cooxer 評(píng)論0 收藏0
  • [譯]HTML&CSS Lesson7: 設(shè)置背景和漸變色

    摘要:屬性值則依賴于我們需要?jiǎng)?chuàng)建什么樣的漸變背景,例如線性漸變或放射性漸變。我們會(huì)在線性漸變中介紹不同種類的供應(yīng)商前綴,但為了簡便起見,放射性漸變中我們不會(huì)再提及。線性漸變多年來,設(shè)計(jì)師和開發(fā)者們都是通過切圖來實(shí)現(xiàn)漸變背景。 背景對(duì)網(wǎng)站的設(shè)計(jì)有重大的影響。它有利于建立網(wǎng)站的整體感覺,設(shè)置分組,分配優(yōu)先級(jí),對(duì)網(wǎng)站的可用性也有相當(dāng)大的影響。 在CSS中,元素的背景可以是一個(gè)純色,一張圖,一個(gè)漸變...

    bang590 評(píng)論0 收藏0
  • [譯]HTML&CSS Lesson7: 設(shè)置背景和漸變色

    摘要:屬性值則依賴于我們需要?jiǎng)?chuàng)建什么樣的漸變背景,例如線性漸變或放射性漸變。我們會(huì)在線性漸變中介紹不同種類的供應(yīng)商前綴,但為了簡便起見,放射性漸變中我們不會(huì)再提及。線性漸變多年來,設(shè)計(jì)師和開發(fā)者們都是通過切圖來實(shí)現(xiàn)漸變背景。 背景對(duì)網(wǎng)站的設(shè)計(jì)有重大的影響。它有利于建立網(wǎng)站的整體感覺,設(shè)置分組,分配優(yōu)先級(jí),對(duì)網(wǎng)站的可用性也有相當(dāng)大的影響。 在CSS中,元素的背景可以是一個(gè)純色,一張圖,一個(gè)漸變...

    jk_v1 評(píng)論0 收藏0
  • [譯]HTML&CSS Lesson7: 設(shè)置背景和漸變色

    摘要:屬性值則依賴于我們需要?jiǎng)?chuàng)建什么樣的漸變背景,例如線性漸變或放射性漸變。我們會(huì)在線性漸變中介紹不同種類的供應(yīng)商前綴,但為了簡便起見,放射性漸變中我們不會(huì)再提及。線性漸變多年來,設(shè)計(jì)師和開發(fā)者們都是通過切圖來實(shí)現(xiàn)漸變背景。 背景對(duì)網(wǎng)站的設(shè)計(jì)有重大的影響。它有利于建立網(wǎng)站的整體感覺,設(shè)置分組,分配優(yōu)先級(jí),對(duì)網(wǎng)站的可用性也有相當(dāng)大的影響。 在CSS中,元素的背景可以是一個(gè)純色,一張圖,一個(gè)漸變...

    Tonny 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

閱讀需要支付1元查看
<