bootstrap-响应式工具和打印样式
响应式工具:
<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-响应式工具和打印样式的更多相关文章
- bootstrap 响应式工具
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 移动web——bootstrap响应式工具
基本介绍 1.利用媒体查询功能并使用这些工具类可以方便的针对不同设备展示或隐藏页面内容. 基本使用 <!DOCTYPE html> <html lang="zh-CN&qu ...
- Bootstrap(6)辅组类和响应式工具
一.辅助类 Bootstrap 在布局方面提供了一些细小的辅组样式,用于文字颜色以及背景色的设置.显示关闭图标等等. 1.情景文本颜色 各种色调的字体 <p class="text-m ...
- 第二百三十六节,Bootstrap辅组类和响应式工具
Bootstrap辅组类和响应式工具 学习要点: 1.辅组类 2.响应式工具 本节课我们主要学习一下 Bootstrap 的辅组类和响应式工具,辅助类提供了一组类来辅 组页面设计,而响应式工具则利用媒 ...
- Bootstrap内辅助类,响应式工具,组件的个人总结
辅助类(工具类): 文本颜色: <p class="text-muted">Fusce dapibus, tellus ac cursus commodo, torto ...
- Bootstrap 辅组类和响应式工具
1.情景文本颜色 //各种色调的字体 <p class="text-muted">Bootstrap 视频教程</p> <p class=" ...
- bootstrap——辅助类和响应式工具类
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- bootstrap 学习笔记(5)---- 图片和响应式工具
(一)响应式图片: 在 Bootstrap 版本 3 中,通过为图片添加 .img-responsive 类可以让图片支持响应式布局.其实质是为图片设置了 max-width: 100%;. heig ...
- bootstrap的栅格系统和响应式工具
关于bootstrap的响应式布局,昨天看了杨老师的视频教学https://www.bilibili.com/video/av18357039豁然开朗,在这里记录一下 一:meta标签的引用 < ...
随机推荐
- 转 -Linux 自检和 SystemTap (强大的内核调试工具)---包含下载地址
下载: http://www.oschina.net/p/systemtap/ https://sourceware.org/systemtap/ftp/releases/ Linux 自检和 S ...
- Vs 2013 单步调试 .net framework 中遇到的问题
为了可以看清.net framework 的的内部机制,进行单步实际是不错的选择啊, 其它的更多设置可以看其它文章,我这里主要讲问题. 然后就会加载PDB,然后就可以单步进入了. 但是 , ...
- ManifoldJS
微软推出开源工具ManifoldJS,可以自动将Web App转换成各种平台的App(安卓.iOS.Chrome OS.Windows). ManifoldJS通过获取网站meta-data信息,即可 ...
- html之dl标签
用来定义列表之用 通常与dt:定义列表中的项目 dd:描述列表中的项目 示例代码: <dl> <dt>数据库</dt> <dd>oracle</d ...
- AMD规范:define和require的区别
define和require在依赖处理和回调执行上都是一样的,不一样的地方是define的回调函数需要有return语句返回模块对象(注意是对象),这样define定义的模块才能被其他模块引用:req ...
- jquery的$.extend和$.fn.extend作用及区别.txt
jQuery为开发插件提拱了两个方法,分别是: jQuery.fn.extend(); jQuery.extend(); (1)类级别 类级别你可以理解为拓展jquery类,最明显的例子是$.ajax ...
- 数字根(digital root)
来源:LeetCode 258 Add Dights Question:Given a non-negative integer num , repeatedly add all its digi ...
- HTML5 javascript修改canvas的大小
方法1: 设定固定的值,这种方式跟在html中设定canvas的值没有什么区别: window.onload = function(){ canvas.height = 100; canvas.wid ...
- Linux中ftp不能上传文件/目录的解决办法
在linux中不能上传文件或文件夹最多的问题就是权限问题,但有时也不一定是权限问题了,像我就是空间不够用了,下面我来总结一些ftp不能上传文件/目录的解决办法 在排除用户组和权限等问题后,最可能引 ...
- [原]总结VIM的实用技巧
VIM真是一个神奇而又复杂的编辑器,让我这样的Linux编程新手茫然不已啊.每次到真正动手编程的时候才发现完全不知道该怎么操作VIM,一点都没感觉到VIM的强大,哈哈--正好今天学习了一点VIM操作技 ...