<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title>屏幕五等分</title>
<meta name="generator" content="EverEdit" />
<meta name="author" content="" />
<meta name="keywords" content="" />
<meta name="description" content="" />
<!-- Bootstrap core CSS -->
<link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.3.0/css/bootstrap.min.css">
<style>
@media (min-width: 1200px) {
.col-zdlg-2-5{
float: left;
width:20%;

}
}
h2{
font-family: "Microsoft Yahei";
font-weight: 500;
line-height: 1.1;
color:#000;
}

.col-red-border{
border:1px solid red;
}
</style>
</head>
<body>
<div class="container-fluid">
<div class="rows">
<div class="col-xs-12 col-sm-12 col-md-4 col-zdlg-2-5 col-red-border">
<h2>屏幕五等分</h2>
</div>
<div class="col-xs-12 col-sm-12 col-md-4 col-zdlg-2-5 col-red-border">
<h2>屏幕五等分</h2>
</div>
<div class="col-xs-12 col-sm-12 col-md-4 col-zdlg-2-5 col-red-border">
<h2>屏幕五等分</h2>
</div>
<div class="col-xs-12 col-sm-12 col-md-4 col-zdlg-2-5 col-red-border">
<h2>屏幕五等分</h2>
</div>
<div class="col-xs-12 col-sm-12 col-md-4 col-zdlg-2-5 col-red-border">
<h2>屏幕五等分</h2>
</div>
</div>
</div>
</body>
</html>

bootstrap实现pc屏幕五等分的更多相关文章

  1. 关于bootstrap栅格系统的五等分以及八等分代码

    众所周知,bootstrap的栅格系统是基于十二等分的,今天拿到设计的设计稿一看,发现一个图片list上只有8张图片,然后上网查资料,发现只能自己写css代码实现,故写博客记录代码. 以下是八等分的代 ...

  2. Bootstrap <基础二十五>警告（Alerts）

    警告(Alerts)以及 Bootstrap 所提供的用于警告的 class.警告(Alerts)向用户提供了一种定义消息样式的方式.它们为典型的用户操作提供了上下文信息反馈. 您可以为警告框添加一个 ...

  3. Droid@screen：在PC屏幕上显示Android手机屏幕

    这里介绍一款工具——Droid@screen,用来获取手机屏幕,显示在PC屏幕上.它集截图.录像等多种功能于一体. 安装 1.    下载地址:http://droid-at-screen.org/d ...

  4. Bootstrap入门（十五）组件9：面板组件

    Bootstrap入门(十五)组件9:面板组件 虽然不总是必须,但是某些时候你可能需要将某些 DOM 内容放到一个盒子里.对于这种情况,可以试试面板组件. 1.基本实例 2.带标题的面板 3.情景效果 ...

  5. Android 如何将手机屏幕投影到 PC 屏幕上或者投影仪上做演示？

    Android 如何将手机屏幕投影到 PC 屏幕上或者投影仪上做演示? 公司开发款APP,要给领导演示,总不能用手机面对面演示吧.所以找了好久,找到一款体验超好的: Total Control-帮助你 ...

  6. bootstrap注意事项（五）表单

    1.基本实例 单独的表单控件会被自动赋予一些全局样式.所有设置了 .form-control类的 <input>.<textarea> 和 <select> 元素都 ...

  7. Bootstrap环境及屏幕适配-（一）

    一.环境搭建 1.目录结构 需要引用的文件有, jquery.js.bootstrap.min.js 和 bootstrap.min.css 文件,下面看下在线的文档Hello Word <!D ...

  8. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 辅助类：屏幕阅读器

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  9. bootstrap移动 pc 响应轮播

    PC端效果 width100% 移动端 <!DOCTYPE html> <html lang="zh-CN"> <head> <meta ...

随机推荐

  1. USACO3.1Humble Numbers[...]

    题目背景 对于一给定的素数集合 S = {p1, p2, ..., pK},考虑一个正整数集合,该集合中任一元素的质因数全部属于S.这个正整数集合包括,p1.p1*p2.p1*p1.p1*p2*p3. ...

  2. VS 的编译选项 build下的 platform target -- Any CPU和x86有什么影响？

    VS 的编译选项 build下的platform -- Any CPU和x86有什么影响? 现在的问题是,我的一个assembly用Any CPU编译就不能在64位系统下运行了,但是用x86编译就ok ...

  3. PHP从数据库导出EXCEL文件

    参考博客链接:http://www.cnblogs.com/huangcong/p/3687665.html 我的程序代码 原生导出Excel文件 <?phpheader('Content-ty ...

  4. MVC PageList使用（异步 与 正常）

    此项目的功能为1.将数据分页显示,2.搜索数据按分页显示 3.异步或同步传递 一.第一步引用 mvc PageList插件 二.控制器写法 ) //为空则默认第一页 { var lm = DataBL ...

  5. PAT 1015. 德才论 (25)

    宋代史学家司马光在<资治通鉴>中有一段著名的"德才论":"是故才德全尽谓之圣人,才德兼亡谓之愚人,德胜才谓之君子,才胜德谓之小人.凡取人之术,苟不得圣人,君子 ...

  6. 036医疗项目-模块三：药品供应商目录模块——供货商药品目录（批量）添加药品的功能---------Action层

    这篇文章我们来讲Action层: 我们先讲开发步骤: 1:我们要根据Service层里面要传的参数,在Action层传入对应的参数. Service层是:public void insertGysym ...

  7. 内网机（无网络安装 .NET Core win开发环境

    1.安装 vs2015 update3 2.按顺序安装以下包 DotNetCore.1.0.0-SDK.Preview2-x64.exe aspnetcoremodule_x64_en_rc2_14. ...

  8. 传递多个参数并获取Web API的数据

    近段时间学习Web Api觉得非常有意思.默认的路由情况之下,获取数据时,它不必指定Action操作名. 还有另外感想,就是自从学习asp.net MVC之后,加上jQuery,让Insus.NET已 ...

  9. quartz.net 项目无法加载的问题

    最近尝试试用一下quartz.net 做任务调度用. 下载了源代码后打开解决方案发现项目无法加载.错误如下 未找到导入的项目“C:\Users\****\Desktop\Quartz.NET-2.1. ...

  10. 通用权限管理系统多语言开发接口 - java，php 调用接口程序，多业务子系统集成

    1:公司里有多个业务系统,需要进行统一重构,有PHP的.有Java的.有.NET的,甚至还有delphi的. 2:公司里有多个数据库系统,有mysql的.有sqlserver的.还有oracel的,甚 ...