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. java学习之导出Excel

    1. 输出表格 poi输出excel最基本是输出table表格,下面是输出区域.总销售额(万元).总利润(万元)简单的表格,创建HSSFWorkbook 对象,用于将excel输出到输出流中 HSSF ...

  2. 题目1460：Oil Deposit(递归遍历图)

    题目链接:http://ac.jobdu.com/problem.php?pid=1460 详解链接:https://github.com/zpfbuaa/JobduInCPlusPlus 参考代码: ...

  3. Sencha Cmd 5.0.1.231 是坑爹货

    Sencha Cmd 5.0.1.231相比之前的版本有了很大的变动,存在很多坑爹之处,个人建议不要升级到这个版本,如果已经升级了的就卸载了还原到以前的版本吧. 历史版本下载地址:http://cdn ...

  4. 【JSP】JSP中的Java脚本

    前言 现代Web开发中,在JSP中嵌入Java脚本不是推荐的做法,因为这样 不利于代码的维护.有很多好的,替代的方法避免在JSP中写Java脚本.本文仅做为JSP体系技术的一个了解.     类成员定 ...

  5. [压缩]C#下使用SevenZipSharp压缩解压文本

    using SevenZip; using System; using System.Collections.Generic; using System.IO; using System.Linq; ...

  6. Android系统dimension单位详解

    转载请注明出处,谢谢!http://www.cnblogs.com/coding-way/p/3457878.html Android设备种类多样,要想适配好各种屏幕,理解各种屏幕数据是必须的.首先先 ...

  7. 算法学习之冒泡排序的C实现

    冒泡排序是属于比较类的排序方式,简单易懂,但是效率不是很高,不及快排. #include "stdio.h" #include "time.h" void bu ...

  8. tomcat内存溢出:PermGen space解决方法

    最近集群服务器中的几台服务器在半夜自动重启tomcat后一段时间便都会报java.lang.OutOfMemoryError: PermGen space. 习惯性的百度,得到的答案基本上都是统一的解 ...

  9. CBV流程之View源码解析

    CBV是基于反射实现根据请求方式不同,执行不同的方法. 请求流程:view源码解析 1.urls.py :请求一定来执行视图下的as_view方法.也可以直接点击as_view()来找源码. 2.vi ...

  10. 9.20Ajax知识sweetalet

    2018-9-20 14:19:55 2018-9-20 21:33:05 周末可以帮我图书商城再次优化一下!! 加入 Ajax请求,,再加上 sweetAlert  甜蜜对话框插件! 要是再加上模态 ...