Home > Web Front-end > Bootstrap Tutorial > When to use bootstrap

When to use bootstrap

(*-*)浩
Release: 2020-05-15 09:22:55
Original
3481 people have browsed it

Bootstrap is a front-end framework for rapid development of web applications and websites. Bootstrap is based on HTML, CSS, and JAVASCRIPT.

When to use bootstrap

You can use bootstrap when you want the web content size to automatically adapt to the screen size, that is, When the content on PC and different mobile phones (with different display sizes) can be displayed normally. (Recommended learning: Bootstrap Tutorial)

One line can occupy up to twelve tags, whether it is a large screen or an ultra-small screen.

col-lg is generally used for large screen devices, (min-width: 1200px);

col-md is generally used for medium screen devices, (min-width: 992px) ;

col-sm is generally used for small screen devices, (min-width: 768px);

col-xs is used for ultra-small devices, (max-width: 768px);

The number followed by it is the number, that is, how many parts it occupies, such as 4, which means 3 can be displayed in one line; or 12, which means 1 can be displayed in one line.

Regarding usage, it is generally better to use all four attributes in settings, so that they can be displayed well on different screens.

For example, if you have 12 section tags, you want them to be displayed in different ways on different screen sizes. For large screens, 6 will be displayed in one line, for medium screens, 3 will be displayed in one line, and for small screens, Display 2 in a row, and display 1 in a row for ultra-small screens.

You can write this in each section tag:

<section class = “col-lg-2 col-md-4 col-sm-6 col-xs-12”></section>
Copy after login

For more technical articles related to Bootstrap, please visit the Bootstrap Tutorial column to learn!

The above is the detailed content of When to use bootstrap. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template