Bootstarp入门教程(1)介绍

无情 阅读:607 2021-04-01 00:26:59 评论:0

Bootstarp:

                 2011年,twitter的“一小撮”工程师为了提高他们内部的分析和管理能力,用业余时间为他们的产品构建了一套易用、优雅、灵活、可扩展的前端工具集--BootStrap。Bootstrap由MARK OTTOJacob Thornton所设计和建立,在github上开源之后,迅速成为该站上最多人watch&fork的项目。大量工程师踊跃为该项目贡献代码,社区惊人地活跃,代码版本进化非常快速,官方文档质量极其高(可以说是优雅),同时涌现了许多基于Bootstrap建设的网站:界面清新、简洁;要素排版利落大方。

                 下面是摘自GitHub上对Bootstarp的说明。

                  简单灵活可用于架构流行的用户界面和交互接口的html,css,javascript工具集。基于html5、css3的bootstrap,具有大量的诱人特性:友好的学习曲线,卓越的兼容性,响应式设计,12列格网,样式向导文档,自定义JQuery插件,完整的类库,基于Less等。本系列教程遵循官方文档结构来介绍bootstrap,包括手脚架(Scaffolding),基础CSS,组件,javascript插件,使用LESS与自定义.


本教程使用MyEclipse 10作为为开发工具,你也可以使用你自己喜欢的开发IDE,Bootstarp使用目前的最新版本Bootstarp2.0.2.下载到本地。

使用MyEclipse 10 创建Web项目,将下载的Bootstarp2.0.2存放指定位置。

                                                                                                                  

添加的index.html具有如下代码框架作为后续示例的基础:

<!DOCTYPE html> 
<html> 
  <head> 
    <title>Bootstrap Demo</title> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
     <!-- 最新 Bootstrap 核心 CSS 文件 -->  
    <link rel="stylesheet" href="css/bootstrap.min.css"> 
    <!-- 可选的Bootstrap主题文件(一般不用引入) --> 
    <!--<link rel="stylesheet" href="css/bootstrap-theme.min.css">--> 
    <!-- jQuery文件。务必在bootstrap.min.js 之前引入 --> 
    <script src="http://cdn.bootcss.com/jquery/1.10.2/jquery.min.js"></script> 
    <!-- 最新的 Bootstrap 核心 JavaScript 文件 --> 
    <script src="js/bootstrap.min.js"></script>   
    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries --> 
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// --> 
    <!--[if lt IE 9]> 
        <script src="http://cdn.bootcss.com/html5shiv/3.7.0/html5shiv.min.js"></script> 
        <script src="http://cdn.bootcss.com/respond.js/1.3.0/respond.min.js"></script> 
    <![endif]--> 
  </head> 
  <body> 
    <h1>Hello, Bootstarp!</h1>     
  </body> 
</html>



                       

                   




        


声明

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

关注我们

一个IT知识分享的公众号