一、水平居中
1、内联元素居中：相对父级块级元素居中对齐
1: .center-children {
2: text-align: center;
3: }
2、块级元素居中：设置margin-left和margin-right为auto让它居中（同时还要设置width，否则它就会承满整个容器，无法看出居中效果）
1: .center-me {
2: margin: 0 auto;
3: }
如果有很多块级元素需...
分类：
Web程序 时间：
2014-09-27 23:35:30
阅读次数：
293
来源：http://www.ido321.com/824.html一、水平居中 1、内联元素居中：相对父级块级元素居中对齐 1: .center-children { 2: text-align: center; 3: } 2、块级元素居中：设置margin-left和margin-...
分类：
Web程序 时间：
2014-09-27 22:43:00
阅读次数：
295
一、margin和padding缩写 例： .sample-margin1{ margin-top:15px; margin-right:20px; margin-bottom:12px; margin-left:24px; }
缩写后：
.sample-margin1{ margin:15px 2...
分类：
Web程序 时间：
2014-09-27 17:27:20
阅读次数：
309
做项目每次垂直居中的时候都折腾半天，在这边稍微整理一下垂直居中我所理解的一点知识吧。 1，行内元素 行内元素，比如，img，span等直接用vertical-align:middle，就可以搞定了。 2，块元素 垂直居中，最简单的方式是height：20px;line-he...
分类：
其他好文 时间：
2014-09-26 23:54:08
阅读次数：
246
今天做的这个动画实现也是非常简单，简单数几行代码就可以搞定。给这个动画取了个优雅的名字--钢琴按键，也实在是想不出什么更形象的名字了。废话不多说，直接上图。1. 先看gif图2. 代码实现思路2.1 定义五个方块的元素。2.2 对方块元素使用动画，延时改变透明度。3. 主要使用的技术主要用到了ani...
分类：
Web程序 时间：
2014-09-26 20:23:18
阅读次数：
186
在使用jade和styl写手机页面时，且元素为背景图片时，常会使用到background-size cover，它的意思是使背景图片铺满整个元素，且保证背景图片的宽高比。
即当图片小于容器时，又无法使用background-repeat来实现时，我们就可以采用cover;将背景图片放大到适合容器的大小
或者是设定元素的宽高分别为背景图片的宽高，且设置margin-left为元素宽度的一半来...
分类：
Web程序 时间：
2014-09-26 03:12:08
阅读次数：
225
关于浏览器兼容问题：一：margin加倍显示的问题。最常见的兼容问题是在块元素添加float属性，再添加横向margin时，margin会加倍显示，这时需要给元素添加属性，display:inline;,将块元素转化为行内元素。说白了，为了提高网页的兼容性：一般都是float+margin:left...
分类：
其他好文 时间：
2014-09-25 23:25:48
阅读次数：
298
1.display:block就是将元素显示为块级元素.block元素的特点是：总是在新行上开始； 高度，行高以及顶和底边距都可控制； 宽度缺省是它的容器的100%，除非设定一个宽度 , , , , 和 是块元素的例子。2.display:inline就是将元素显示为行内元素.inline元...
分类：
其他好文 时间：
2014-09-23 22:30:45
阅读次数：
186
水平居中的方法：1、margin:auto;2、text-align:center;3、posotion:50% + margin-left:-width/2;4、占位;5、JS动态控制;6、css弹性盒模型。垂直居中的方法：1、line-height(单行);2、padding-top;3、ver...
分类：
Web程序 时间：
2014-09-11 20:53:52
阅读次数：
191
1、居中一个浮动元素，关键是使用postion：relative;之后，再使用margin-left: width/2; 通过这样的方式让元素居中。【注】position:relative; 特性：（1）不使元素脱离文档流。文档流：即文档中可显示对象在排列时所占用的位置。 （2）不影响...
分类：
其他好文 时间：
2014-09-11 18:49:02
阅读次数：
128
