1th Chapter Bootstrap Introduction

Source: Internet
Author: User

Tag:reg    Code    min    official website     address     operations     Development Tools     Clubs     flexible    

In this lesson, we'll look at Boostrap history, features, uses, and why we chose boostrap to develop our Web project. A Bootstrap   Overview Bootstrap is an open source framework based on HTML, CSS, and JavaScript developed by two technical engineers from Twitter, the world's largest micro-blog. The framework is simple, visually pleasing, and can be used to quickly and easily build Web page requirements for PC-based and mobile devices. In June 2010, Twitter's internal engineers worked to solve the problem of collaboration in front-end development tasks. After a variety of options, Bootstrap was finalized and released in August 2011. After a long period of iterative upgrades, the original CSS-driven project evolved into an open-source framework for a multi-functional Web front end with many JavaScript plugins and icons. The most important part of Bootstrap is its responsive layout, which is compatible with PC-side, pad, and mobile-phone page access. Bootstrap Download and Demo: Domestic document translation official website: http://www.bootcss.com Dipper City Web Club official website: http://www.ycku.com two. Bootstrap   Features Bootstrap is very popular, thanks to its very practical features and features. The main core features are as follows: (1). Cross-device, cross-browser compatible with all modern browsers, including IE7, 8. Of course, this course no longer considers IE9 the following browsers. (2). The responsive layout not only supports the display of various resolutions of PC side, but also supports the responsive switching display of mobile PAD, mobile phone and other screen. (3). The comprehensive component bootstrap provides a very useful component, including: navigation, labels, toolbars, buttons and a series of components, convenient for developers to call. (4). The built-in jquery plugin Bootstrap provides a number of practical jquery plugins that enable developers to implement a variety of common effects on the Web. (5). Support HTML5, CSS3HTML5 semantic tags and CSS3 attributes are well supported. (6). Less dynamic style less uses variables, nesting, and manipulating mixed encodings to write faster, more flexible CSS. It and Bootstrap can well cooperate with the development. Three BOOTSTRAP   Structure First of all, to understand the Boostrap document structure, you need to download it locally on the website first. Bootstrap as follows: Bootstrap:http://v3.bootcss.com/(select production environment, v3.3.4) after extracting, the directory presents such a structure: bootstrap/├──css/│├──bootstrap.css│├──bootstrap.css.map│ ├──bootstrap.min.css│├──bootstrap-theme.css│├──bootstrap-theme.css.map│└──bootstrap-theme.min.css├──js/│├── bootstrap.js│└──bootstrap.min.js└──fonts/├──glyphicons-halflings-regular.eot├── glyphicons-halflings-regular.svg├──glyphicons-halflings-regular.ttf├──glyphicons-halflings-regular.woff└── GLYPHICONS-HALFLINGS-REGULAR.WOFF2 is divided into three main categories: CSS (Style), JS (script), fonts (font). 1.CSS directory has four CSS suffix files, which contain min words, is a compressed version, generally use this; not included in the uncompressed, you can learn the CSS code of the file, and the map suffix file is a CSS source mapping table, in some specific browser tools to use. The 2.js directory contains two files, which are uncompressed and compressed JS files. The 3.fonts directory contains font files with different suffixes. Four Create the first page we create a HTML5 page and introduce the Bootstrap core file and test it for normal display. The first of the bootstrap<! DOCTYPE html>

1th Chapter Bootstrap Introduction

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.