歡迎在這節課我們將專注於造型展示頁面回來。
所以，現在我們的節目頁面看起來是這樣的。
我們有一個小酒吧蹩腳這裡與沒有做任何的按鈕。
我們有一個H-1與露營地的名稱。
而且我們有一個形象的描述，我們有一個按鈕來添加一個新的註釋，然後所有的評論都顯示。
每一個小段落。
所以在這裡我們的目標是讓它看起來更像這一點。
所以我有一個側邊欄在這裡。
我們不會有地圖，只是還沒有，但我們會騰出空間地圖，然後我們將有我們的主要內容與描述。
一些文本標題我們不會做的收視率還沒有但我們還必須審查會看起來像這樣的列表。
自己的小容器裡有我有一個小按鈕，槓桿等等。
一般來說它是一點點的風格。
我們可以添加這樣那樣說，許多評論已經如何離開。
所以，這就是我們的目標了。
並開始我們將只專注於引導電網。
請記住，引導電網12台對面。
我們要為這個小邊欄指定三個出的12，然後我們要去為主要內容的添加九歲。
在我們開始之前在實際上改變任何我想指出的是，我在5節我工作了。
所以，如果你想跟著一起所有這些變化將在V，5。
而我這樣做的原因是，我們將不得不做出一個自定義樣式表。
我們將不得不為市民服務目錄和一些其他的東西都是實質性的變化。
所以，我想作一個單獨的版本。
但在此之前，我們做的，我們要做的第一件事就是周圍添加這一切引導容器的容器。
因此，在表明E.J.是要增加一個div類容器，就像這一點，我們將投入一切的裡面。
我會通過增加側邊欄開始，我們只是一些虛擬數據填充它像我們這裡。
因此，DIVX，這需要在類的equals親和該行中我們將有另一個div其中類別可以是列中3個就好這樣。
然後這裡裡面，我們要添加一個段落，我們會得到這段文字，說約阿希姆。
所以這是一個段落，其中類是領先，然後我們只是把你安營扎寨現在我們將最終改變這一點。
但是，是的陣營，然後添加那些小列表中的項目，我們會做與類的div是列表破折號組，然後在這裡，我們要添加一幫盟友每個盟友有一個類列表組項目。
而且裡面我們只是添加一些無效數據，我們就稱它為信息1，然後我要複製這個信息，以信息3。
然後讓我們看看是什麼樣子現在。
因此，對於刷新頁面，我們在這裡有一個側邊欄，我會做這些項目中選擇啟動的一個。
而我們要做的就是添加活動就在這裡。
如果我們是新鮮的，我們現在看到其中一個是積極的。
而這僅僅是一個佔位符有東西存在，所以我們不會有很多空白，但是我們再次將在那裡加入真實的數據和地圖，最終。
而就指出來的地圖會在這裡這裡面媒體三欄的最後，但不是現在。
OK所以這是一個酒吧。
現在，我們要在主要內容的補充。
因此，我們需要另一列而這一次是類列中9。
而是還有我們需要有H-1，我們需要有形象，但所有這一切之前，你會發現它實際上都在這些縮略圖，就像我們對網頁中的一個。
其中每一個都是一個縮略圖。
我們將做同樣的事情，整個圖像周圍的標題和評論以及所有這一切。
因此，我們要添加一個div和DIV將有類等於縮略圖。
然後裡面，我們要添加的形象和我還是會的形象，我們已經寫好，只是把它的權利在那裡。
所以這將是我們的露營地的形象。
然後，我們也想一類添加到了自舉給了我們這是圖像Dasch響應。
在那裡，我們走了。
保存。
如果我們看一看我們現在已經和我們刷新至少有圖像，並在正確的地方的內容。
我們在哪裡這是不符合我們希望它佔用雖然問題。
我想，要一路之隔去，我們就必須處理一些定制的C SS底。
現在，我們會回去，並添加這在這兒，我們有我們實際上並沒有在數據庫中的露營場地的名稱，然後每晚的價格。
所以我們就硬編碼。
因此，讓我們做這件事情。
這就是另一個div而這其中有一類標題破折號滿。
然後還有裡面，我們要添加一個H表示。
而且我們要拉這個在右邊，我們班拔等於幾許權利，那麼無論我們把這裡將是價格。
而我就先從$ 9夜這再次從數據庫最終將到來。
如果我們是新鮮的現在，我們得到$ 9夜右側，然後我們想要得到我只是會在這裡複製了在左側的露營地的名稱。
所以我們把它放在右下方，如果我們不加向右拉它會自動進入到左邊儘管這比我腦子裡想的大，我就會把它轉換成一個較小的H和我要去添加一個錨標記的存在，就像這裡面，把營地的名稱錨標籤內。
而背後的想法是，最終我回去。
這應該是實際的露營地或公園服務頁面，我們可以去預訂的東西的鏈接。
現在它只是鏈接到沒有出路的。
好。
因此，我們有英寸
我們有一個價格。
現在，讓我們添加描述回。
所以這將只是一個段落標記，然後我們將在我們的描述是露營地的描述正確的有加。
而且這將是一個有點給人留下深刻印象，因為我們沒有一個大的訂閱現在，所以我們可能想要做的就是去看看一些Lorem存有數據庫，我只是要偷這個，我會複製這一點，回去的種子文件。
然後，而不是我們的種子的文件，我會改變他們三個的描述。
只是讓同樣的事情，而不是等等等等等等。
我們現在有Lorem存有較長一點，我們可以節省。
然後讓這個進入我們必須重新啟動服務器，因為將接收數據庫中生效。
然後讓我們回過頭來求助於露營地的頁面。
我們有三個露營地。
不過，他們現在有一個更合理的描述一些文字。
好大。
現在讓我們什麼，我們需要去努力看看。
有一些小的事情。
我們將留在回顧數獨，現在的明星，我們將繼續前進到的意見。
讓我們回到顯示，E.J.是的文件，我們可以關閉掉的種子，現在我們要做的就是添加一個井給類以及列中九裡，因為我們希望它是在同一列在這裡。
佔用空間是相同的。
因此，要做到這一點只是去這裡縮略圖所以這和字幕後，就在這裡，這是縮略圖。
所以，正確的，他們要添加的div類。
等於好。
然後那去打開它，裡面這是它會做循環通過添加註釋。
但我會在按鈕添加你按鈕的槓桿啟動，我們只要做一個簡單的股利和股利這將有一類文本破折號權。
然後裡面有我們要在這裡添加我們的錨標記，我們已經創造了新的註釋。
只要把這裡。
這是一個漫長的，但請記住它是有一個類Button按鈕的成功，它使綠色錨標記。
但裁判是一個很長的一部分。
這將大幅削減露營地露營ID斜線評論斜線新的，但保存和刷新。
好。
所以你可以看到我們現在，讓我們在邊境漂亮的灰色背景良好。
這就是我們要在評論中補充。
因此，我們需要做的下一個就是通過意見循環，我們已經有了完成。
但是，而不是只是讓為每一個我們真正要作出一個單獨的行一個段落。
所以，我會告訴你是什麼樣子時，它複製此或削減它。
我們可以刪除這個額外的一段，我們打算把這一權利的文字後權。
而且，我們都是這麼做的。
因此，我們有我們的循環，然後我們通過每個註釋將環和我們要在這裡為每一個DIV類的div類排等於行內添加。
然後裡面的每一個我們要添加另一個div類的equals列媒體12並保存。
如果我們看一看我們這裡有什麼我們最終的用戶名電子郵件用戶名的斜線我們稱之為的作者。
然後在右邊有這一次10天前這將只是硬編碼，然後現在實際的評論隨之而來的。
因此，為了使這項工作，我們需要做一些文字，然後做一些事情右邊拉右邊的文本右側，然後我們需要在實際的評論本身添加一個段落。
所以讓我們嘗試去在這裡了。
我們有自己的專欄中12。
和這裡面我們要開始只需添加評論作者。
因此，讓我們只想補充一點，就在那裡。
然後，低於我們要在跨度增加，這將是在右邊。
因此，我們將添加古典拉權利。
然後在這裡我們就添加十天前現在。
乾脆硬代碼英寸
然後，他們想要做的最後一件事是實際顯示註釋文本。
所以我要在這裡得到這個註釋文本，我們就會把它自己的段落，我們已經在這裡一樣，除了我們內部要在這裡移動列裡面，就像我們的作者和10天去。
我們希望他們能在同一列在一起，但現在保存並返回。
看看我們得到的。
好吧。
所以我們有一個評論。
而已。
但是你可以看到，我們有一個按鈕，添加一個新評論。
請確保它的工作原理。
和註釋顯示在這裡。
我們缺少的評級。
因此，它看起來有點有點怪，但對於現在的罰款。
我們可能想要做的就是添加一個或兩個以上的評論。
所以還是回到這裡，就讓我們多用一些Lorem存有。
所以我只是要複製這個部分，並在其中添加作為註釋。
只是使用那些在這裡筆者將露營。
爺爺。
提交。
好。
所以，我們現在及彼我們的意見就好了。
這是工作。
我確實有，我們要添加一些空間。
如果你看看我們在這裡有一個真正的微弱線我不知道你會在屏幕上投露面。
還有，在添加一些間距真的昏線和所有我們需要做的，使這項工作是增加的H河
因此，這是我們剛剛加入一個水平線，如果我們刷新我們現在有一些空間，還有按鈕這段文字正確的之後。
你有一個按鈕，我們已經顯示在短期內我們的所有意見。
我們為什麼不建的用戶名。
因此，我們將回到這裡，我們已經有了這一點，他們擺脫它，但我們會回去再加入一個強大的標籤，與作者和他們就會給你一個小更容易看到。
在那裡，我們走了。
仍然不是很大，但不夠好現在。
所以這實際上是所有我們需要現在做引導。
但是，我們仍然沒有完成。
如果我們回頭看看成品ISH版本，你會看到圖像佔據整個縮略圖，只是沒有這樣做。
即使我做了點使用它不是實際的圖像本身完全相同的圖像。
這個問題歸結為我們的造型。
我們希望做的是去告訴這個圖像佔用100％的與容器。
所以，我會告訴你我們就可以檢查它，這是這裡的檢查一個偉大的使用。
這裡我們可以選擇它，然後在這裡我們可以在一個風格的100％的增加。
還有我們走。
所以，這是我們想要做一件事。
目前仍然是一個非常細微的差別是有一個小空間，在那裡，我們沒有在這一個。
而要擺脫所有我們想要做的是進入實際的縮略圖，選擇縮略圖是在這裡，我們打算給該填充為零。
現在，如果我們就來看看它看起來，我們希望它看起來或者幾乎看起來是這樣的時候的樣子。
我們要在這裡添加一些間距為好。
你可以看到有一些間距在這裡完成，我們可以解決這個問題現在。
同時通過檢查它，記住，我們實際上並沒有修復它，我們只是測試它在瀏覽器中，然後我們會回去，實際上使我們自己的樣式表這些變化。
因此，我們希望做的是加入填充在標題馬駒也就是這個盒子在這裡一點點。
而我們要的是PADAM在左，右頂部和底部，這將是9至10個像素。
所以我們只是做填充9的X.
還有我們走。
我們結束了一個很好的間距那裡。