响应式工具:

<div class="container">
<!--
针对不同的宽度 展示或隐藏相关内容
visible-lg-block 显示
hidden-lg 隐藏
-->
<div class="row">
<div class="col-lg-4 visible-lg-block">1</div>
<div class="col-lg-4 visible-lg-inline">2</div>
<div class="col-lg-4 visible-lg-inline-block">3</div>
</div> <div class="row">
<div class="col-lg-4 hidden-lg">4</div>
</div>
</div>

打印样式:

<div class="container">
<!--
visible-print-block: 只有在打印的时候显示
hidden-print 打印的时候不显示
-->
<div class="row">
<div class="col-lg-3 visible-print-block">1</div>
<div class="col-lg-3 visible-print-inline">2</div>
<div class="col-lg-3 visible-print-inline-block">3</div>
<div class="col-lg-3 hidden-print">4</div>
</div>
</div>

bootstrap-响应式工具和打印样式的更多相关文章

  1. bootstrap 响应式工具

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. 移动web——bootstrap响应式工具

    基本介绍 1.利用媒体查询功能并使用这些工具类可以方便的针对不同设备展示或隐藏页面内容. 基本使用 <!DOCTYPE html> <html lang="zh-CN&qu ...

  3. Bootstrap(6)辅组类和响应式工具

    一.辅助类 Bootstrap 在布局方面提供了一些细小的辅组样式,用于文字颜色以及背景色的设置.显示关闭图标等等. 1.情景文本颜色 各种色调的字体 <p class="text-m ...

  4. 第二百三十六节,Bootstrap辅组类和响应式工具

    Bootstrap辅组类和响应式工具 学习要点: 1.辅组类 2.响应式工具 本节课我们主要学习一下 Bootstrap 的辅组类和响应式工具,辅助类提供了一组类来辅 组页面设计,而响应式工具则利用媒 ...

  5. Bootstrap内辅助类,响应式工具,组件的个人总结

    辅助类(工具类): 文本颜色: <p class="text-muted">Fusce dapibus, tellus ac cursus commodo, torto ...

  6. Bootstrap 辅组类和响应式工具

    1.情景文本颜色 //各种色调的字体 <p class="text-muted">Bootstrap 视频教程</p> <p class=" ...

  7. bootstrap——辅助类和响应式工具类

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  8. bootstrap 学习笔记(5)---- 图片和响应式工具

    (一)响应式图片: 在 Bootstrap 版本 3 中,通过为图片添加 .img-responsive 类可以让图片支持响应式布局.其实质是为图片设置了 max-width: 100%;. heig ...

  9. bootstrap的栅格系统和响应式工具

    关于bootstrap的响应式布局,昨天看了杨老师的视频教学https://www.bilibili.com/video/av18357039豁然开朗,在这里记录一下 一:meta标签的引用 < ...

随机推荐

  1. Intro to Filtering with Network Monitor 3.0

    https://blogs.technet.microsoft.com/netmon/2006/10/17/intro-to-filtering-with-network-monitor-3-0/ h ...

  2. JVM ,JIT ,GC RUNTIME 解析

    Java Class字节码知识点回顾 https://yq.aliyun.com/articles/2358?spm=5176.8067842.tagmain.105.fQdvH3 JVM Class ...

  3. breakpoints

    https://blogs.msdn.microsoft.com/visualstudioalm/2013/10/07/breakpoints-in-visual-studio-2013/ Using ...

  4. C# Post方式传输报文,和处理响应

    public string DoPost(string url, string data) { HttpWebRequest req = GetWebRequest(url, "POST&q ...

  5. 024. asp.net中第一次使用GridView (设置鼠标经过时更换背景色)

    1. 前端HTML代码 <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Inde ...

  6. 【Log4j】 log4j.properties 使用

    一.参数意义说明 输出级别的种类 ERROR.WARN.INFO.DEBUG ERROR 为严重错误 主要是程序的错误 WARN 为一般警告,比如session丢失 INFO 为一般要显示的信息,比如 ...

  7. bzoj1015 星球大战

    Description 很久以前,在一个遥远的星系,一个黑暗的帝国靠着它的超级武器统治者整个星系.某一天,凭着一个偶然的机遇,一支反抗军摧毁了帝国的超级武器,并攻下了星系中几乎所有的星球.这些星球通过 ...

  8. Chrome离线下载地址

    每当chrome有更新之后,都有不少用户想要下载离线版的安装文件,但苦于找不到下载地址而发愁,其实这个问题很简单,下面我来分享一下方法(仅针对Windows操作系统): 对于稳定版(正式版)Chrom ...

  9. FastReport使用总结三——条码简介

    FastReport Desinger中支持的Barcode类型如下图所示: 设置其Barcode属性可以实现支持不同的条码类型. 注意: 支持的条码类型说明如下: 总结: 1.通过设置Barcode ...

  10. jfinal配置rails的数据表

    鉴于rails的部署太可怕,所以有了使用rails的建表工具和migration,用jfinal来开发的想法,在此贴一下需要注意的地方 maven配置 <dependency> <g ...