• bootstrap学习和使用的经验总结


    第一肯定是下载

    然后就是目录介绍,因为bootstrap是个轻量级的框架,目录不是很多,所以很容易理解,主要有用的就是三个文件,bootstrap.js,bootstrap.css,bootstrap-responsive.css(是响应是布局才需要引入的css)。很简单,要用所有的功能,就全部引入自己的html页面里面。然后还可以看一看它官方给出的一些模版,当然模版我们参考就是了,copy是没有意义的。

    第二步是研究了scaffolding

    这个是bootstrap的布局相关的,bootstrap的布局很简单,只要在你的div里面加上class属性,然后再把bootstrap.css里的class加上去就能够实现布局了,很简单,介绍两种很流行的布局,流体布局和响应事布局,都是基于bootstrap的栅格系统

    贴上一段代码

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    <div class="container-fluid">
      <div class="row-fluid">
        <div class="span2">
          <!--Sidebar content-->
        </div>
        <div class="span10">
          <!--Body content-->
        </div>
      </div>
    </div>
    1
    2
    3
    响应事布局需要引入下面两端代码
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link href="assets/css/bootstrap-responsive.css" rel="stylesheet"

     然后就可以进行自己的响应时布局了,然后可以通过以下一些类来判断不同的屏幕宽度来对应显示到浏览器最佳的内容,可以通过这些类来进行选项 013016_1f5y_205358.png

  • 相关阅读:
    [CTF隐写]png中CRC检验错误的分析
    Bugku
    Bugku
    【CTF 攻略】CTF比赛中关于zip的总结
    sqlserver中利用Tran_sql把逗号分隔的字符串拆成临时表
    H5摇一摇遇到的问题
    C# MVC 微信支付之微信模板消息推送
    各种大型网站技术架构
    ORM框架详解
    显示实现接口
  • 原文地址:https://www.cnblogs.com/xingfuboke/p/4994757.html
Copyright © 2020-2023  润新知