bootstrap学习总结-01 环境准备
1 下载Bootstrap
Bootstrap 是最受欢迎的 HTML、CSS 和 JS 框架,用于开发响应式布局、移动设备优先的 WEB 项目。当前下载的Bootstrap版本为v3.3.7
http://getbootstrap.com/ http://v3.bootcss.com/
http://www.runoob.com/bootstrap/bootstrap-tutorial.html
2 Bootstrap包含的文件
css: Bootstrap最重要的部分,预先设计好的样式文件。
fonts: Bootstrap用到的字体。
js: Bootstrap用到的JS插件。
3 使用Bootstrap
现在网页中使用Bootstrap需要在网页中加载Bootstrap用到的css样式表,js文件。
1) BootStrap的JS插件依赖于Jquery库,需要在以下网站下载Jqeruy:
http://jquery.com/
2) 编写第一个Bootstrap
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> <link rel="stylesheet" href="css/index.css" /> <meta name="viewport" content="width=device-width,initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> <link rel="icon" href="./img/index.png"> <link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.3.0/css/bootstrap.min.css"> <!-- jQuery文件。务必在bootstrap.min.js 之前引入 --> <script src="http://cdn.bootcss.com/jquery/1.11.1/jquery.min.js"></script> <!-- 最新的 Bootstrap 核心 JavaScript 文件 --> <script src="http://cdn.bootcss.com/bootstrap/3.3.0/js/bootstrap.min.js"></script> </head> <body> <div class="container"> <h1 class="page-header">使用<small>Bootstrap编写网页</small></h1> <p>helloWorld </p> </div> </body> </html>
一个知识点,你自己看懂了,那是一个层次;你会用,是另外一个层次;你写出来,你写出来让别人懂,那又是更高的一个层次;你用最通俗的言语,把知识点讲出来,让别人一下子明白,又是更高的一个层次。
如果您觉的本篇文章有用,可以赞助作者一些小额的比特币,用来买咖啡,谢谢。 收款地址:3NTPbsJKRKhe1RE1g2rZdr2dFTDgkBUgUa
注:转载需注明出处及作者名,严禁恶意转载,尊重原作者的劳动成果。
如果您觉的本篇文章有用,可以赞助作者一些小额的比特币,用来买咖啡,谢谢。 收款地址:3NTPbsJKRKhe1RE1g2rZdr2dFTDgkBUgUa
注:转载需注明出处及作者名,严禁恶意转载,尊重原作者的劳动成果。