Day: September 1, 2021

網頁設計範例

免費開發模板Bootstrap介紹

Bootstrap 是一個提供快速開發 Web應用程式和網站的前端框架，它已經為不同設備做了很多適配的工作，您只要按它的要求編寫html與css就可以自動適應不同設計，就是我們常常說的responsive webdesign或者自適應網頁設計。 在現代 Web 開發中，有一些所有的 Web 項目中都需要的功能，或者稱為組件/模塊。Bootstrap 為您提供了所有這些基本的組件 – 網格（Grid）、排版（Typography）、（表格）Tables、（表單）Forms、（按鈕）Buttons 和 （自適應）Responsiveness。此外，還有大量其他能夠復用的前端組件，比如（下拉框）Dropdowns、（導航欄）Navigation、（模態彈出框）Modals、（字模）Typehead、（分頁）Pagination、（輪播圖片）Carousal、（麵包屑）Breadcrumb、（標籤塊）Tab、（縮略圖）Thumbnails、（大標題）Headers 等等。有了這些，你可以搭建一個 Web 項目，並讓它運行地更快速更輕鬆。此外，由於整個框架是基於模塊的，您可以通過您自己的 CSS 位，甚至是項目開始後的一個大整改，來進行自定義。 上述說明太官方，一般人不好理解，我來簡化一下：Bootstrap是一個做網頁設計的框架（目前最流行的WEB前端框架之一），就是說你只需要寫HTML標籤調用它的類（class）你就可以很快速的做一個精美實用的網頁，你不用擔心不同設備的兼容問題，提供了很多樣式供你選擇！比如你需要做一個網站的文本顯示，你自己寫的話你需要寫很多代碼，但是如果你使用bootstrap框架來寫的話，只需要寫好HTML標籤然後調用類名就可以了！代碼展示如下： 作用：用它提供的樣式和組件快速寫網站你只需要引用一些定義好的類，也就是class名字，就可以創建出已經有非常漂亮的樣式的網頁，而且支持自適應，是一個很不錯的框架。簡而言之：你只需要瞭解相關的class、標籤名稱等所代表的意思，然後在構建頁面的時候，導入bootstrap的JS、css等，它就會去表現相應的效果出來。

Read More