What is Bootstrap

Question

There are a lot of questions here related to Bootstrap  I see a lot of people using it  So I tried to research it  and I found the official Bootstrap site  but there was only a download section and a few words after that  Nothing that explains what is it for    I just understood that it is a front-end helper  I have tried to find something by Googling  but found nothing specific  Everything I found is related to the computer science definition    So  my questions are     What is Bootstrap at all  What is it used for  and how does it help front-end development  I would also like some more details explaining it

User · Answer

Bootstrap is an open-source CSS  JavaScript framework that was originally developed for twitter application by twitter s team of designers and developers  Then they released it for open-source  Being a longtime user of twitter bootstrap I find that its one of the best for designing mobile ready responsive websites  Many CSS and Javascript plugins are available for designing your website in no time  It s kind of rapid template design framework  Some people complain that the bootstrap CSS files are heavy and take time to load but these claims are made by lazy people  You don t have to keep the complete bootstrap css in your website  You always have the option to remove the styles for components that you do not need for your website  For example  if you are only using basic components like forms and buttons then you can remove other components like accordions etc from the main CSS file  To start dabbling in bootstrap you can download the basic templates and components from getbootstrap site and let the magic happen

User · Answer

Disclaimer  I have used bootstrap in the past  but I never really appreciated what it actually is before  this description comes from me coming to my own definition  today  And I know that bootstrap v4 is out  but I found the bootstrap v3 documentation to be much clearer  so I used that  The library is not going to fundamentally change what it provides   Briefly  Bootstrap is a collection of CSS and javascript files that provides some nice-looking default styling for standard html elements  and a few common web content objects that are not standard html elements   To make an analogy  it s kind of like applying a theme in powerpoint  but for your website  it makes things look pretty nice without too much initial effort   What does it consist of   The official v3 documentation breaks it up into three sections    CSS  Components Javascript   These roughly correspond to the three main things that Bootstrap provides    Plain CSS files that style standard html elements  So  Bootstrap makes your standard elements pretty-looking  e g  html   lt input class  btn btn-default  type  button  value  Input  gt Click me lt  button gt  CSS files that use styling on standard html elements to make them into something that is not a standard html element but is a standard Bootstrap element  e g  https   getbootstrap com docs 3 3 components  progress   In this way Bootstrap extends the list of  standard  web elements in a visually consistent way  e g  html   lt span class  glyphicon glyphicon-align-left  gt  lt  span gt  The CSS classes are designed with jQuery in mind  Internally  Bootstrap uses jQuery selectors to modify the styles on the fly and interact with the DOM  and thus provides the user the same capability  I believe this requires more explanation  so      Using Javascript jQuery  Bootstrap extends jQuery quite a bit  If we look at the source code  we can see that it uses jQuery to do things like  set up listeners for keydown event to interact with dropdowns  It does all of this jQuery setup when you import it in your  lt script gt  tag  so you need to make sure jQuery is loaded before Bootstrap is   Additionally  it ties the javascript to the DOM more tightly than plain jQuery  providing a javascript class interface  e g  toggle a button programmatically  Remember that CSS just defines how a thing looks  so the major job of these operations will tend to be to modify which CSS classes apply to the element at that moment in time  This kind of change  based on user input  can t be done with plain CSS   There are other standard interactions with a user that we denizens of the internet are used to that are not covered by CSS  Like  clicking a link that scrolls you down a page instead of changing pages  One of the things that Bootstrap gives you is an easy way to implement this behaviour on your own website   Standards  I have mentioned the word  standard  a lot here  and for good reason  I think the best thing that Bootstrap provides is a set of good-looking standards  You re free to modify the default theme as much as you want  but it s a better baseline than raw html  css and js  And this is why it s called  framework    Different web browsers have different default styles and can act differently  and need different CSS prefixes and things like that  A major benefit of Bootstrap is that it is much more reliable than writing all that cross-browser stuff yourself  you will still have problems  I m sure  but it s easier    I think that Bootstrap was preferred more when gulp and babel weren t as popular  Looking at Bootstrap it seems to come from a time before everyone compiled their javascript  It s still relevant  but you can get some of the benefits from other sources now   More recent versions of CSS have allowed you to define transitions between these static lists as they change  The original version of Bootstrap actually predates wide-spread adoption of this capability in browsers  so they still have their own animation classes  There are a few bits of Bootstrap that are like this  that other stuff has come up around it and makes it look a bit redundant

User · Answer

