Bootstrap学习笔记-布局

  默认是响应式布局,就是你在改变页面的时候也不会出现乱的现象。

      

<html>
<head>
<meta charset="utf-8">
<title>布局</title>
<link rel="stylesheet" type="text/css" href="bootstrap/css/bootstrap.css">
<script type="text/javascript" src="bootstrap/js/jquery-1.9.1.js"></script>
<script type="text/javascript" src = "bootstrap/js/bootstrap.js"></script>
<meta name="viewport" content="width-device-width,initial-scale=1">

</head>
<body>
<div class="container">

<h1 class="page-header">固定的宽度</h1>

</div>

<div class="container-fluid">

<h1 class="page-header">固定的宽度百分比</h1>

</div>

</body>
</html>

Bootstrap学习笔记-布局的更多相关文章

  1. Bootstrap~学习笔记索引

    回到占占推荐博客索引 bootstrap已经用了有段时间了,感觉在使用上还是比较容易接受的,在开发人员用起来上,也还好,不用考虑它的兼容性,手机,平台,PC都可以有效的兼容. bootstrap官方a ...

  2. Bootstrap学习笔记(二) 表单

    在Bootstrap学习笔记(一) 排版的基础上继续学习Bootstrap的表单,编辑器及head内代码不变. 3-1 基础表单 单中常见的元素主要包括:文本输入框.下拉选择框.单选按钮.复选按钮.文 ...

  3. bootstrap学习笔记之为导航条添加标题、二级菜单及状态 http://www.imooc.com/code/3120

    为导航条添加标题.二级菜单及状态 加入导航条标题 在Web页面制作中,常常在菜单前面都会有一个标题(文字字号比其它文字稍大一些),其实在Bootstrap框架也为大家做了这方面考虑,其通过" ...

  4. bootstrap学习笔记之基础导航条 http://www.imooc.com/code/3111

    基础导航条 在Bootstrap框中,导航条和导航从外观上差别不是太多,但在实际使用中导航条要比导航复杂得多.我们先来看导航条中最基础的一个--基础导航条. 使用方法: 在制作一个基础导航条时,主要分 ...

  5. bootstrap学习笔记<八>(bootstrap核心布局风格——栅格系统)

    栅格系统(bootstrap的核心之一,也是bootstrap的主要布局风格) 栅格系统是对原有div布局的升级版.打破了传统div模式只能纵向垂直排列的弊端,大大提高了页面布局的速度和效果,也很好的 ...

  6. Bootstrap学习笔记博客

    本片博客用于记录之后要用到Bootstrap的学习笔记   概括: Bootstrap 是一个用于快速开发 Web 应用程序和网站的前端框架.Bootstrap 是基于 HTML.CSS.JAVASC ...

  7. Bootstrap学习笔记系列1-------Bootstrap网格系统

    Bootstrap网格系统 学习笔记 [TOC] 简单网格 先上代码再解释 <!DOCTYPE html> <html> <head> <title>B ...

  8. bootstrap 学习笔记(1)---介绍bootstrap和栅格系统

    学习前端许久,对于布置框架和响应浏览器用html 和javascript 写的有点繁琐,无意间看到这个框架,觉得挺好用的就开始学习了,但是这个框架上面有很多知识,不是所有的都要学的,故将学习笔记和觉得 ...

  9. bootstrap学习笔记--bootstrap安装环境

    Bootstrap 安装是非常容易的.此文是本人的学习汇总,便于以后查询学习,同时也希望给大家带来帮助. 下载 Bootstrap 您可以从 http://getbootstrap.com/ 上下载 ...

随机推荐

  1. 电子邮件 -- 图解TCP_IP_第5版

    图解TCP_IP_第5版 作者: [日]竹下隆史 / [日]村山公保 / [日]荒井透 / [日]苅田幸雄 出版社: 人民邮电出版社原作名: マスタリングTCP/IP 入門編 第5版译者: 乌尼日其其 ...

  2. 在ubuntu中安装rpm包

    Ubuntu的软件包格式是deb,如果要安装rpm的包,则要先用alien把rpm转换成deb. sudo apt-get install alien #alien默认没有安装,所以首先要安装它 su ...

  3. MySQL大数据量分页性能优化

    mysql大数据量使用limit分页,随着页码的增大,查询效率越低下. 测试实验 1.   直接用limit start, count分页语句, 也是我程序中用的方法: select * from p ...

  4. Jquery操作select选项集合,判断集合中是否存在option

    转载:http://www.cnblogs.com/pepcod/archive/2012/07/03/JavaScript.html Query获取Select选择的Text和Value: 语法解释 ...

  5. 【CF875E】Delivery Club 二分+线段树

    [CF875E]Delivery Club 题意:有n个快递需要依次接收,这n个快递分部在x轴上,第i个快递的位置是xi.有两个快递员,一开始分别在s0,s1,你可以任意安排哪个人收哪个快递,前提是一 ...

  6. python pytest测试框架介绍四----pytest-html插件html带错误截图及失败重测机制

    一.html报告错误截图 这次介绍pytest第三方插件pytest-html 这里不介绍怎么使用,因为怎么使用网上已经很多了,这里给个地址给大家参考,pytest-html生成html报告 今天在这 ...

  7. 【Win】使用L2TP出现809错误

    1.环境:win7/10 2.解决: a.修改注册表(新建一个文本文件,复制以下内容,保存后文件扩展名改为.reg,双击运行文件.) Windows Registry Editor Version 5 ...

  8. 手写代码UI,xib和StoryBoard间的的优劣比较

    在UI制作方面,逐渐分化三种主要流派:使用代码手写UI:使用单个xib文件组织viewController或者view:使用StoryBoard来通过单个或很少的几个文件构建UI.三种方式各有优劣,也 ...

  9. git--指定不上传的文件夹

    在使用 vue-cli 脚手架的时候,有一个依赖模板文件夹是不希望被上传到git上的,因为里面文件太多了. 解决办法:手动创建git忽略push清单,node_module以及自身 1.文件夹内右键g ...

  10. [分布式系统学习]阅读笔记 Distributed systems for fun and profit 之一 基本概念

    因为工作的原因,最近打算看一些分布式学习的资料.其中这个http://book.mixu.net/distsys/就是一篇非常适合分布式入门的介绍. 这个短小的材料有下面5个小的章节,图文并茂,也没有 ...