padding

　　上一篇文章学习了CSS的Box Model（盒子模型），在接下来的文章中，我会由内而外学习元素Box Model的中的padding、border和margin属性。 　　这一篇文章，先来学习元素内边矩（padding）：CSS padding 属性定义元素边框（border）与元素内容（element content）之间的空白区域。css padding属性的取值可以是auto（由浏览器计算内边矩的值）、以具体的单位计算的长度值（默认是0px）或百分比（基于父元素的宽度的百分比计算的内边距）。下图表示的是上一篇文章中的Box Model模型，其中的黄色区域（用红色箭头标注）就是元素的内边矩（padding）。 一、简写属性 　　CSS padding简写属性就是在一个声明中设置一个元素的所有padding属性。由于浏览器对CSS padding 属性有值复制的规则，所以简写属性也有不同的写法。例如，设置所有 h1 元素的各边都有 10 像素的内边距，只需要这样： /*设置所有一级标题有10px的内边矩*/ h1 {padding: 10px;} 　　我们还可以按照上、右、下、左的顺序分别设置各边的内边距，各边均可以使用不同的单位或百分比值： /*使用不同的长度单位*/ h1 {padding: 10px 0.25em 2ex 20%;} 二、单边内边矩属性 　

在网页中“一切皆是盒子” 盒子 CSS处理网页时，它认为每个元素都包含在一 个不可见的盒子里。 为什么要想象成盒子呢？因为如果把所有的元 素都想象成盒子，那么我们对网页的布局就相 当于是摆放盒子。 我们只需要将相应的盒子摆放到网页中相应的 位置即可完成网页的布局。 盒子模型 一个盒子我们会分成几个部分： – 内容区(content) – 内边距(padding) – 边框(border) – 外边距(margin) 看一下面的图来感受一下盒模型 所有的文档元素（标签）都会生成一个矩形框，我们成为元素框（element box），它描述了一个文档元素再网页布局汇总所占的位置大小。 因此，每个盒子除了有自己大小和位置外，还影响着其他盒子的大小和位置。 内容区 内容区指的是盒子中放置内容的区域，也就是元素 中的文本内容，子元素都是存在于内容区中的。 如果没有为元素设置内边距和边框，则内容区大小 默认和盒子大小是一致的。 通过width和height两个属性可以设置内容区的大 小。 width和height属性只适用于块元素 内边距 顾名思义，内边距指的就是元素内容区与边框以内 的空间。 默认情况下width和height不包含padding的大小。 使用padding属性来设置元素的内边距。 例如： – padding:10px 20px 30px 40px – 这样会设置元素的上、右

做人要大度，海纳百川，做事要圆滑，左右逢源，这让我想到了编程也是如此，代码要扩展，界面也要考虑自适应。 这篇文章是android开发人员的必备知识，是我特别为大家整理和总结的，不求完美，但是有用。 1.背景自适应且不失真问题的存在 制作自适应背景图片是UI开发的一个广泛问题，也是界面设计师渴望解决的问题，我相信我们彼此都深有体会。 比如,列表的背景图一定，但是列表的高度随着列表数据项会发生变化；标题栏的背景，无论横屏还是竖屏，高分辨率还是低分辨率，都能自动填充满，而且不失真等等背景问题。 根据以往的经验，我们一般采用先切图后拼凑的做法，这种做法本来我想在这里和大家介绍一下，其实有的时候还是很有用的，但是说起来会比较麻烦，就不说这个非重点了，略去，如果大家真的要介绍，在回复中说明，我再考虑一下。 Android针对这种情况，专门制作了一种.9.PNG格式来解决这个问题。 2.9.PNG格式。 我不想在这里过多的讨论PNG格式的定义问题。但是.9.PNG确实是标准的PNG格式，只是在最外面一圈额外增加1px的边框，这个1px的边框就是用来定义图片中可扩展的和静态不变的区域。特别说明，left和top边框中交叉部分是可拉伸部分，未选中部分是静态区域部分。right和bottom边框中交叉部分则是内容部分（变相的相当于定义看一个内边距，神似padding功能，后面我会单独介绍一下）

