我們會回來在本課程和演示引導網格系統和網格系統可能是頭號原因，人們使用引導的形式午睡時間。
這些按鈕是很好的風格變化，我們可以引導，但做引導網格系統將作為我們整個應用程序的骨架。
這對我們添加的結構和佈局，以我們的應用程序一個非常簡單的方法。
因此，讓我告訴你，你可以與電網系統做的幾個例子。
我有引導的前男友開在這裡的第一個是一個水罐產品頁面，向下滾動幾個網站。
注意鋪陳在這裡。
我們並排三項一邊，然後又發現，因為他們改變大小在這裡他們縮小，然後當我打的平板電腦尺寸它們堆疊在彼此的頂部。
所以這是在工作時的引導電網系統這是正確的在這裡，我們有另一個類似的效果。
它們規模，然後他們堆疊在平板電腦和手機的大小。
下面是另一個例子。
這是冰島音樂家和奧拉維爾阿諾德，這是在這個網站向下滾動。
我們有一個與電網系統內置在這裡，你可以看到類似的佈局一些內容，但它不只是這與網格系統建成為好。
這在這份內容。
這些旅遊日期在這裡。
基本上使用網格系統，我們可以說，我們需要一些內容佔用屏幕的100％的話，我們也可以用它來說，我們希望每個案例都採取了屏幕的寬度高達25％，直到我們打移動端或每個藥片大小，現在佔用50，然後當我們打手機，他們各自承擔100％。
同樣的事情在這裡完成。
它讓我們除以與屏幕成片，並選擇有多少個希望。
每一個我們自己的元素，以收卷，這裡是我們已經看到的最後一個。
這就是所謂的創意添沙漠向下滾動這裡類似的內容。
這裡是網格系統和這裡為好。
因此，這是所有與電網系統完成的。
所有這一切都讓真正重要的非常令人興奮的東西。
它可以幫助我們打下的事情了這麼輕易相比，現在我們不得不不舉的事情。
因此，我們將使用引導程序網格系統和幾乎使我們通過引導每一個應用程序。
讓我告訴你其中的一個。
這是我們的喲陣營應用程序，並通知我們有露營地的電網跨。
當我調整屏幕的通知，他們規模，然後我們去兩個跨越再往下移動。
我們去一個跨越，這是一個非常好的易於使用的移動佈局。
所以，這只是一個地方，我們將使用一個網格系統。
現在，讓我們以書面形式使用網格系統，使全屏幕窗口的一些代碼開始，回去再取被評估的選項卡下的自舉網絡公司。
您可以點擊網格系統上。
有相當多的網格系統，但我要去只是在這裡12指明了一個號碼開始。
這是為了在網格系統如何工作非常重要。
所以，每一個容器和引導，可分為12個不同的列，然後使用網格系統，我們可以選擇有多少12個單位的每個元素應該承擔的。
因此，在這種情況下，它看起來像他們有一些佔用約10選自12個單位。
然後此處在兩個選自12個單位或可能是九3，但它們有一些比他們在那裡的右側上的左側多出的那些12，然後一小部分出12。
所以，如果我們回到營地這裡這是我們的集裝箱就在這裡。
而這些每一個出來的12個單位每個人佔用三個單位。
因此，我們最終用四個相等列，然後我們縮小下來就在這裡。
現在，他們每佔用六個單位出12。
所以，再一次的12號非常重要的。
現在，讓我們在正確的。
我們的第一個網格。
所以我有一個文件進行網格確實H T M L它除了白手起家的SS文件空，並開始，我們需要定義一個容器。
隨時我們用它需要一個容器內部的Boucek網格。
因此類等於容器。
而我們需要做的第一件事是找帶班等於另一個div來排，而不是每一行。
我們有12個單位的挑選。
所以，我們打算做開始只是做一個50分50我們將有1格，佔用了6出12，然後另一個div，佔用了6出12。
因此，讓我們做這件事情。
我們將添加一個div，然後我還將添加我的第二次分裂而現在它只是兩個設備都是空的。
你不會去上班。
但我要做的就是添加一個類到第一個，這會顯得有點有點怪異柱大六，我們會在這裡做同樣的事情。
類等於列大六人。
然後，我們將在這裡增加一些內容。
他們只是說大列六人。
這裡同樣的事情。
當我這樣做讓我們保存，我們不會真正看到很多我們看不到網格本身。
因此，為了使這更清楚，我會在這裡定義的，而不是一種風格標籤的類。
我要做的就是定義一個類。
我只是把它粉紅色的，我會將此類或兩個div，所以我們可以看到它們。
所以現在他們只是白色的。
無邊框。
只是文本的一點點。
但是，如果我們在添加此。
所以粉紅色。
然後，我們希望背景是粉紅色的，我們會做一個紫色的邊界一個像素堅實的紫色，然後我們會運用粉色類這兩個div。
每個人佔用六個單位。
現在我們回過頭來刷新。
在那裡，我們走了。
你可以看到，我們有兩個div的佔用容器正好一半。
容器在這裡和這裡開始。
我們已經一分為二。
所以，現在我們可以回去和玩一點點，讓我們嘗試將在第三列。
而這一次將會使中間列八個單位，然後將左和右將有兩個。
所以，最終，我會在這裡更改這些數字。
在那裡，我們走了。
我們最終會在中間一個不錯的中心柱，然後我們可以使用一個邊欄什麼的左，右兩個較小的列。
所以這是一個非常基本的概念，基本所有的引導網格系統。
我們有12個單位跨我們的內部組件的任何容器去，我們可以在任何我們想要的方式指定的12個單位。
因此，我們可以做12個單獨的列，每列一列大的，我們可以做到這像這樣的12倍。
確保我不會失去計數。
在那裡，我們走了。
然後我們會擺脫這兩個現在。
如果我是新鮮的，你會在一行中看到，我們有12個大小均勻的列。
每佔用一個單元，然後我會告訴你，我們可以添加其他行。
因此，讓我們做，現在的div類的equals行，它只是去，我們有這個第一行的下方。
所以這一塊裡面讓我們做DIV。
類等於列Dasch大的，讓我們做四。
因此，我們將拆分它三個均勻大小的單位。
所以對於她的專欄ARGE去就是這樣。
讓我們去看看現在，你可以看到，我們沒有適用的粉紅色類，但我們有三個落在12大小均勻的柱下方創建大小均勻的列。
因此，我們可以在粉紅色的類添加只是為了更容易地看到發生了什麼。
還有我們走。
所以，這只是一個簡單的例子。
你實際上並沒有這些粉紅色的盒子最有可能在我們網站上。
但是你可以看到我們這裡有一個網格，我們有行，每行有四列去跨越。
每一個都是三個單位範圍內或在這裡創作本網站添。
我們有三列跨越每一個打算是4個單位寬。
這裡同樣的事情。
三列將橫跨在這裡。
我們有四列。
每個人都有三個單元寬。
所以這是在接下來的視頻網格的非常非常基本的。
我們將討論如何使電網響應，並具有不同的大小不同的佈局。
現在，我們一直與列大單。
我有一個大的手段解釋還有其他三種尺寸，我們會看到那些在接下來的視頻，我們還將看到我們如何能夠寫出嵌套網格，我們可以添加任何這些列和分裂在另一個一行為進一步12件。