mirror of
https://github.com/mdbootstrap/mdb-ui-kit.git
synced 2024-11-16 06:37:02 +03:00
1264 lines
31 KiB
HTML
1264 lines
31 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||
|
||
<title>
|
||
|
||
History · Bootstrap Material Design
|
||
|
||
</title>
|
||
|
||
<!-- Twitter -->
|
||
<meta name="twitter:site" content="@FezVrasta">
|
||
<meta name="twitter:creator" content="@FezVrasta">
|
||
|
||
|
||
<meta name="twitter:card" content="summary">
|
||
<meta name="twitter:title" content="History">
|
||
<meta name="twitter:description" content="A brief overview of the history of Bootstrap.">
|
||
<meta name="twitter:image" content="https://fezvrasta.github.io/assets/brand/bootstrap-social-logo.png">
|
||
|
||
|
||
<!-- Facebook -->
|
||
|
||
<meta property="og:url" content="https://fezvrasta.github.io/docs/4.0/about/history/">
|
||
<meta property="og:title" content="History">
|
||
<meta property="og:description" content="A brief overview of the history of Bootstrap.">
|
||
<meta property="og:type" content="website">
|
||
|
||
<meta property="og:image" content="http://fezvrasta.github.io/assets/brand/bootstrap-social.png">
|
||
<meta property="og:image:secure_url" content="https://fezvrasta.github.io/assets/brand/bootstrap-social.png">
|
||
<meta property="og:image:type" content="image/png">
|
||
<meta property="og:image:width" content="1200">
|
||
<meta property="og:image:height" content="630">
|
||
|
||
<!-- Meta -->
|
||
<meta name="description" content="The most popular HTML, CSS, and JS Material Design library in the world.">
|
||
<meta name="author" content="Federico Zivolo and Bootstrap contributors">
|
||
|
||
|
||
<!-- Bootstrap core CSS -->
|
||
|
||
<link href="/bootstrap-material-design/dist/css/bootstrap-material-design.css" rel="stylesheet">
|
||
|
||
<link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700" rel="stylesheet" >
|
||
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
|
||
|
||
<!-- Documentation extras -->
|
||
|
||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.css" />
|
||
|
||
<link href="/bootstrap-material-design/assets/css/docs.min.css" rel="stylesheet">
|
||
|
||
<!-- Favicons -->
|
||
<link rel="apple-touch-icon" href="/bootstrap-material-design/apple-touch-icon.png">
|
||
<link rel="icon" href="/bootstrap-material-design/favicon.ico">
|
||
|
||
</head>
|
||
<body class="bd-docs" data-spy="scroll" data-target=".bd-sidenav-active">
|
||
<a id="skippy" class="sr-only sr-only-focusable" href="#content">
|
||
<div class="container">
|
||
<span class="skiplink-text">Skip to main content</span>
|
||
</div>
|
||
</a>
|
||
|
||
<header class="navbar navbar-expand navbar-dark flex-column flex-md-row bd-navbar">
|
||
<a class="navbar-brand mr-0 mr-md-2" href="/bootstrap-material-design/" aria-label="Bootstrap">
|
||
<svg class="d-block" width="36" height="36" viewbox="0 0 612 612" xmlns="http://www.w3.org/2000/svg" focusable="false"><title>Bootstrap</title><path fill="currentColor" d="M510 8a94.3 94.3 0 0 1 94 94v408a94.3 94.3 0 0 1-94 94H102a94.3 94.3 0 0 1-94-94V102a94.3 94.3 0 0 1 94-94h408m0-8H102C45.9 0 0 45.9 0 102v408c0 56.1 45.9 102 102 102h408c56.1 0 102-45.9 102-102V102C612 45.9 566.1 0 510 0z"/><path fill="currentColor" d="M196.77 471.5V154.43h124.15c54.27 0 91 31.64 91 79.1 0 33-24.17 63.72-54.71 69.21v1.76c43.07 5.49 70.75 35.82 70.75 78 0 55.81-40 89-107.45 89zm39.55-180.4h63.28c46.8 0 72.29-18.68 72.29-53 0-31.42-21.53-48.78-60-48.78h-75.57zm78.22 145.46c47.68 0 72.73-19.34 72.73-56s-25.93-55.37-76.46-55.37h-74.49v111.4z"/></svg>
|
||
|
||
</a>
|
||
|
||
<div class="navbar-nav-scroll">
|
||
<ul class="navbar-nav bd-navbar-nav flex-row">
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
|
||
</li>
|
||
<li class="nav-item partner creativetim">
|
||
<a class="nav-link" href="https://www.creative-tim.com/product/material-dashboard-pro?affiliate_id=87385" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Material Dashboard Pro');" target="_blank" rel="noopener">Material Dashboard</a>
|
||
</li>
|
||
<li class="nav-item partner creativetim">
|
||
<a class="nav-link" href="https://www.creative-tim.com/product/material-kit-pro?affiliate_id=87385" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Material Kit Pro');" target="_blank" rel="noopener">Material Kit</a>
|
||
</li>
|
||
<li class="nav-item partner mdbootstrap">
|
||
<a class="nav-link" href="https://mdbootstrap.com/product/material-design-for-bootstrap-pro/?utm_source=7e4bff&utm_id=7e4bff" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Material Design for Boostrap PRO');"
|
||
target="_blank" rel="noopener">Material Design for Bootstrap PRO</a>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
|
||
<ul class="navbar-nav flex-row ml-md-auto d-none d-md-flex">
|
||
<li class="nav-item dropdown">
|
||
<a class="nav-item nav-link dropdown-toggle mr-md-2" href="#" id="bd-versions" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||
v4.0
|
||
</a>
|
||
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
|
||
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Latest (4.x)</a>
|
||
<a class="dropdown-item" href="https://cdn.rawgit.com/FezVrasta/bootstrap-material-design/gh-pages-v3/index.html">v3.x</a>
|
||
</div>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link p-2" href="https://github.com/FezVrasta/bootstrap-material-design" target="_blank" rel="noopener" aria-label="GitHub">
|
||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 499.36" focusable="false"><title>GitHub</title><path d="M256 0C114.64 0 0 114.61 0 256c0 113.09 73.34 209 175.08 242.9 12.8 2.35 17.47-5.56 17.47-12.34 0-6.08-.22-22.18-.35-43.54-71.2 15.49-86.2-34.34-86.2-34.34-11.64-29.57-28.42-37.45-28.42-37.45-23.27-15.84 1.73-15.55 1.73-15.55 25.69 1.81 39.21 26.38 39.21 26.38 22.84 39.12 59.92 27.82 74.5 21.27 2.33-16.54 8.94-27.82 16.25-34.22-56.84-6.43-116.6-28.43-116.6-126.49 0-27.95 10-50.8 26.35-68.69-2.63-6.48-11.42-32.5 2.51-67.75 0 0 21.49-6.88 70.4 26.24a242.65 242.65 0 0 1 128.18 0c48.87-33.13 70.33-26.24 70.33-26.24 14 35.25 5.18 61.27 2.55 67.75 16.41 17.9 26.31 40.75 26.31 68.69 0 98.35-59.85 120-116.88 126.32 9.19 7.9 17.38 23.53 17.38 47.41 0 34.22-.31 61.83-.31 70.23 0 6.85 4.61 14.81 17.6 12.31C438.72 464.97 512 369.08 512 256.02 512 114.62 397.37 0 256 0z" fill="currentColor" fill-rule="evenodd"/></svg>
|
||
|
||
</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link p-2" href="https://twitter.com/FezVrasta" target="_blank" rel="noopener" aria-label="Twitter">
|
||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 416.32" focusable="false"><title>Twitter</title><path d="M160.83 416.32c193.2 0 298.92-160.22 298.92-298.92 0-4.51 0-9-.2-13.52A214 214 0 0 0 512 49.38a212.93 212.93 0 0 1-60.44 16.6 105.7 105.7 0 0 0 46.3-58.19 209 209 0 0 1-66.79 25.37 105.09 105.09 0 0 0-181.73 71.91 116.12 116.12 0 0 0 2.66 24c-87.28-4.3-164.73-46.3-216.56-109.82A105.48 105.48 0 0 0 68 159.6a106.27 106.27 0 0 1-47.53-13.11v1.43a105.28 105.28 0 0 0 84.21 103.06 105.67 105.67 0 0 1-47.33 1.84 105.06 105.06 0 0 0 98.14 72.94A210.72 210.72 0 0 1 25 370.84a202.17 202.17 0 0 1-25-1.43 298.85 298.85 0 0 0 160.83 46.92" fill="currentColor"/></svg>
|
||
|
||
</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link p-2" href="https://spectrum.chat/bootstrap-md" target="_blank" rel="noopener" aria-label="Spectrum">
|
||
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 512" focusable="false"><title>Spectrum</title>
|
||
<path fill="currentColor" fill-rule="evenodd" d="M256,51.2C21.5,51.2,0,83.4,0,222.2c0,94.2,9.7,139.3,89.1,158.7l0,0v58.4c0.5,12.4,11,22.1,23.5,21.6c4-0.2,8-1.4,11.4-3.6l98.8-63.5H256c234.5,0,256-32.3,256-171.5S490.5,51.2,256,51.2z M144.9,265.2c-17.8-0.6-31.8-15.5-31.2-33.3c0.6-17.8,15.5-31.8,33.3-31.2c17.4,0.6,31.2,14.8,31.2,32.2C177.9,251,163,265.5,144.9,265.2C144.9,265.2,144.9,265.2,144.9,265.2zM256,265.2c-17.8-0.6-31.8-15.5-31.2-33.3c0.6-17.8,15.5-31.8,33.3-31.2c17.4,0.6,31.2,14.8,31.2,32.2C289,251,274.1,265.5,256,265.2C256,265.2,256,265.2,256,265.2z M367.1,265.2c-17.8-0.6-31.8-15.5-31.2-33.3c0.6-17.8,15.5-31.8,33.3-31.2c17.4,0.6,31.2,14.8,31.2,32.2C400.1,251,385.2,265.5,367.1,265.2C367.1,265.2,367.1,265.2,367.1,265.2z" />
|
||
</svg>
|
||
|
||
</a>
|
||
</li>
|
||
</ul>
|
||
|
||
<a class="btn btn-bd-yellow d-none d-lg-inline-block mb-3 mb-md-0 ml-md-3" href="https://github.com/FezVrasta/bootstrap-material-design/releases">Download</a>
|
||
</header>
|
||
|
||
|
||
<div class="container-fluid">
|
||
<div class="row flex-xl-nowrap">
|
||
<div class="col-12 col-md-3 col-xl-2 bd-sidebar">
|
||
<form class="bd-search d-flex align-items-center">
|
||
<input type="search" class="form-control" id="search-input" placeholder="Search..." aria-label="Search for..." autocomplete="off">
|
||
<button class="btn-link bd-search-docs-toggle d-md-none p-0 ml-3" type="button" data-toggle="collapse" data-target="#bd-docs-nav" aria-controls="bd-docs-nav" aria-expanded="false" aria-label="Toggle docs avigation">
|
||
<svg class="" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 30 30" width="30" height="30" focusable="false"><title>Menu</title><path stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-miterlimit="10" d="M4 7h22M4 15h22M4 23h22"/></svg>
|
||
|
||
</button>
|
||
</form>
|
||
|
||
<nav class="collapse bd-links" id="bd-docs-nav">
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<div class="bd-toc-item ">
|
||
<a class="bd-toc-link" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/">
|
||
Getting started
|
||
</a>
|
||
|
||
<ul class="nav bd-sidenav">
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/getting-started/introduction/">
|
||
Introduction
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/getting-started/download/">
|
||
Download
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/getting-started/contents/">
|
||
Contents
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/getting-started/browsers-devices/">
|
||
Browsers & devices
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/getting-started/javascript/">
|
||
JavaScript
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/getting-started/options/">
|
||
Options
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/getting-started/build-tools/">
|
||
Build tools
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/getting-started/webpack/">
|
||
Webpack
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/getting-started/accessibility/">
|
||
Accessibility
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
</ul>
|
||
</div>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<div class="bd-toc-item ">
|
||
<a class="bd-toc-link" href="/bootstrap-material-design/docs/4.0/layout/overview/">
|
||
Layout
|
||
</a>
|
||
|
||
<ul class="nav bd-sidenav">
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/layout/overview/">
|
||
Overview
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/layout/grid/">
|
||
Grid
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/layout/media-object/">
|
||
Media object
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/layout/utilities-for-layout/">
|
||
Utilities for layout
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
</ul>
|
||
</div>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<div class="bd-toc-item ">
|
||
<a class="bd-toc-link" href="/bootstrap-material-design/docs/4.0/content/reboot/">
|
||
Content
|
||
</a>
|
||
|
||
<ul class="nav bd-sidenav">
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/content/reboot/">
|
||
Reboot
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/content/typography/">
|
||
Typography
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/content/code/">
|
||
Code
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/content/images/">
|
||
Images
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/content/tables/">
|
||
Tables
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/content/figures/">
|
||
Figures
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
</ul>
|
||
</div>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<div class="bd-toc-item ">
|
||
<a class="bd-toc-link" href="/bootstrap-material-design/docs/4.0/components/alerts/">
|
||
Components
|
||
</a>
|
||
|
||
<ul class="nav bd-sidenav">
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/components/alerts/">
|
||
Alerts
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/components/badge/">
|
||
Badge
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/components/breadcrumb/">
|
||
Breadcrumb
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/components/buttons/">
|
||
Buttons
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/components/button-group/">
|
||
Button group
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/components/card/">
|
||
Card
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/components/carousel/">
|
||
Carousel
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/components/collapse/">
|
||
Collapse
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/components/dropdowns/">
|
||
Dropdowns
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/components/forms/">
|
||
Forms
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/components/input-group/">
|
||
Input group
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/components/jumbotron/">
|
||
Jumbotron
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/components/list-group/">
|
||
List group
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/components/modal/">
|
||
Modal
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/components/navs/">
|
||
Navs
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/components/navbar/">
|
||
Navbar
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/components/pagination/">
|
||
Pagination
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/components/popovers/">
|
||
Popovers
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/components/progress/">
|
||
Progress
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/components/scrollspy/">
|
||
Scrollspy
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/components/tooltips/">
|
||
Tooltips
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
</ul>
|
||
</div>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<div class="bd-toc-item ">
|
||
<a class="bd-toc-link" href="/bootstrap-material-design/docs/4.0/material-design/buttons/">
|
||
Material Design
|
||
</a>
|
||
|
||
<ul class="nav bd-sidenav">
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/material-design/buttons/">
|
||
Buttons
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/material-design/collapse-inline/">
|
||
Collapse inline
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/material-design/drawers/">
|
||
Drawers
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/material-design/extensions/">
|
||
Extensions
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/material-design/forms/">
|
||
Forms
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/material-design/labels/">
|
||
Labels
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/material-design/list-groups/">
|
||
List groups
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/material-design/menus/">
|
||
Menus
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/material-design/navs/">
|
||
Navs
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/material-design/selections/">
|
||
Selections
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/material-design/snackbars/">
|
||
Snackbars
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
</ul>
|
||
</div>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<div class="bd-toc-item ">
|
||
<a class="bd-toc-link" href="/bootstrap-material-design/docs/4.0/utilities/borders/">
|
||
Utilities
|
||
</a>
|
||
|
||
<ul class="nav bd-sidenav">
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/utilities/borders/">
|
||
Borders
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/utilities/clearfix/">
|
||
Clearfix
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/utilities/close-icon/">
|
||
Close icon
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/utilities/colors/">
|
||
Colors
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/utilities/display/">
|
||
Display
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/utilities/embed/">
|
||
Embed
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/utilities/flex/">
|
||
Flex
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/utilities/float/">
|
||
Float
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/utilities/image-replacement/">
|
||
Image replacement
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/utilities/position/">
|
||
Position
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/utilities/screenreaders/">
|
||
Screenreaders
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/utilities/sizing/">
|
||
Sizing
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/utilities/spacing/">
|
||
Spacing
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/utilities/text/">
|
||
Text
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/utilities/vertical-align/">
|
||
Vertical align
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/utilities/visibility/">
|
||
Visibility
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
</ul>
|
||
</div>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<div class="bd-toc-item ">
|
||
<a class="bd-toc-link" href="/bootstrap-material-design/docs/4.0/extend/icons/">
|
||
Extend
|
||
</a>
|
||
|
||
<ul class="nav bd-sidenav">
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<li class="">
|
||
<a href="/bootstrap-material-design/docs/4.0/extend/icons/">
|
||
Icons
|
||
</a>
|
||
|
||
|
||
</li>
|
||
|
||
</ul>
|
||
</div>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<div class="bd-toc-item ">
|
||
<a class="bd-toc-link" href="/bootstrap-material-design/docs/4.0/migration/">
|
||
Migration
|
||
</a>
|
||
|
||
<ul class="nav bd-sidenav">
|
||
|
||
</ul>
|
||
</div>
|
||
|
||
</nav>
|
||
|
||
</div>
|
||
|
||
|
||
|
||
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
|
||
<h1 class="bd-title" id="content">History</h1>
|
||
<p class="bd-lead">A brief overview of the history of Bootstrap.</p>
|
||
<script async type="text/javascript" src="https://cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=fezvrastagithubiobootstrapmateri" id="_carbonads_js"></script>
|
||
|
||
<p>Originally created by a designer and a developer at Twitter, Bootstrap has become one of the most popular front-end frameworks and open source projects in the world.</p>
|
||
|
||
<p>Bootstrap was created at Twitter in mid-2010 by <a href="https://twitter.com/mdo">@mdo</a> and <a href="https://twitter.com/fat">@fat</a>. Prior to being an open-sourced framework, Bootstrap was known as <em>Twitter Blueprint</em>. A few months into development, Twitter held its <a href="https://blog.twitter.com/2010/hack-week">first Hack Week</a> and the project exploded as developers of all skill levels jumped in without any external guidance. It served as the style guide for internal tools development at the company for over a year before its public release, and continues to do so today.</p>
|
||
|
||
<p>Originally <a href="https://blog.twitter.com/2011/bootstrap-from-twitter">released</a> on <a href="https://twitter.com/mdo/statuses/104620039650557952"><time datetime="2011-08-19 11:25">Friday, August 19, 2011</time></a>, we’ve since had over <a href="https://github.com/twbs/bootstrap/releases">twenty releases</a>, including two major rewrites with v2 and v3. With Bootstrap 2, we added responsive functionality to the entire framework as an optional stylesheet. Building on that with Bootstrap 3, we rewrote the library once more to make it responsive by default with a mobile first approach.</p>
|
||
|
||
</main>
|
||
</div>
|
||
</div>
|
||
|
||
<script src="/bootstrap-material-design/assets/js/vendor/split.min.js">
|
||
</script>
|
||
|
||
<script>
|
||
Split.setup({
|
||
creativetim: function () {document.body.classList.add('creativetim')},
|
||
mdbootstrap: function () {document.body.classList.add('mdbootstrap')},
|
||
});
|
||
|
||
(function (i, s, o, g, r, a, m) {
|
||
i['GoogleAnalyticsObject'] = r; i[r] = i[r] || function () {
|
||
(i[r].q = i[r].q || []).push(arguments)
|
||
}, i[r].l = 1 * new Date(); a = s.createElement(o),
|
||
m = s.getElementsByTagName(o)[0]; a.async = 1; a.src = g; m.parentNode.insertBefore(a, m)
|
||
})(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');
|
||
ga('create', 'UA-80431047-1', 'auto');
|
||
ga('send', 'pageview');
|
||
</script>
|
||
|
||
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
|
||
<script>window.jQuery || document.write('<script src="/bootstrap-material-design/assets/js/vendor/jquery-slim.min.js"><\/script>')</script>
|
||
|
||
<script src="/bootstrap-material-design/assets/js/vendor/popper.min.js"></script>
|
||
<script src="https://cdn.rawgit.com/FezVrasta/snackbarjs/1.1.0/dist/snackbar.min.js" crossorigin="anonymous"></script>
|
||
|
||
<script src="/bootstrap-material-design/dist/js/bootstrap-material-design.js"></script>
|
||
|
||
|
||
|
||
<script src="/bootstrap-material-design/assets/js/vendor/anchor.min.js"></script>
|
||
<script src="/bootstrap-material-design/assets/js/vendor/clipboard.min.js"></script>
|
||
<script src="/bootstrap-material-design/assets/js/vendor/holder.min.js"></script>
|
||
<script src="/bootstrap-material-design/assets/js/src/application.js"></script>
|
||
|
||
|
||
<!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
|
||
<script src="/bootstrap-material-design/assets/js/ie10-viewport-bug-workaround.js"></script>
|
||
<script src="/bootstrap-material-design/assets/js/ie-emulation-modes-warning.js"></script>
|
||
|
||
|
||
<script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.js"></script>
|
||
<script type="text/javascript">
|
||
var docsearch = docsearch({
|
||
apiKey: 'b5c13bef25101d81f781cc15f4485a52',
|
||
indexName: 'fezvrasta_bootstrap_material_design',
|
||
inputSelector: '#search-input',
|
||
handleSelected: function (input, event, suggestion) {
|
||
var url = suggestion.url;
|
||
url = suggestion.isLvl1 ? url.split('#')[0]: url;
|
||
// If it's a title we remove the anchor so it does not jump.
|
||
window.location.href = url;
|
||
},
|
||
transformData: function (hits) {
|
||
return hits.map(function (hit) {
|
||
console.log(hit.url);
|
||
hit.url = hit.url.replace('https://fezvrasta.github.io/', '/');
|
||
return hit;
|
||
});
|
||
},
|
||
debug: false // Set debug to true if you want to inspect the dropdown
|
||
});
|
||
</script>
|
||
|
||
|
||
<script>
|
||
Holder.addTheme('gray', {
|
||
bg: '#777',
|
||
fg: 'rgba(255,255,255,.75)',
|
||
font: 'Helvetica',
|
||
fontweight: 'normal'
|
||
})
|
||
</script>
|
||
|
||
</body>
|
||
</html>
|