程序开发人员最可悲的一点，就是做出来的界面效果实在不怎么好看，在整个WEB项目（或App项目中），最麻烦的就在于界面的布局,组件的控制上,还需要考虑不同的浏览器.
利用BootStrap在编写任何页面的时候都会变得非常容易,只需要调用几个简单的CSS样式,就可以进行完美的界面显示
可以在https://v3.bootcss.com/getting-started/#download下载
所谓的生产环境实际上指的就是开发文件(*.css,*.js)比较小,也就是说所谓的压缩版本的程序代码.就是将一些无用的空格,注释都删除掉,
如果要想使用bootstrap,只需要将dist目录下的css,js,fonts文件夹拷贝到项目之中就可以了.此时工作环境就都准备完成了,那么随后需要做的就是进行代码的编写
●css:bootstrap.mian.css,所有的源代码都在"bootstrap.css"格式化进行了显示;
●js:bootstrap.main.js,所有的源代码都在"bootstrap.js"文件里面格式化显示了
但是有一点需要注意了,如果你只是拥有一个bootstrap那么还是无法开发,bootstrap是基于jQuery的建立的应用的,所以需要将jQuery的开发包进行配置
范例:定义bootstrap的基础模板
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<!---->
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>bootstrap</title>
<script type="text/javascript" src="js/jquery.min.js" ></script>
<!--//Bootstrap需要jquery的支持，所以一定要导入jquery开发包-->
<script type="text/javascript" src="bootstrap/js/bootstrap.min.js" ></script>
<link rel="stylesheet" href="bootstrap/css/bootstrap-theme.min.css" />
</head>
<body>
</body>
</html>
使用了Bootstrap之后,整个页面的开发就变得非常容易了.而且界面的显示只需要操作几个css样式就可以完成了.
Bootstrap从3.x开始支持移动设备,可以利用如下语句设置设备大小:
<meta name="viewport" content="width=device-width,initial-scale=1">
扫一扫
1493
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
