css的background屬性

琛ｈ。發(fā)布于2019-08-28 18:28 / 1044人閱讀

摘要：背景屬性如下設(shè)置或檢索對(duì)象的背景特性設(shè)置或檢索對(duì)象的背景顏色設(shè)置或檢索對(duì)象的背景圖像設(shè)置或檢索對(duì)象的背景圖像如何鋪排填充設(shè)置或檢索對(duì)象的背景圖像是隨對(duì)象內(nèi)容滾動(dòng)還是固定的設(shè)置或檢索對(duì)象的背景圖像位置新增的設(shè)置或檢索對(duì)象的背景圖像

背景background屬性如下：

background:設(shè)置或檢索對(duì)象的背景特性
background-color:設(shè)置或檢索對(duì)象的背景顏色
background-image:設(shè)置或檢索對(duì)象的背景圖像
background-repeat:設(shè)置或檢索對(duì)象的背景圖像如何鋪排填充
background-attachment:設(shè)置或檢索對(duì)象的背景圖像是隨對(duì)象內(nèi)容滾動(dòng)還是固定的
background-position:設(shè)置或檢索對(duì)象的背景圖像位置
css3新增的:
background-origin:設(shè)置或檢索對(duì)象的背景圖像顯示的原點(diǎn)
background-clip:檢索或設(shè)置對(duì)象的背景向外裁剪的區(qū)域
background-size:檢索或設(shè)置對(duì)象的背景圖像的尺寸大小

background-origin： [ , ]*
= border-box | padding-box | content-box

div
{ padding:25px;
border:10px dotted #000000;
background-image:url("/i/eg_smile.gif");
background-origin:content-box;
background-repeat:no-repeat;}

div
{ padding:25px;
border:10px dotted #000000;
background-image:url("/i/eg_smile.gif");
background-origin:border-box;
background-repeat:no-repeat;}

 div
{ padding:25px;
border:10px dotted #000000;
background-image:url("/i/eg_smile.gif");
background-origin:padding-box;
background-repeat:no-repeat;}

云服務(wù)器 GPU云服務(wù)器 css屬性訪問CSS屬性 position屬性，css 獲取CSS屬性值

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

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/111254.html

相關(guān)文章

[實(shí)踐總結(jié)]純css實(shí)現(xiàn)動(dòng)態(tài)邊框

摘要：另外一種實(shí)現(xiàn)思路是添加四個(gè)來分別實(shí)現(xiàn)上下左右的邊框效果，雖然可行，但是要添加四個(gè)額外元素，有點(diǎn)兒得不償失的感覺。背景這幾天工作中遇到一個(gè)交互需求，要求實(shí)現(xiàn)一個(gè)效果，當(dāng)鼠標(biāo)移入一個(gè)元素的時(shí)候，元素出現(xiàn)一個(gè)動(dòng)態(tài)的邊框，如圖： showImg(https://user-gold-cdn.xitu.io/2019/5/15/16aba8a2ccb58e4e);動(dòng)態(tài)邊框思路看到這個(gè)效果，我首先想...

BlackHole1 2019-05-23 16:28 評(píng)論0 收藏0
CSS學(xué)習(xí)筆記(七) 背景

摘要：任何方向上都不重復(fù)只讓背景圖片顯示一次。，背景圖片就會(huì)以段落的中心點(diǎn)為起點(diǎn)。第一個(gè)值表示水平位置，第二個(gè)值表示垂直位置。拉大圖片，使其完全填滿背景區(qū)保持寬高比。提示漸變是幫我們生成的背景圖片。在CSS里面，每個(gè)元素盒子都可以想象成由兩個(gè)圖層組成。前景層：內(nèi)容（如文本或圖片）和邊框。背景層：用實(shí)色填充（使用 background-color 屬性），也可以包含任意多個(gè)背景圖片（...

Pikachu 2019-08-28 18:03 評(píng)論0 收藏0
圖解CSS3 讀書筆記——背景

摘要：將保持背景的原始高度和寬度。對(duì)于平鋪的重復(fù)性背景圖像，確保背景圖像不會(huì)有截?cái)嘈Ч?。解決屏幕雙倍像素下背景圖像模糊問題。將大圖縮小一倍使用鏈接或者列表元素的背景圖像能和文本一起進(jìn)行縮放。內(nèi)聯(lián)元素背景圖像平鋪循環(huán)方式暫無文章多背景 CSS背景屬性基本屬性 background-color: 默認(rèn)值為transparent，可以以顏色名、rgb(css3新增rgba)、hls(css3中新...

felix0913 2019-08-28 18:23 評(píng)論0 收藏0
CSS 設(shè)計(jì)指南學(xué)習(xí)筆記二

摘要：原文地址本篇文章是筆者的設(shè)計(jì)指南學(xué)習(xí)筆記的第二部分，由于最近都在準(zhǔn)備期末考的事，所以都沒來得及對(duì)設(shè)計(jì)指南進(jìn)行一些總結(jié)，沒有看之前第一部分的話也可以從這里傳送過去。原文地址：http://justclear.github.io/css-stylin-with-css-note-2 本篇文章是筆者的《CSS 設(shè)計(jì)指南》學(xué)習(xí)筆記的第二部分，由于最近都在準(zhǔn)備期末考的事，所以都沒來得及對(duì) ...

printempw 2019-08-30 12:47 評(píng)論0 收藏0
css學(xué)習(xí)歸納總結(jié)（二）

摘要：子選擇器只對(duì)直接后代有影響的選擇器，而對(duì)孫子后代以及多層后代不產(chǎn)生作用。爛透了盡可能使用復(fù)合語(yǔ)法糟糕好的避免不必要的重復(fù)糟糕好的組織好的代碼格式代碼的易讀性和易維護(hù)性成正比。標(biāo)簽與元素標(biāo)簽和p元素有什么區(qū)別呢？大多數(shù)時(shí)候他們表示的是同一樣?xùn)|西，但仍有細(xì)微的區(qū)別。、等指的是HTML分隔符，而元素則是由一對(duì)開始結(jié)束標(biāo)簽構(gòu)成的，用來包含某一些內(nèi)容子選擇器和后代選擇器的區(qū)別：后代選擇器...

KnewOne 2019-08-28 18:00 評(píng)論0 收藏0
前端面試之CSS3新特性

摘要：和這三個(gè)特性是新增的和動(dòng)畫相關(guān)的特性。使用方式如下和變換類型可以有各種變換類型，即屬性值定義不進(jìn)行轉(zhuǎn)換。設(shè)置列之間的寬度樣式和顏色規(guī)則和和用戶界面中，新的用戶界面特性包括重設(shè)元素尺寸盒尺寸以及輪廓等。除了html5的新特性，CSS3的新特性也是面試中經(jīng)常被問到的。選擇器 CSS3中新添加了很多選擇器，解決了很多之前需要用javascript才能解決的布局問題。 element1~...

glumes 2019-08-29 12:53 評(píng)論0 收藏0