好了現在我們插入了第一張切圖，在DW里F12預覽看看。。。

臥槽，這什么鬼，為毛和其他的區域重疊了，為毛我縮小瀏覽器的時候出現了這么無節操的情況。

嘿嘿，原因我們先不深究，這里主要是想讓大家了解一下這樣是不行滴。

我們得用第二種插入圖片的方法-在CSS中作為背景插入。總是插入插入什么的我都有點臉紅了呢，哎臥槽，我為什么要臉紅？？？

額，說CSS，首先回顧下上次的代碼，額好吧上面回顧過了。

之前我們給每個DIV都加了同一個名字叫做box并且賦予了這個名字一些屬性，呵呵呵我咋想起游戲里的稱號了呢，帶屬性的名字，艾瑪這個解釋好。那接下來首先呢咱們得給box這個名字再加一個屬性，至于為神馬，嘿嘿，高級篇中自有妙用。

這個意思就是包住并且別蓋住，懂不懂不，包住，但是里面那事兒變大了你也得跟著變大，不能蓋住人家。

啊，不能亂想，繼續寫代碼。

好了，現在我們要給每一個DIV賦予它們自己獨特的名字了

按照DIV的名字或者按照序號什么的，寫出這幾個新的屬性，我的是9個分區，就寫了9個名字并給它們寫上屬性，這里為了簡單就用bg1這樣的形式寫了，如果是工作中的項目的話肯定不能這樣寫的，要代碼語義化，具體的知識等開支線劇情來講吧。

這里屬性的意思大家應該大致明白，首先是背景：圖片地址 水平對齊 垂直對齊，然后是寬度百分百，高度要跟著當前插入的圖片走，因為是背景圖片，DIV也就是容器本身是不會因為背景圖片而自適應的。

然后把這些榮耀的名字賜予每一個DIV吧

看到沒有看到沒有，比游戲還diao，每個角色可以佩戴多個稱號，只要中間用空格分開就行，太淫蕩了有木有，太不要臉了有木有。

好嘞，現在我們再來F12一下，當然你在之前預覽的頁面刷新也行。

粗來了粗來了，網頁粗來了，噢也。

額，有些奇怪的東西在，哈哈，是我們上節課加的邊框，還有每個區域的名字。把這些東東刪掉再看，喔，醉了，這是我第一個網頁，就好比月球上那個小腳印一樣，意義非凡啊。

讓我們再看一下全部的代碼吧

是不是特有成就感，是不是感覺到了春天~~~

嘛，孩子，這只是低級功法而已，表太激動，實際上真正的網頁要比這個復雜很多倍，哦呵呵呵呵，表怪我打擊你，太容易滿足容易被江湖淘汰喲~~~

好了，今天的篇幅到這里就先結束了，親們表太想我喲哦呵呵呵~~~哎哎別打~~~說正事說正事

下一篇該講高級功法篇了，糾結啊，內容要比這個多的多的多，咋辦捏，是分為多篇來講還是直接整一個視頻教程捏，小伙伴們想看啥樣的，來發表下看法唄。

期待影迷們的回復喲~