Knowledge

Bootstrap (front-end framework)

Source 📝

641: 303: 1313: 195: 89: 29: 299:, progress bars, navigation drop-downs, and carousels. Each Bootstrap component consists of an HTML structure, CSS declarations, and in some cases accompanying JavaScript code. They also extend the functionality of some existing interface elements, including for example an auto-complete function for input fields. 272:). The primary purpose of adding it to a web project is to apply Bootstrap's choices of color, size, font and layout to that project. As such, the primary factor is whether the developers in charge find those choices to their liking. Once added to a project, Bootstrap provides basic style definitions for all 388:, meaning the layout of web pages adjusts dynamically, taking into account the characteristics of the device used (whether desktop, tablet, mobile phone). Shortly before the release of Bootstrap 2.1.2, Otto and Thornton left Twitter, but committed to continue to work on Bootstrap as an independent project. 420:
Otto announced Bootstrap 4 on October 29, 2014. The first alpha version of Bootstrap 4 was released on August 19, 2015. The first beta version was released on August 10, 2017. Otto suspended work on Bootstrap 3 on September 6, 2016, to free up time to work on Bootstrap 4. Bootstrap 4 was finalized on
340:
A precompiled version of Bootstrap is available in the form of one CSS file and three JavaScript files that can be readily added to any project. The raw form of Bootstrap, however, enables developers to implement further customization and size optimizations. This raw form is modular, meaning that the
313:
The most prominent components of Bootstrap are its layout components, as they affect an entire web page. The basic layout component is called "Container", as every other element in the page is placed in it. Developers can choose between a fixed-width container and a fluid-width container. While the
367:
A super small group of developers and I got together to design and build a new internal tool and saw an opportunity to do something more. Through that process, we saw ourselves build something much more substantial than another internal tool. Months later, we ended up with an early version of
376:-style week for the Twitter development team. It was renamed from Twitter Blueprint to Twitter Bootstrap and released as an open-source project on August 19, 2011. It has continued to be maintained by Otto, Thornton, a small group of core developers, and a large community of contributors. 280:. In addition, developers can take advantage of CSS classes defined in Bootstrap to further customize the appearance of their contents. For example, Bootstrap has provisioned for light- and dark-colored tables, page headings, more prominent 362:
as a framework to encourage consistency across internal tools. Before Bootstrap, various libraries were used for interface development, which led to inconsistencies and a high maintenance burden. According to Otto:
384:
On January 31, 2012, Bootstrap 2 was released, which added built-in support for Glyphicons, several new components, as well as changes to many of the existing components. This version supports
314:
latter always fills the width with the web page, the former uses one of the five predefined fixed widths, depending on the size of the screen showing the page:
401: 219: 1347: 1021: 832: 372:
After a few months of development by a small group, many developers at Twitter began to contribute to the project as a part of Hack Week, a
980: 1048: 412:
for these browsers. Bootstrap 3 was also the first version released under the twbs organization on GitHub instead of the Twitter one.
920: 337:
Once a container is in place, other Bootstrap layout components implement a CSS Flexbox layout through defining rows and columns.
1362: 602: 863: 268:
Bootstrap is an HTML, CSS and JS library that focuses on simplifying the development of informative web pages (as opposed to
646: 1382: 1357: 112: 80: 250: 436: 432: 342: 141: 137: 1017: 222: 759: 1377: 408:
events. Bootstrap 3 dropped Internet Explorer 7 and Firefox 3.6 support, but there is an optional
287:
Bootstrap also comes with several JavaScript components which do not require other libraries like
194: 88: 1342: 976: 961: 824: 465: 358:
Bootstrap, originally named Twitter Blueprint, was developed by Mark Otto and Jacob Thornton at
1337: 409: 1044: 1002: 368:
Bootstrap as a way to document and share common design patterns and assets within the company.
256:
As of May 2023, Bootstrap is the 17th most starred project (4th most starred library) on
1118: 1071: 385: 260:, with over 164,000 stars. According to W3Techs, Bootstrap is used by 19.2% of all websites. 246: 664: 544: 540: 212: 8: 1387: 1372: 912: 536: 456: 452: 1168: 1143: 1092: 784: 741: 701: 1312: 1212:"v5: drop Internet Explorer support by XhmikosR · Pull Request #30377 · twbs/bootstrap" 809: 669: 173: 152: 723: 592: 582: 532: 302: 694: 1367: 943: 578:
Rewriting the grid to support responsive gutters and columns placed outside of rows
164: 855: 341:
developer can remove unneeded components, apply a theme and modify the uncompiled
238: 1279: 586: 269: 1257: 519:
Improved form styling, buttons, drop-down menus, media objects and image classes
276:. The result is a uniform appearance for prose, tables and form elements across 51: 1211: 1186: 396:
On August 19, 2013, Bootstrap 3 was released. It redesigned components to use
1352: 1331: 681: 659: 654: 524: 215: 1187:"Bootstrap 5 grid by MartijnCuppens · Pull Request #28517 · twbs/bootstrap" 674: 273: 157: 445:, a collection of element-specific CSS changes in a single file, based on 397: 277: 242: 169: 292: 281: 234: 145: 46: 36: 487:
Increasing global font size from 14px to 16px for enhanced readability
405: 373: 1318: 118: 1236: 885: 548: 528: 482: 359: 307: 296: 28: 1322: 572: 288: 257: 785:"Usage statistics and market share of Bootstrap for websites" 598: 478: 460: 1306: 306:
Example of a webpage using Bootstrap framework rendered in
226: 185: 129: 291:. They provide additional user interface elements such as 230: 133: 543:(except on Windows). It additionally supports back to 404:
approach. Bootstrap 3 features new plugin system with
816: 1036: 636: 559:
Bootstrap 5 was officially released on May 5, 2021.
1063: 1144:"Release Release v5.0.0 (#33647) · twbs/bootstrap" 1111: 1329: 1070:Otto, Mark; Thornton, Jacob (August 10, 2017). 1009: 474:Adding responsive spacing and sizing utilities 1069: 523:Bootstrap 4 supports the latest versions of 752: 1311: 968: 904: 193: 87: 27: 847: 301: 962:"Bootstrap Blog - Bootstrap 3 released" 810:"Bootstrap Containers · Bootstrap v5.0" 471:Adding navigation customization options 1348:Free software programmed in JavaScript 1330: 923:from the original on February 23, 2017 866:from the original on February 23, 2017 1051:from the original on January 23, 2017 983:from the original on October 21, 2016 835:from the original on October 28, 2016 1042: 1015: 974: 941: 910: 878: 853: 822: 647:Free and open-source software portal 825:"Bootstrap in A List Apart No. 342" 597:Moving testing infrastructure from 353: 13: 1024:from the original on July 24, 2016 253:, and other interface components. 14: 1399: 1298: 942:Otto, Mark (September 29, 2012). 581:Migrating the documentation from 684:support rendering in Bootstrap. 639: 551:Extended Support Release (ESR). 1272: 1250: 1229: 1204: 1179: 1161: 1136: 1085: 1016:Otto, Mark (October 29, 2014). 995: 954: 935: 911:Otto, Mark (January 31, 2012). 823:Otto, Mark (January 17, 2012). 1363:Software using the MIT license 1043:Otto, Mark (August 19, 2015). 975:Otto, Mark (August 19, 2013). 854:Otto, Mark (August 19, 2011). 802: 777: 734: 716: 607:Adding custom set of SVG icons 575:in favor of vanilla JavaScript 554: 516:Huge number of utility classes 415: 391: 379: 1: 687: 424:Significant changes include: 284:, and text with a highlight. 913:"Say hello to Bootstrap 2.0" 742:"bootstrap/LICENSE (v3.0.3)" 610:Adding CSS custom properties 568:New offcanvas menu component 237:-based design templates for 7: 760:"Search · stars:>100000" 632: 263: 10: 1404: 1018:"Bootstrap 3.3.0 released" 348: 628:Built in darkmode support 619:Improved customizing docs 428:Major rewrite of the code 223:front-end web development 180: 163: 151: 125: 111: 107: 79: 75: 57: 45: 41:Mark Otto, Jacob Thornton 35: 26: 856:"Bootstrap from Twitter" 218:directed at responsive, 571:Removing dependence on 333:Larger than 1400 pixels 318:Smaller than 576 pixels 977:"Bootstrap 3 released" 563:Major changes include: 370: 310: 94:; 7 months ago 63:; 13 years ago 1383:Responsive web design 1173:blog.getbootstrap.com 1097:blog.getbootstrap.com 948:blog.getbootstrap.com 591:Dropping support for 451:Dropping support for 386:responsive web design 365: 305: 18:Web design front-end 1358:JavaScript libraries 1119:"Supported browsers" 1005:. December 10, 2012. 665:JavaScript framework 616:Enhanced grid system 213:free and open-source 119:Bootstrap Repository 61:August 19, 2011 1045:"Bootstrap 4 alpha" 1003:"Bootstrap 3 plans" 724:"bootstrap/LICENSE" 704:. February 20, 2024 477:Switching from the 52:Bootstrap Core Team 23: 1280:"Bootstrap-Django" 1099:. January 18, 2018 1072:"Bootstrap 4 Beta" 670:JavaScript library 421:January 18, 2018. 311: 174:Apache License 2.0 92:/ 20 February 2024 37:Original author(s) 21: 1258:"Bootstrap-Flask" 1237:"Bootstrap Icons" 892:. August 19, 2011 593:Internet Explorer 533:Internet Explorer 233:and (optionally) 209:Twitter Bootstrap 202: 201: 1395: 1315: 1310: 1309: 1307:Official website 1292: 1291: 1289: 1287: 1276: 1270: 1269: 1267: 1265: 1254: 1248: 1247: 1245: 1243: 1233: 1227: 1226: 1224: 1222: 1208: 1202: 1201: 1199: 1197: 1183: 1177: 1176: 1165: 1159: 1158: 1156: 1154: 1140: 1134: 1133: 1131: 1129: 1115: 1109: 1108: 1106: 1104: 1089: 1083: 1082: 1080: 1078: 1067: 1061: 1060: 1058: 1056: 1040: 1034: 1033: 1031: 1029: 1013: 1007: 1006: 999: 993: 992: 990: 988: 972: 966: 965: 958: 952: 951: 939: 933: 932: 930: 928: 908: 902: 901: 899: 897: 882: 876: 875: 873: 871: 851: 845: 844: 842: 840: 829:Mark Otto's blog 820: 814: 813: 806: 800: 799: 797: 795: 781: 775: 774: 772: 770: 756: 750: 749: 738: 732: 731: 720: 714: 713: 711: 709: 698: 649: 644: 643: 642: 512: 505: 501: 497: 493: 466:CSS Flexible Box 448: 444: 354:Early beginnings 330:1200-1400 pixels 270:web applications 198: 197: 190: 187: 121: 102: 100: 99:20 February 2024 95: 91: 71: 69: 64: 31: 24: 20: 1403: 1402: 1398: 1397: 1396: 1394: 1393: 1392: 1378:Web development 1328: 1327: 1305: 1304: 1301: 1296: 1295: 1285: 1283: 1278: 1277: 1273: 1263: 1261: 1256: 1255: 1251: 1241: 1239: 1235: 1234: 1230: 1220: 1218: 1210: 1209: 1205: 1195: 1193: 1185: 1184: 1180: 1167: 1166: 1162: 1152: 1150: 1142: 1141: 1137: 1127: 1125: 1117: 1116: 1112: 1102: 1100: 1091: 1090: 1086: 1076: 1074: 1068: 1064: 1054: 1052: 1041: 1037: 1027: 1025: 1014: 1010: 1001: 1000: 996: 986: 984: 973: 969: 960: 959: 955: 940: 936: 926: 924: 909: 905: 895: 893: 884: 883: 879: 869: 867: 852: 848: 838: 836: 821: 817: 808: 807: 803: 793: 791: 783: 782: 778: 768: 766: 758: 757: 753: 740: 739: 735: 722: 721: 717: 707: 705: 702:"Release 5.3.3" 700: 699: 695: 690: 645: 640: 638: 635: 557: 547:and the latest 510: 503: 499: 495: 491: 481:unit in CSS to 446: 442: 418: 394: 382: 356: 351: 327:992–1200 pixels 266: 192: 184: 176:prior to 3.1.0) 117: 103: 98: 96: 93: 67: 65: 62: 58:Initial release 19: 12: 11: 5: 1401: 1391: 1390: 1385: 1380: 1375: 1370: 1365: 1360: 1355: 1350: 1345: 1343:CSS frameworks 1340: 1326: 1325: 1316: 1300: 1299:External links 1297: 1294: 1293: 1271: 1249: 1228: 1203: 1178: 1175:. May 5, 2021. 1160: 1135: 1110: 1084: 1062: 1035: 1008: 994: 967: 953: 934: 917:Developer Blog 903: 877: 860:Developer Blog 846: 815: 801: 776: 751: 733: 715: 692: 691: 689: 686: 682:web frameworks 680:Also, several 678: 677: 672: 667: 662: 657: 651: 650: 634: 631: 630: 629: 626: 623: 620: 617: 614: 611: 608: 605: 595: 589: 579: 576: 569: 556: 553: 521: 520: 517: 514: 507: 488: 485: 475: 472: 469: 463: 449: 439: 429: 417: 414: 393: 390: 381: 378: 355: 352: 350: 347: 335: 334: 331: 328: 325: 324:768–992 pixels 322: 321:576–768 pixels 319: 265: 262: 225:. It contains 200: 199: 182: 178: 177: 167: 161: 160: 155: 149: 148: 127: 123: 122: 115: 109: 108: 105: 104: 85: 83: 81:Stable release 77: 76: 73: 72: 59: 55: 54: 49: 43: 42: 39: 33: 32: 17: 9: 6: 4: 3: 2: 1400: 1389: 1386: 1384: 1381: 1379: 1376: 1374: 1371: 1369: 1366: 1364: 1361: 1359: 1356: 1354: 1351: 1349: 1346: 1344: 1341: 1339: 1338:2011 software 1336: 1335: 1333: 1324: 1320: 1317: 1314: 1308: 1303: 1302: 1281: 1275: 1259: 1253: 1238: 1232: 1217: 1213: 1207: 1196:September 29, 1192: 1188: 1182: 1174: 1170: 1169:"Bootstrap 5" 1164: 1149: 1145: 1139: 1124: 1120: 1114: 1098: 1094: 1093:"Bootstrap 4" 1088: 1073: 1066: 1050: 1046: 1039: 1023: 1019: 1012: 1004: 998: 982: 978: 971: 963: 957: 949: 945: 938: 922: 918: 914: 907: 891: 887: 881: 865: 861: 857: 850: 834: 830: 826: 819: 811: 805: 790: 786: 780: 765: 761: 755: 747: 743: 737: 729: 725: 719: 703: 697: 693: 685: 683: 676: 673: 671: 668: 666: 663: 661: 660:jQuery Mobile 658: 656: 655:CSS framework 653: 652: 648: 637: 627: 624: 622:Updated forms 621: 618: 615: 612: 609: 606: 604: 600: 596: 594: 590: 588: 584: 580: 577: 574: 570: 567: 566: 565: 564: 560: 552: 550: 546: 542: 538: 534: 530: 526: 525:Google Chrome 518: 515: 509:Dropping the 508: 490:Dropping the 489: 486: 484: 480: 476: 473: 470: 467: 464: 462: 458: 454: 450: 440: 438: 434: 430: 427: 426: 425: 422: 413: 411: 407: 403: 399: 389: 387: 377: 375: 369: 364: 361: 346: 344: 338: 332: 329: 326: 323: 320: 317: 316: 315: 309: 304: 300: 298: 294: 290: 285: 283: 279: 275: 274:HTML elements 271: 261: 259: 254: 252: 248: 244: 240: 236: 232: 228: 224: 221: 217: 216:CSS framework 214: 210: 206: 196: 189: 183: 179: 175: 171: 168: 166: 162: 159: 156: 154: 150: 147: 143: 139: 135: 131: 128: 124: 120: 116: 114: 110: 106: 90: 84: 82: 78: 74: 60: 56: 53: 50: 48: 44: 40: 38: 34: 30: 25: 16: 1284:. Retrieved 1274: 1262:. Retrieved 1260:. HelloFlask 1252: 1240:. Retrieved 1231: 1219:. Retrieved 1215: 1206: 1194:. Retrieved 1190: 1181: 1172: 1163: 1151:. Retrieved 1147: 1138: 1128:February 23, 1126:. Retrieved 1122: 1113: 1101:. Retrieved 1096: 1087: 1075:. Retrieved 1065: 1055:February 23, 1053:. Retrieved 1038: 1028:February 23, 1026:. Retrieved 1011: 997: 987:February 23, 985:. Retrieved 970: 956: 947: 937: 927:February 23, 925:. Retrieved 916: 906: 896:February 23, 894:. Retrieved 889: 880: 870:February 23, 868:. Retrieved 859: 849: 839:February 23, 837:. Retrieved 828: 818: 804: 792:. Retrieved 788: 779: 767:. Retrieved 763: 754: 745: 736: 727: 718: 708:February 20, 706:. Retrieved 696: 679: 675:Tailwind CSS 613:Improved API 562: 561: 558: 522: 441:Addition of 423: 419: 402:mobile first 395: 383: 371: 366: 357: 339: 336: 312: 293:dialog boxes 286: 278:web browsers 267: 255: 220:mobile-first 208: 204: 203: 186:getbootstrap 158:Web platform 47:Developer(s) 15: 1286:November 7, 1264:November 7, 1242:November 7, 1103:February 5, 919:. Twitter. 862:. Twitter. 794:January 24, 789:w3techs.com 769:December 4, 625:RTL support 555:Bootstrap 5 416:Bootstrap 4 398:flat design 392:Bootstrap 3 380:Bootstrap 2 282:pull quotes 170:MIT License 86:5.3.3  1388:Mobile web 1373:Web design 1332:Categories 1077:August 16, 688:References 511:Glyphicons 506:components 431:Replacing 406:namespaced 251:navigation 239:typography 235:JavaScript 207:(formerly 146:JavaScript 126:Written in 113:Repository 68:2011-08-19 1319:Bootstrap 1282:. zelenij 1123:Bootstrap 890:Bootstrap 513:icon font 496:thumbnail 447:Normalize 374:hackathon 205:Bootstrap 144:(v4) and 22:Bootstrap 1221:April 7, 1049:Archived 1022:Archived 981:Archived 944:"Onward" 921:Archived 864:Archived 833:Archived 633:See also 483:root ems 410:polyfill 297:tooltips 264:Features 153:Platform 1368:Twitter 886:"About" 603:Jasmine 549:Firefox 529:Firefox 468:support 360:Twitter 349:History 345:files. 308:Firefox 247:buttons 211:) is a 181:Website 165:License 97: ( 66: ( 1323:GitHub 1216:GitHub 1191:GitHub 1153:May 5, 1148:GitHub 764:GitHub 746:Github 728:Github 583:Jekyll 573:jQuery 541:Safari 539:, and 502:, and 479:pixels 459:, and 443:Reboot 400:and a 289:jQuery 258:GitHub 191:  140:(v3), 599:QUnit 537:Opera 500:pager 492:panel 461:iOS 6 435:with 243:forms 1353:HTML 1288:2022 1266:2022 1244:2022 1223:2020 1198:2019 1155:2021 1130:2017 1105:2021 1079:2017 1057:2017 1030:2017 989:2017 929:2017 898:2017 872:2017 841:2017 796:2023 771:2022 710:2024 587:Hugo 545:IE10 504:well 437:Sass 433:Less 343:Sass 227:HTML 188:.com 142:Sass 138:Less 130:HTML 1321:on 601:to 585:to 457:IE9 453:IE8 231:CSS 134:CSS 1334:: 1214:. 1189:. 1171:. 1146:. 1121:. 1095:. 1047:. 1020:. 979:. 946:. 915:. 888:. 858:. 831:. 827:. 787:. 762:. 744:. 726:. 535:, 531:, 527:, 498:, 494:, 455:, 295:, 249:, 245:, 241:, 229:, 136:, 132:, 1290:. 1268:. 1246:. 1225:. 1200:. 1157:. 1132:. 1107:. 1081:. 1059:. 1032:. 991:. 964:. 950:. 931:. 900:. 874:. 843:. 812:. 798:. 773:. 748:. 730:. 712:. 172:( 101:) 70:)

Index


Original author(s)
Developer(s)
Bootstrap Core Team
Stable release
Edit this on Wikidata
Repository
Bootstrap Repository
HTML
CSS
Less
Sass
JavaScript
Platform
Web platform
License
MIT License
Apache License 2.0
getbootstrap.com
Edit this on Wikidata
free and open-source
CSS framework
mobile-first
front-end web development
HTML
CSS
JavaScript
typography
forms
buttons

Text is available under the Creative Commons Attribution-ShareAlike License. Additional terms may apply.