摘要:快捷鍵補(bǔ)充到這里屬性基本就講完了,然后我們還有一些的屬性沒(méi)有講,但是要用到盒子模型,現(xiàn)在我們沒(méi)有學(xué)盒子模型,所以不用講背景圖片和插入圖片區(qū)別我們先來(lái)看一個(gè)例子如何快速的打出以下代碼鍵現(xiàn)在,我們要分別用背景圖片和插入圖片的方式插入
快捷鍵補(bǔ)充:
bc? background-color:;
bi??background-image:;
bgr?background-repeat:;
gp??background-position:;
ba??background-attachment:;
bg +??background:#fff? ?url()? ?0? 0? no-repeat;
到這里屬性基本就講完了,然后我們還有一些CSS3的屬性沒(méi)有講,但是要用到CSS盒子模型,現(xiàn)在我們沒(méi)有學(xué)盒子模型,所以不用講
1.背景圖片和插入圖片區(qū)別?
我們先來(lái)看一個(gè)例子
如何快速的打出以下代碼?
div.box$*2? ?tab鍵
現(xiàn)在,我們要分別用背景圖片和插入圖片的方式插入兩張圖片,要讓div的寬和高等于圖片的寬和高
現(xiàn)在我們要在.box1中放一些內(nèi)容
1.1 背景圖片僅僅是一個(gè)裝飾,不會(huì)占用位置,插入圖片會(huì)占用位置
我們修改了一些代碼
我現(xiàn)在,想把左上角的背景圖移到右下角,背景圖片有定位屬性,我可以在第一個(gè)div的范圍任意修改位置
這樣我們背景圖就移到了div的右下角,而我們想把box2的圖片移動(dòng)到右下角,目前我們沒(méi)有知識(shí)能夠做到
1.2背景圖片有定位屬性,所以可以很方便的控制圖片的位置,插入圖片沒(méi)有定位屬性,所以控制圖片的位置不太方便
1.3插入圖片的語(yǔ)義比背景圖片要強(qiáng),所以企業(yè)開(kāi)發(fā)中如果你的圖片想被搜索引擎收錄,那么推薦使用插入圖片
文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址:http://www.ezyhdfw.cn/yun/2094.html
摘要:注意點(diǎn)同一個(gè)標(biāo)簽可以同時(shí)設(shè)置背景顏色和背景圖片,如果顏色和圖片同時(shí)存在,那么圖片會(huì)覆蓋顏色,但凡給我們的標(biāo)簽設(shè)置了背景圖片以后,我們發(fā)現(xiàn)這個(gè)圖片一直在左上角,我如果不想讓它在左上角應(yīng)該怎么辦呢這就要用到我們這節(jié)課的內(nèi)容。注意點(diǎn):同一個(gè)標(biāo)簽可以同時(shí)設(shè)置背景顏色和背景圖片,如果顏色和圖片同時(shí)存在,那么圖片會(huì)覆蓋顏色, 但凡給我們的標(biāo)簽設(shè)置了背景圖片以后,我們發(fā)現(xiàn)這個(gè)圖片一直在左上角,我如果不想...
摘要:和都可以把信息獨(dú)立稱一個(gè)小小都區(qū)域。有的人在這里用,這里不推薦,因?yàn)槭怯糜诤捅韱卧剡M(jìn)行綁定的,它和表單元素搭配使用的。和有什么區(qū)別會(huì)單獨(dú)的占一行,而不會(huì)單獨(dú)占一行。是一個(gè)容器級(jí)別的標(biāo)簽,而是一個(gè)文本級(jí)別的標(biāo)簽。為什么在這里講解div和span呢,而不在html中講解呢? 因?yàn)樵谖覀兊拈_(kāi)發(fā)中div和span一般是配合css來(lái)使用的,來(lái)完成一定的效果,來(lái)設(shè)置一些屬性,在前面我們沒(méi)有學(xué)習(xí)css,...
摘要:如何設(shè)置背景圖片在中有一個(gè)叫做的屬性,就是專門(mén)用于設(shè)置背景圖片的。1.如何設(shè)置背景圖片? 在css中有一個(gè)叫做background-image:url();的屬性,就是專門(mén)用于設(shè)置背景圖片的。 注意點(diǎn): 1.圖片的地址必須放在url()中,圖片的地址是本地的地址,也可以是網(wǎng)絡(luò)的地址 2.如果圖片的大小沒(méi)有標(biāo)簽的大小大,那么會(huì)自動(dòng)在水平和垂直方向平鋪和填充 3.如果網(wǎng)頁(yè)上出現(xiàn)了圖片,那...
摘要:如何控制背景圖片的平鋪方式在中有一個(gè)屬性,就是專門(mén)用于控制背景圖片的平鋪方式的取值默認(rèn),在水平和垂直都需要平鋪在水平和垂直都不需要平鋪只在水平方向平鋪只在垂直方向平鋪應(yīng)用場(chǎng)景先看原理圖片可以通過(guò)背景圖片的平鋪來(lái)降低圖片的大小,提升網(wǎng)1.如何控制背景圖片的平鋪方式? 在CSS中有一個(gè)background-repeat屬性,就是專門(mén)用于控制背景圖片的平鋪方式的 取值: repeat? ?默認(rèn),在...
摘要:我們來(lái)看控制背景圖片的位置,在企業(yè)開(kāi)發(fā)中用在什么地方呢我們打開(kāi)一個(gè)網(wǎng)站,如盛大游戲,保存它的背景圖到本地我們先點(diǎn)擊檢查,查看背景圖的地址然后將地址復(fù)制到地址欄中然后將圖片保存到本地工程的文件夾中然后在網(wǎng)頁(yè)中先用打開(kāi)發(fā)現(xiàn)圖片不能完全顯示,然我們來(lái)看控制背景圖片的位置,在企業(yè)開(kāi)發(fā)中用在什么地方呢?1.我們打開(kāi)一個(gè)網(wǎng)站,如盛大游戲,保存它的背景圖到本地 http://www.sdo.com/ 我們...
閱讀 3166·2021-09-08 10:43
閱讀 1095·2019-08-30 15:53
閱讀 1093·2019-08-30 13:51
閱讀 923·2019-08-29 14:03
閱讀 869·2019-08-26 18:35
閱讀 1294·2019-08-26 13:38
閱讀 1677·2019-08-26 10:34
閱讀 3575·2019-08-26 10:21