amazeui学习笔记--css(基本样式4)--打印样式Print
amazeui学习笔记--css(基本样式3)--打印样式Print
一、总结
1、打印显示url方法: 利用 CSS3 content
属性,将 <a>
和 <abbr>
的标题、链接显示在后面。 <a href="http://www.amazeui.org">Amaze UI</a>
2、am-print-hide类: 浏览器可见,打印机隐藏。
二、打印样式Print
打印样式组件,打印时将 color
设置成黑色,删除 background
、text-shadow
、box-shadow
样式,以节省打印机耗材,加快打印速度。
显示 URL 链接
利用 CSS3 content
属性,将 <a>
和 <abbr>
的标题、链接显示在后面。
Amaze UI
<!-- 点击浏览器菜单里的【打印】,预览打印样式 -->
<a href="http://www.amazeui.org">Amaze UI</a>
<abbr title="http://www.amazeui.org">Amaze UI</abbr>
辅助 Class
am-print-hide
浏览器可见,打印机隐藏。am-print-block
、am-print-inline-block
、am-print-inline
打印机可见,浏览器隐藏。在打印机中分别对应为block
,inline-block
,inline
样式。
<!-- 在打印预览中查看效果 -->
<div class="am-print-hide"><button type="button" class="am-btn am-btn-primary am-btn-block">浏览器可见,打印机不可见</button></div>
<div class="am-print-block"><button type="button" class="am-btn am-btn-primary am-btn-block">打印机可见,浏览器不可见</button></div>
参考链接
amazeui学习笔记--css(基本样式4)--打印样式Print的更多相关文章
- amazeui学习笔记--css(基本样式3)--文字排版Typography
amazeui学习笔记--css(基本样式3)--文字排版Typography 一.总结 1.字体:amaze默认非 衬线字体(sans-serif) 2.引用块blockquote和定义列表:引用块 ...
- amazeui学习笔记--css(基本样式2)--基础设置Base
amazeui学习笔记--css(基本样式2)--基础设置Base 一.总结 1.盒子模型:外margin,内padding,这里的内外指的边框 2.border-box:Amaze UI 将所有元素 ...
- amazeui学习笔记--css(基本样式)--样式统一Normalize
amazeui学习笔记--css(基本样式)--样式统一Normalize 一.总结 1.统一浏览器默认样式: Amaze UI 也使用了 normalize.css,就是让不同浏览器显示相同的样式 ...
- amazeui学习笔记--css(布局相关1)--网格Grid
amazeui学习笔记--css(布局相关1)--网格Grid 一.总结 基本使用 1.div+class布局:amaze里面采取的就是div+class的布局方式 <div class=&q ...
- amazeui学习笔记--css(常用组件16)--文章页Article
amazeui学习笔记--css(常用组件16)--文章页Article 一.总结 1.基本使用:文章内容页的排版样式,包括标题.文章元信息.分隔线等样式. .am-article 文章内容容器 .a ...
- amazeui学习笔记--css(常用组件14)--缩略图Thumbnail
amazeui学习笔记--css(常用组件14)--缩略图Thumbnail 一.总结 1.基本样式:在 <img> 添加 .am-thumbnail 类:也可以在 <img> ...
- amazeui学习笔记--css(常用组件13)--进度条Progress
amazeui学习笔记--css(常用组件13)--进度条Progress 一.总结 1.进度条基本使用:进度条组件,.am-progress 为容器,.am-progress-bar 为进度显示信息 ...
- amazeui学习笔记--css(常用组件12)--面板Panel
amazeui学习笔记--css(常用组件12)--面板Panel 一.总结 1.面板基本样式:默认的 .am-panel 提供基本的阴影和边距,默认边框添加 .am-panel-default,内容 ...
- amazeui学习笔记--css(常用组件11)--分页Pagination
amazeui学习笔记--css(常用组件11)--分页Pagination 一.总结 1.分页使用:还是ul包li的形式: 分页组件,<ul> / <ol> 添加 .am-p ...
随机推荐
- NOIP 模拟赛
NOIP 模拟赛 思路:求 n , m 的 gcd,然后用 n , m 分别除以 gcd:若 n 或 m 为偶数,则输出 1/2. 特别的,当 n = m = 1 时,应输出 1/1 #include ...
- leetcode笔记:Sort Colors
一. 题目描写叙述 Given an array with n objects colored red, white or blue, sort them so that objects of the ...
- iOS项目开发实战——iOS网络编程获取网页Html源码
现在我们身处互联网的时代.不论什么一个软件或是App,都会或多或少与网络打交道,并不断发生数据交互.一个没有涉及网络编程的应用会显得比較low,这里我们将会開始使用Swift开发iOS应用,而且主要来 ...
- Qt源码编译
Qt源码编译 eryar@163.com Key words. Qt, 源码编译 1.Introduction 随着Qt版本升级,源码编译出来的库体积越来越大.如果只是用Qt来做GUI,Qt提供的预编 ...
- {head first} --- networking 3
Chapter 10 无线网络 续 .. Chapter 11 网络安全 Chapter 12 设计网络 涉及到物理的设计网络布局等.我没细看. 附录
- 给Linux添加新用户,新建用户,新建帐号
给Linux添加新用户,新建用户,新建帐号 添加用户组 sudo groupadd groupname 添加用户 sudo useradd username -m -s /sbin/nologin - ...
- jquery的ajax总结
jquery的ajax总结 一.总结 一句话总结:ajax函数中层级关系如下: 最底层的封装方式: $.ajax(); 第二层: .load(),$.get(), $.post() 最高层: $.ge ...
- Onvif开发之服务端发现篇
服务端的开发相对来说比客户端稍微难一点,也就是给填充相关结构体的时候,需要一点一点的去查阅,验证各个结构中各个成员各自代表什么意思,以及对应的功能需要是那个接口实现,这是开发服务端最头疼的事情.(在开 ...
- 浏览器加载跟渲染html的顺序-css渲染效率的探究
1.浏览器加载和渲染html的顺序1.IE下载的顺序是从上到下,渲染的顺序也是从上到下,下载和渲染是同时进行的.2.在渲染到页面的某一部分时,其上面的所有部分都已经下载完成(并不是说所有相关联的元素都 ...
- LA 2531 The K-league 最大流
#include <iostream> #include <cstdio> #include <fstream> #include <algorithm> ...