bootsrap-----固定布局解析
<div class="container">
container
</div>
.container {
.container-fixed();容器的width为auto 左右padding为15 （注意是borderBox）
容器的width为750 左右padding为15 （注意是borderBox）
@media (min-width: @screen-sm-min) {
width: @container-sm;
} 容器的width为970 左右padding为15 （注意是borderBox）
@media (min-width: @screen-md-min) {
width: @container-md;
} lg大屏 w >=1200 容器的width为1170 左右padding为15 （注意是borderBox）
@media (min-width: @screen-lg-min) {
1140+30=1700
width: @container-lg;
}
}
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<link rel="stylesheet" href="css/bootstrap.min.css" />
<style type="text/css">
.container{
border: 1px solid;
height: 30px;
background: pink;
}
</style>
</head>
<body>
<!--固定容器
width >=
>= width >=
>= width >=
>= width 流体
-->
<div class="container">
container
</div>
</body>
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
</html>
container
bootsrap-----固定布局解析的更多相关文章
- 第 31 章 项目实战-PC 端固定布局[5]
学习要点: 1.底部区域 2.说明区域 3.版权及证件区 主讲教师:李炎恢 本章主要开始使用学习用 HTML5 和 CSS3 来构建 Web 页面,第一个项目采用 PC 端固定布局来实现. 一．底部区 ...
- 第 31 章 项目实战-PC 端固定布局[4]
学习要点: 1.热门旅游区 2.标题介绍区 3.旅游项目区 主讲教师:李炎恢 本章主要开始使用学习用 HTML5 和 CSS3 来构建 Web 页面,第一个项目采用 PC 端固定布局来实现. 一．热门 ...
- 第 31 章 项目实战-PC 端固定布局[3]
学习要点: 1.搜索区 2.插入大图 3.搜索框 主讲教师:李炎恢 本章主要开始使用学习用 HTML5 和 CSS3 来构建 Web 页面,第一个项目采用 PC 端固定布局来实现. 一．搜索区 本节课 ...
- 第 31 章 项目实战-PC端固定布局[2]
学习要点: 1.大纲算法 2.section和div 3.结构分析 主讲教师:李炎恢 本章主要开始使用学习用HTML5和CSS3来构建Web页面,第一个项目采用PC端 固定布局来实现. 一．大纲算法 ...
- 第 31 章 项目实战-PC端固定布局[1]
学习要点: 1.准备工作 2.创建项目 3.网站结构 4.CSS选择器 5.完成导航 主讲教师:李炎恢 本章主要开始使用学习用HTML5和CSS3来构建Web页面,第一个项目采用PC端 固定布局来实现 ...
- BootStrap2学习日记2--将固定布局换成响应式布局
概要:响应式页面是指页面根据浏览平台(尺寸)的不同显示不同的CSS. 原理:在Html的的头加入代码 <style> /*当浏览器宽度大于767是 采用括号里面的CSS样式*/ @medi ...
- 第九十一节，html5+css3pc端固定布局，完成首页
html5+css3pc端固定布局,完成首页 此时我们的首页就完成了 首页效果 其他页面我就不做了,原理相同,做其他页面时将头尾css分离调用即可 大纲算法 我们看看大纲算法比较清晰,说明符合规则 h ...
- 第九十节，html5+css3pc端固定布局，底部区域，说明区域，版权区域
html5+css3pc端固定布局,底部区域,说明区域,版权区域 完成: HTML代码: <!--尾部--> <footer class="wei-bu"> ...
- 第八十九节，html5+css3pc端固定布局，热门旅游取，标题介绍区，旅游项目区
html5+css3pc端固定布局,热门旅游取,标题介绍区,旅游项目区 样式: html代码: <!--主体--> <section class="zhu-ti" ...
- 第八十八节，html5+css3pc端固定布局，搜索区，插入大图，搜索框
html5+css3pc端固定布局,搜索区,插入大图,搜索框 设置一个div作为搜索区域 1.宽度为百分之百 2.最小宽度为1263,因为要考虑到手机,等小屏幕缩小后宽度会自适应,导致破坏布局,将最小 ...
随机推荐
- CSS中复选框单选框与常用12px文字不对齐问题（转载）
原文 http://www.cnblogs.com/aobingyan/p/3823556.html,有删改 目前中文网站上面的文字,绝大多数网站的主流文字大小为12px,因为在目前高分辨率显示器屏 ...
- 高级UI晋升之常用View（三）中篇
更多Android高级架构进阶视频学习请点击:https://space.bilibili.com/474380680本篇文章将从ViewPager来介绍常用View:文章目录 一.简介 二.基本使用 ...
- Warshall算法和Floyd算法
不用说这两位都是冷门算法……毕竟O(n^3)的时间复杂度算法在算法竞赛里基本算是被淘汰了……而且也没有在这个算法上继续衍生出其他的算法… 有兴趣的话:click here.. 话说学离散的时候曾经有个 ...
- wbinfo - 向winbind服务查询信息
总览 SYNOPSIS wbinfo [-a user%password] [-c username] [-C groupname] [--domain domain] [-I ip] [-s sid ...
- userdel -删除使用者帐号及相关档案
总览 SYNOPSIS userdel [-r] login 描述 userdel 命 令 修 改 系 统 帐 号 档 删 除 所 有 login 会 参 考 的 部 份 . 使 用 者 名 称 必 ...
- pxe装机试验 2019.8.21
部署FTP服务 1.安装FTP服务,并将安装源复制到/var/ftp/centos7目录下: [root@pxe ~]# yum -y install vsftpd [root@pxe ~]# mkd ...
- python异常整理
一.操作excel 时异常 1.PermissionError: [Errno 13] Permission denied (1)原因:权限错误:[Errno 13] 权限被拒绝 错误产生的原因是文件 ...
- mysql 学习之1 mysql的基本语法
转载一位csdn中 乍得12138前辈的 转载:https://blog.csdn.net/qq_26200347/article/details/79781882
- tf-idf 词条权重计算
在文本分类问题中,某些高频词一直出现,这样的词对区分文档的作用不大,例如: D1: 'Job was the chairman of Apple Inc.' D2: 'I like to use ...
- The chance for love doesn't come around every day.
The chance for love doesn't come around every day.爱的机会不是每天都有的.