首頁  >  文章  >  web前端  >  bootstrap是國內開發的嗎

bootstrap是國內開發的嗎

WBOY
WBOY原創
2022-06-21 16:56:361445瀏覽

bootstrap不是國內開發的,而是美國Twitter公司的設計師「Mark Otto」和「Jacob Thornton」開發的;Bootstrap是基於HTML、css、JavaScript開發的用於快速開發web應用程式和網站的前端框架。

bootstrap是國內開發的嗎

本教學操作環境:Windows10系統、bootstrap5版、DELL G3電腦

bootstrap是國內開發的嗎

bootstrap不是國內開發的

Bootstrap 是一個用於快速開發Web 應用程式和網站的前端框架。 Bootstrap 是基於 HTML、CSS、JAVASCRIPT 的。

歷史

Bootstrap 是由 Twitter 的 Mark Otto 和 Jacob Thornton 開發的。 Bootstrap 是 2011 年八月在 GitHub 上發布的開源產品。

為什麼要使用 Bootstrap?

行動裝置優先:自 Bootstrap 3 起,框架包含了貫穿整個庫的行動裝置優先的樣式。

瀏覽器支援:所有的主流瀏覽器都支援 Bootstrap。

Internet Explorer Firefox Opera Google Chrome Safari

容易上手:只要您具備 HTML 和 CSS 的基礎知識,您就可以開始學習 Bootstrap。

響應式設計:Bootstrap 的響應式 CSS 能夠自適應於桌上型電腦、平板電腦和手機。更多有關響應式設計的內容詳見 Bootstrap 響應式設計。

響應式設計

它為開發人員建立介面提供了一個簡潔統一的解決方案。

它包含了功能強大的內建元件,易於自訂。

它還提供了基於 Web 的客製化。

它是開源的。

Bootstrap 套件的內容

基本架構:Bootstrap 提供了一個有網格系統、連結樣式、背景的基本架構。這將在 Bootstrap 基本結構 部分詳細講解。

CSS:Bootstrap 自帶以下功能:全域的 CSS 設定、定義基本的 HTML 元素樣式、可擴充的 class,以及先進的網格系統。這將在 Bootstrap CSS 部分詳細講解。

元件:Bootstrap 包含了十幾個可重複使用的元件,用於建立圖像、下拉式選單、導航、警告框、彈出框等等。這將在 佈局元件 部分詳細講解。

JavaScript 外掛程式:Bootstrap 包含了十幾個自訂的 jQuery 外掛程式。您可以直接包含所有的插件,也可以逐一包含這些插件。這將在 Bootstrap 插件 部分詳細講解。

自訂:您可以自訂 Bootstrap 的元件、LESS 變數和 jQuery 外掛來取得自己的版本。

範例如下:

<!DOCTYPE html>
<html>
<head>
  <title>Bootstrap 实例</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">  
  <script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
  <script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container">
  <div class="jumbotron">
    <h1>我的第一个 Bootstrap 页面</h1>
    <p>重置窗口大小,查看响应式效果!</p> 
  </div>
  <div class="row">
    <div class="col-sm-4">
      <h3>第一列</h3>
      <p>学的不仅是技术,更是梦想!</p>
      <p>再牛逼的梦想,也抵不住你傻逼似的坚持!</p>
    </div>
    <div class="col-sm-4">
      <h3>第二列</h3>
      <p>学的不仅是技术,更是梦想!</p>
      <p>再牛逼的梦想,也抵不住你傻逼似的坚持!</p>
    </div>
    <div class="col-sm-4">
      <h3>第三列</h3>        
      <p>学的不仅是技术,更是梦想!</p>
      <p>再牛逼的梦想,也抵不住你傻逼似的坚持!</p>
    </div>
  </div>
</div>
</body>
</html>

輸出結果:

bootstrap是國內開發的嗎

#相關推薦:bootstrap教學

以上是bootstrap是國內開發的嗎的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn