美文网首页我爱编程
Bootstrap概述(一)

Bootstrap概述(一)

作者: _LC | 来源:发表于2018-02-13 10:24 被阅读0次

    1.国内官网

    http://www.bootcss.com

    2.文档结构

    2.1 分为三大核心目录

    2.1.1 四个有css的后缀文件,包含min字样的是压缩版本,一般使用这个;不包含的属于没有压缩的,学习了解css代码的文件;map后缀的文件是css源码映射表,在一些特定的浏览器工具中使用。

    2.1.2 js压缩和未压缩的js文件

    2.1.3 fonts目录包含了不同后缀的字体文件

    3.HTML文件引入

    3.1引入CSS

    在head中使用以下形式引入

    <link rel="stylesheet" href="css/bootstrap.min.css">

    3.2 引入js

    在页面加载完成后在执行,不影响页面加载,所以放在body的最后面

    先引入jQuery,在引入bootstrap js

    <script src="js/jquery-3.3.1.min.js"></script>

    <script src="js/bootstrap.min.js"></script>

    4.学习工具

    4.1 开发工具:Sublime Text3,安装emmet代码生成插件

    “首选项”--->"插件设置"--->“Emmet”--->“Key Bindlings-User”  输入下列代码保存

    [{"keys": ["tab"], "args": {"action": "expand_abbreviation"}, "command": "run_emmet_action", "context": [{"key": "emmet_action_enabled.expand_abbreviation"}]}]

    可以使用Ctrl+shift+P调出Package Control安装插件,输入install。如出现There are no packages available for installatio,可以在github上下载Package Control替换掉本地的

    4.2 测试工具:Chrome--开发者工具

    ps:

    相关文章

      网友评论

        本文标题:Bootstrap概述(一)

        本文链接:https://www.haomeiwen.com/subject/ggzazxtx.html