Learn in FCC(2)
Responsive Design with Bootstrap
1.Bootstrap可以根據你的螢幕大小來調整HTML元素,所以叫響應式設計。用這個就不用再為移動裝置重新寫頁面程式碼。
使用之前,引入其css庫<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css"/>。
第一題使用"container-fluid"class。這東西應該是規定一個整體佈局。
2. class="img-responsive"。響應式圖片。
3.class="text-center" 。文字居中。
4.class="btn"。漂亮一點兒的按鈕。這裡使用的元素是button,而不是input。區別是前者內部可以放置文字和影象。後者估計放不了影象。
5.class="btn-block"。 按鈕塊,會佔一正行。它的效果與btn並不重疊,所以同時還要用btn。
6.class="btn-primary"。按鈕風格,深藍色。其他的還有info(淺藍色),success(綠色),danger(紅色),warning(黃色)等。
7.class="btn-info"。
8.class="btn-danger"。
9.這題講了Bootstrap的網格系統。有一點值得注意,這裡的列使用的是class為col-md(xs)-*的div元素。之前我在w3cschool(runoob)中看的也是這個,但今天在開啟,忽然就改版了,變成了使用span*。
10.這一題只是把css那一章中所寫的一些cssstyle刪掉,改成使用Bootstrap中的css。
11.這一題只是講了下span標籤。
狀態不好,以後抽空在看吧。