What is Bootstrap and how to use it-JS Tutorial-php.cn

What is Bootstrap and how to use it

清浅

Release： 2018-12-11 09:21:56

Original

5498 people have browsed it

Bootstrap is a free and open source front-end development framework mainly used for creating websites and web applications. The Bootstrap framework is mainly built based on three languages: HTML, CSS and JavaScript. It is used to promote the development of responsive, mobile-first websites and applications. In the following article, I will introduce to you in detail what Bootstrap is, as well as its download and use

【Recommended course: Bootstrap course】

What is Bootstrap and how to use it

##Bootstrap meaning:

Responsive design allows a web page or application to automatically adjust and display accordingly based on the screen size of the device the user is using; a mobile-first approach assumes smartphones, tablets And task-specific mobile applications need to be designed to meet the requirements of these technologies.

Bootstrap is a simple, intuitive, and powerful front-end development framework developed by Mark Otto and Jacob Thornton, designers of the American Twitter company, based on HTML, CSS, and JavaScript, making Web development faster. It includes user interface components, layout and JS tools, and implementation frameworks.

It provides HTML and CSS specifications. Bootstrap has been very popular since its launch and has been a popular open source project on GitHub. The software can be pre-compiled or used as source code.

Download and use of Bootstrap

(1) Download Bootstrap

Download address:

http://getbootstrap.com /

What is Bootstrap and how to use it

Click to download and decompress after the download is complete

The decompressed file is as follows:

What is Bootstrap and how to use it

(2) Externally introduce Bootstrap file

<!DOCTYPE html>
<html>
   <head>
      <title>Bootstrap 模板</title>
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <!-- 引入 Bootstrap -->
      <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
      <!--引入jQuery-->
      <script src="https://code.jquery.com/jquery.js"></script>
      <!-- 包括所有已编译的插件 -->
      <script src="js/bootstrap.min.js"></script>
   </head>
   <body>
      <h1>Hello, world!</h1>
   </body>
</html>

Copy after login

Rendering when bootstrap.min.css is not introduced:

What is Bootstrap and how to use it

Introduce bootstrap. Rendering of min.css:

What is Bootstrap and how to use it

Summary: The above is the entire content of this article, I hope it will be helpful to everyone

The above is the detailed content of What is Bootstrap and how to use it. For more information, please follow other related articles on the PHP Chinese website!