Bootstrap介绍

Bootstrap是一个html、css和js的一个前端框架,应用广泛,应用于响应式、移动设备优先的web项目。

由于bootstrap是基于jquery的所以应用bootstrap.js之前要引用jq。


bootstrap css 简介

前端开发人员习惯使用全局的css文件,bootstrap也是如此。

栅格系统

bootstrap是响应式解决的方案重点就是栅格系统,所谓栅格系统就是将整个屏幕划分成若干个(一般就是12)等宽的列,bootstrap中定义了一系列的预定义类用于实现栅格系统。

bootstrap的模板

html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Bootstrap 模板title>

    
    <link href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
    <script src="https://cdn.bootcss.com/jquery/2.0.0/jquery.min.js">script>
    <script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js">script>

    
    
head>
<body>
body>
html>


常见的xs、sm、md、lg的区别

屏幕

典型设备

尺寸

命名

超小屏幕

手机

<768

-xs(extar small)

小屏幕

平板

>768

-sm(small)

中等屏幕

桌面显示器

>=992

-md

大屏幕

大规格显示器

>=1200

-lg(large)



<div class="col-xs-6" col-xs-push-6>div>
<div class="col-xs-4 col-xs-pull-6">div>



你可能感兴趣的:(bootstrap,xssmmdlg的区别,bootstrap)