Bootstrap 的檔案結構包括：預編譯的 Bootstrap一旦下載了編譯版本的 Bootstrap，解壓 ZIP 檔案，您將看到以下檔案/目錄結構 -Bootstrap 原始碼Bootstrap 原始碼具有以下原始碼 -

要使用 Bootstrap，請按照以下步驟操作 - 從官方網站下載最新版本的 Bootstrap。到達頁面後，點選當前版本 4.1.1 的“下載”按鈕您在點選上面的“下載”按鈕後有兩個選項，下載 Bootstrap - 點選此按鈕，您可以下載 Bootstrap CSS、JavaScript 和字型的預編譯和壓縮版本。不包含文件或原始原始碼檔案。下載原始碼 - 點選此按鈕，您可以直接從 GitHub 獲取最新的 Bootstrap LESS 和 JavaScript 原始碼。

Bootstrap 是一款簡潔、直觀且功能強大的移動優先前端框架，可加快和簡化網頁開發。它使用 HTML、CSS 和 JavaScript。Bootstrap 由 Twitter 的 Mark Otto 和 Jacob Thornton 開發。它於 2011 年 8 月在 GitHub 上作為開源產品釋出。Bootstrap 的響應式設計，

Ionic 是一個面向構建混合移動應用程式的 HTML5 移動應用程式開發框架。可以將 Ionic 視為處理應用程式所需的所有外觀和感覺以及 UI 互動的前端 UI 框架。有點像“原生 Bootstrap”，但支援廣泛的常用原生移動元件、流暢的動畫和漂亮的設計。 Ionic 框架需要原生包裝才能在移動裝置上執行Ionic 僅針對移動裝置構建和測試。Internet Explorer 不支援 Ionic 的所有功能。對桌面和移動裝置使用單獨的應用程式。 閱讀更多

組合垂直/內聯欄位的 Bootstrap 表單 -                                                    左側                                                      右側                                                      更長的表單                                                                                        更短的表單                                                                                      更短的表單                                                                                      更短的表單                                                                                      更短的表單                                                                                      右側

要使用 HTML 建立表單，我們使用以下內容 -    詳細資訊：    學生姓名    考試日期和時間    要使用 jQuery 和 HTML 建立表單，請新增輸入型別文字，如下所示 -$form.append('');一個更好的例子是 -$myform = $(""); $myform.append(''); $('body').append($myform);

要更改導航欄顏色，設定導航欄背景 -navbarBackground: #c79810 ;設定導航欄背景高亮 -navbarBackgroundHighlight: #eab92d ;設定導航欄文字顏色 -navbarText: #f9ed9d ;設定導航欄連結顏色 -navbarLinkColor: #f9ed9d ;

要截斷表格行內的長文字，請使用以下 CSS - .table td.demo {    max-width: 177px; } .table td.demo span {    overflow: hidden;    text-overflow: ellipsis;    display: inline-block;    white-space: nowrap;    max-width: 100%; }以下是 HTML -    這是一個演示文字，我們將其設定為長文字以進行演示。

要整合，請使用 Initializr。它是一個 HTML5 模板生成器。您還可以使用 Workless，這是一個用於更快地開發前端 Web 應用程式的開源 HTML、CSS 和 JS 框架。Workless 使用 Font Awesome 網頁字型圖示，並允許您在專案中新增大量圖示。它可以自動為您設定表單樣式。

您可能已經注意到，每當您開啟下拉選單並在其他任何地方單擊時，下拉選單都會關閉。 透過使用以下給出的程式碼，可以在單擊後保持下拉選單開啟 -$('#myDropdown').on('hide.bs.dropdown', function () {    return false; });另一個選項是處理 click 事件 -可以使用以下程式碼處理 click 事件。event.stopPropagation() 方法阻止事件冒泡到父元素。它可以防止執行任何父事件處理程式 -$('#myDropdown .dropdown-menu').on({    "click":function(e) {        e.stopPropagation();     } });