By today s standards and web terminology  I d say Bootstrap is actually not a framework  although that s what their website claims  Most developers consider Angular  Vue and React frameworks  while Bootstrap is commonly referred to as a  library     But  to be exact and correct  Bootstrap is an open-source  mobile-first collection of CSS  JavaScript and HTML design utilities aimed at providing means to develop commonly used web elements considerably faster  and smarter  than having to code them from scratch    A few core principles which contributed to Bootstrap s success    it s reusable it s flexible  i e  allows custom grid systems  changing responsiveness breakpoints  column gutter sizes or state colors with ease  as a rule of thumb  most settings are controlled by global variables  it s intuitive it s modular  both JavaScript and  S CSS use a modular approach  one can easily find tutorials on making custom Bootstrap builds  to include only the parts they need  has above average cross-browser compatibility web accessibility out of the box  screenreader ready  it s fairly well documented   It contains design templates and functionality for  layout  typography  forms  navigation  menus  including dropdowns   buttons  panels  badges  modals  alerts  tabs  collapsible  accordions  carousels  lists  tables  pagination  media utilities  including embeds  images and image replacement   responsiveness utilities  color-based utilities  primary  secondary  danger  warning  info  light  dark  muted  white   other utilities  position  margin  padding  sizing  spacing  alignment  visibility   scrollspy  affix  tooltips  popovers     By default it relies on jQuery  but you ll find jQuery free variants powered by each of the modern popular progressive JavaScript frameworks     React-Bootstrap - React powered Bootstrap BootrapVue - Vue powered Bootstrap ng-bootstrap - Angular powered Bootstrap   Working with Bootstrap relies heavily on applying certain classes  or  depending on JS framework  directives  methods or attributes props  and on using particular markup structures    Documentation typically contains generic examples which can be easily copy-pasted and used as starter templates     Another advantage of developing with Bootstrap is its vibrant community  translated into an abundance of themes  templates and plugins available for it  most of which are open-source  i e  calendars  date time-pickers  plugins for tabular content management  as well as libraries component collections built on top of Bootstrap  such as MDB  portfolio templates  admin templates  etc      Last  but not least  Bootstrap has been well maintained over the years  which makes it a solid choice for production-ready applications websites

User · Answer

In simpler words  you can understand Bootstrap as a front-end web framework that was created by Twitter for faster creation of device responsive web applications  Bootstrap can also be understood mostly as a collection of CSS classes that are defined in it which can simply be used directly  It makes use of CSS  javascript  jQuery etc  in the background to create the style  effects  and actions for Bootstrap elements   You might know that we use CSS for styling webpage elements and create classes and assign classes to webpage elements to apply the style to them  Bootstrap here makes the designing simpler since we only have to include Bootstrap files and mention Bootstrap s predefined class names for our webpage elements and they will be styled automatically through Bootstrap  Through this  we get rid of writing our own CSS classes to style webpage elements  Most importantly Bootstrap is designed in such a way that makes your website device responsive and that is the main purpose of it  Other alternates for Bootstrap could be - Foundation  Materialize etc  frameworks   Bootstrap makes you free from writing lots of CSS code and it also saves your time that you spend on designing the web pages

User · Answer

Bootstrap is an HTML  CSS  JS framework with many components that let you create beautiful and modern web sites or web applications very fast    The following websites contain examples  elements and reusable components that you can integrate into your project using bootstrap framework  bootsnipp com  startbootstrap com  bootdey com

User · Answer

It is an HTML  CSS  and JavaScript open-source framework  initially created by Twitter  that you can use as a basis for creating web sites or web applications     More information and links to download Getting started Examples Themes Bootply - Bootstrap Editor and Builder   Update  The official bootstrap website is updated and includes a clear definition    Bootstrap is the most popular HTML  CSS  and JS framework for developing responsive  mobile first projects on the web     Designed and built with all the love in the world by  mdo and  fat

User · Answer

Bootstrap  as I know it  is a well defined CSS  Although using Bootstrap you could also use JavaScript  jQuery etc  But the main difference is that  using Bootstrap you can just call the class name and then you get the output on the HTML form  for eg  coloring of buttons shaping of text  using layouts  For all this you do not have to write a CSS file rather you just have to use the correct class name for shaping your HTML form

User · Answer

Bootstrap is the world   s most popular and widely used open-source framework for developing with HTML  CSS  and JS  It is a front end framework of HTML  Bootstrap helps in building responsive websites or web applications and a 12-column grid system that helps dynamically adjust the website to a suitable screen resolution  The current version of bootstrap is 4 3 1 and the bootstrap team has also officially announced Bootstrap 5 version and changes like removing jquery from bootstrap  Some of the crucial reasons why bootstrap framework is most preferable are  It is easy to use  Bootstrap has a big community support  Customizations can be done easily  It increases development speed  Responsiveness For more details  you can check the official website  https   getbootstrap com    Source  https   vmokshagroup com blog bootstrap-advantages

User · Answer

Bootstrap is Open source HTML Framework  which compatible at almost every Browser  Basically Large Screen Browser width is  gt 992px  and extra Large 1200px  so by using Bootstrap defined classes we can adjust screen resolution for displaying contents at every screen from small mobiles to Larger Screen  I tried to explain very short  for Example    lt div class  quot col-sm-3 quot  gt      lt  div gt   lt div class  quot col-sm-9 quot  gt      lt  div gt

User · Answer

Bootstrap is an open-source Javascript framework developed by the team at Twitter     It is a combination of HTML  CSS  and Javascript code designed to help build user interface components    Bootstrap was also programmed to support both HTML5 and CSS3       Also it is called Front-end-framework       Bootstrap is a free collection of tools for creating a websites and web applications       It contains HTML and CSS-based design templates for typography  forms  buttons  navigation and other interface components  as well as optional JavaScript extensions       Some Reasons for programmers preferred Bootstrap Framework         Easy to get started   Great grid system   Base styling for most HTML   elements Typography Code Tables Forms Buttons Images Icons    Extensive list of components   Bundled Javascript plugins      Taken from About Bootstrap Framework

[html] What is Bootstrap?

Examples related to html

Examples related to css

Examples related to twitter-bootstrap

Examples related to frontend