1.打印部分 　　新增print.js // strPrintName 打印任务名 // printDatagrid 要打印的datagrid function CreateFormPage(strPrintName, printDatagrid) { var tableString = '<table cellspacing="0" class="pb">'; var frozenColumns = printDatagrid.datagrid("options").frozenColumns; // 得到frozenColumns对象 var columns = printDatagrid.datagrid("options").columns; // 得到columns对象 var nameList = ''; // 载入title if (typeof columns != 'undefined' && columns != '') { $(columns).each(function (index) { tableString += '\n<tr>'; if (typeof frozenColumns != 'undefined' && typeof frozenColumns[index] != 'undefined') { for (var i = 0; i <

EasyUI的DataGrid 打印导出 一直在Winform和WPF的项目，偶尔接触Web都是网上下个模板修修改改就成了，学习的不太深入。 今日遇到一个打印导出datagrid的问题，做桌面项目的打印导出通常我都是直接将数据源拿过来放到我的打印导出模块直接就出来了，但是在web上没有积累，特别是用了EasyUI的DataGrid,一时不知道如何是好。 遂度娘一翻找到如下解决方案： 1.打印部分 　　新增print.js // strPrintName 打印任务名 // printDatagrid 要打印的datagrid function CreateFormPage(strPrintName, printDatagrid) { var tableString = '<table cellspacing="0" class="pb">'; var frozenColumns = printDatagrid.datagrid("options").frozenColumns; // 得到frozenColumns对象 var columns = printDatagrid.datagrid("options").columns; // 得到columns对象 var nameList = ''; // 载入title if (typeof columns != 'undefined

inline 或者 inline-* 的元素竖直居中 可以借助 padding, line-height, vertical-align 等属性。有如下两种具体情景： 单行竖直居中，如单行文本或者链接 这种情况，通过给元素上下添加相同大小的 padding 值即可实现竖直居中。 <div class="container"> <p>单行文本竖直居中，添加相同的 padding-top & padding-bottom 值</p> </div> body { margin: 0; } .container { background-color: #fe435e; padding: 10px; } p { margin: 0; color: #fff; /* 相同的上下 padding 值使单行文字居中 */ padding-top: 100px; padding-bottom: 100px; } 专门建立的学习Q-q-u-n：⑦⑧④-⑦⑧③-零①② ，分享学习的方法和需要注意的小细节，不停更新最新的教程和学习技巧 （从零基础开始到前端项目实战教程，学习工具，全栈开发学习路线以及规划） 如果不想使用 padding 不方便使用 padding 时，可以通过给元素设置 line-height，使其等于父容器的高度，从而实现竖直居中。注意，此时记得要考虑父容器的 padding 和

demo 如下Go语言伪代码，开启两个协程，分别对一个结构体变量中的两个相邻的数据成员进行n次原子自增操作，当打开 _ [56]byte 这个看似多余的代码后，程序运行速度加快了一倍！你知道是为什么吗？ ... type Foo struct { a uint64 // _ [56]byte b uint64 // _ [56]byte } ... go func() { for i := 0; i < 1000 * 1000; i++ { atomic.AddUint64(&foo.a, 1) } }() go func() { for i := 0; i < 1000 * 1000; i++ { atomic.AddUint64(&foo.b, 1) } }() // 等待两个协程执行完毕，记录总执行时间 ... 完整可运行代码见： https://github.com/q191201771/naza/blob/master/playground/p3/p3.go CPU cache 大家都知道，内存的速度远快于磁盘的速度，但事实上，跟CPU的处理速度相比，内存还是太慢了。CPU不愿意老是等内存，于是就有了 CPU cache 。CPU cache的速度比内存快数十倍。 很多资料上都有关于不同存储硬件速度和容量的对比，但是有的数据随着硬件的发展已经过期了