亚洲欧美精品沙发,日韩在线精品视频,亚洲Av每日更新在线观看,亚洲国产另类一区在线5

<pre id="hdphd"></pre>

  • <div id="hdphd"><small id="hdphd"></small></div>
      學(xué)習(xí)啦 > 學(xué)習(xí)電腦 > 電腦技巧 > 怎么讓div的大小隨著背景圖片的大小變大

      怎么讓div的大小隨著背景圖片的大小變大

      時(shí)間: 本達(dá)868 分享

      怎么讓div的大小隨著背景圖片的大小變大

        在做網(wǎng)頁(yè)的時(shí)候,經(jīng)常會(huì)遇到為div添加背景圖片,那么我們應(yīng)該怎樣做才能讓div的大小隨著背景圖片的變大而變大呢,也就是讓我們的div被背景圖片所撐起來(lái)。下面學(xué)習(xí)啦小編告訴你!

        讓div的大小隨著背景圖片的大小變大的方法

        首先,我們需要新建一個(gè)html頁(yè)面,并在頁(yè)面中寫上一個(gè)div。并為div添加背景圖片,為背景圖片添加一些基本的樣式。

        然后,我們按下鍵盤上的F12,查看其在瀏覽器中的效果。效果肯定是頁(yè)面中沒(méi)有相應(yīng)的背景圖片,理由是我們做的是背景圖片,無(wú)法將div撐起一定的高度。

        既然不能撐起來(lái),我們也不能單純的為div設(shè)置高度,這樣無(wú)法解決不同大小背景圖片的問(wèn)題,我們可以利用css中的偽元素::after或者::before

        可以簡(jiǎn)單的解釋一下,利用偽元素是將指定標(biāo)簽的前面或者后面的內(nèi)容設(shè)為空,并設(shè)成塊元素,并設(shè)定以百分比為單位的padding-bottom或者padding-top。以此撐開(kāi)這個(gè)div。

        另一種方法是,我們?cè)谟斜尘皥D片的div的內(nèi)部再套一個(gè)div,然后為這個(gè)內(nèi)部的div添加相應(yīng)的樣式,使得外層div可以被撐起來(lái)。

        這里我采用的是和第一個(gè)相同的做法,為這個(gè)內(nèi)部div設(shè)定內(nèi)部邊距上或者下都可以。同樣是以百分比作為單位。這樣我們?cè)俅卧跒g覽器中查看,就可以看到作為背景的圖片了。

        最后告訴大家一些注意事項(xiàng),不管我們采用方法一還是方法二,都是設(shè)置的上下的內(nèi)邊距而不是外邊距,并且要以百分比作為單位。

      看了“怎么讓div的大小隨著背景圖片的大小變大”的人還看了

      1.如何讓div的大小隨著背景圖片的大小變大

      2.如何為一個(gè)div添加多個(gè)背景圖片

      3.word怎么設(shè)置背景圖片大小

      4.ppt怎么設(shè)置背景大小

      2207187