Bootstrap页面框架

简介

点击链接:https://v3.bootcss.com/
别人已经提前写好了一大堆css和js 我们只需要引入之后按照人家规定好的操作方式即可使用所有的样式和功能

版本有很多 使用V3即可

文件结构
	bootstrap.css
 	bootstrap.js
	ps:js部分是需要依赖于jQuery

CDN:
   <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css" >
<script src="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>

pycharm自动提示问题
	最好本地导入几次 

核心部分讲解

使用bootstrap其实只需要操作标签的样式类即可

布局容器
	class = 'container'			有留白
 	class = 'container-fluid'	  没有留白

栅格系统
	class = 'row'			一行均分12份
   		class = 'col-md-8'		占12份其中的8份
    屏幕参数
    	col-md6  col-xs-2 col-sm-3	col-lg-3		
       是关于在不同设备上面网页的显示比率
栅格偏移
	col-md-offset-3

重要样式

1.表格样式
	<table class='table table-hover table-striped'>
	颜色
    <tr	class='success'>
2.表单标签
	class='form-control'
3.按钮组
	class='btn btn-primary btn组件-block'

组件

1.图标
	<span class="glyphicon glyphicon-search" aria-hidden="true"></span>
	https://fontawesome.com.cn/
2.导航条
	class="navbar navbar-inverse"
3.其他