结构： 样式： 1.解决方案一：text-align + inline-block + table-cell + vertical-align(结合前面的水平居中+垂直居中) 2.解决方案二： absolute+transform 3.解决方案三：flex + justify-content + a ...
分类：
其他好文 时间：
2016-09-17 16:24:40
阅读次数：
127
阅读目录 方法一：position加margin 方法二： diaplay:table-cell 方法三：position加 transform 方法四：flex;align-items: center;justify-content: center 方法五：display:flex;margin: ...
分类：
Web程序 时间：
2016-09-13 19:19:44
阅读次数：
187
最近这些天都在弥补css以及css3的基础知识，在打开网页的时候，发现了火狐默认首页上有这样一个东西。 第一个css属性就没有看懂。于是乎，开始各种找资料，各种看书。这些天把对于css3伸缩布局盒（flexbox）模型的理解写成博文，目的是对flexbox做一个简单的介绍。 以下的内容会分为如下小节 ...
分类：
Web程序 时间：
2016-09-11 12:39:41
阅读次数：
455
<!DOCTYPE html><html><head> <meta charset="utf-8" /> <title>上下垂直居中 在线演示 DIVCSS5</title> <style> .Absolute-Center { margin: auto; position: absolute; t ...
分类：
其他好文 时间：
2016-09-10 11:38:25
阅读次数：
117
用css实现一个空心圆，并始终放置在浏览器窗口左下角 div{ position:fixed; bottom:0; left:0; width:100px; height:100px; border:2px solid #000; border-radius:100px;} 如何让圆水平，垂直居中 ...
分类：
Web程序 时间：
2016-09-05 19:08:27
阅读次数：
1032
我们平时常用的定高，top：50%；left：50%和margin-left负一半宽度margin-top负一半高度的居中方式暂不考虑，因为这种方式大家都会。 第一种绝对定位(absolute centering)居中： 原理： 在普通内容流（normal content flow）中，margin ...
分类：
其他好文 时间：
2016-09-04 23:58:09
阅读次数：
351
一、水平居中 需要设置两点： 1 设置DIV 的width属性即宽度。 2 设置div的margin-left和margin-right属性即可 代码： <div style="width:800px; margin-left:auto; margin-right:auto; color:White ...
分类：
其他好文 时间：
2016-09-02 18:46:47
阅读次数：
129
示例1： .div1{ width:200px; height:300px; border:1px solid #000; position: relative; } .div2{ width: 40px; height:40px; background:green; position: absol ...
分类：
Web程序 时间：
2016-09-02 08:46:07
阅读次数：
184
这个问题比较老，方法比较多，各有优劣，着情使用。 一、盒子没有固定的宽和高 方案1、Transforms 变形 这是最简单的方法，不近能实现绝对居中同样的效果，也支持联合可变高度方式使用。内容块定义transform: translate(-50%,-50%) 必须加上 top: 50%; left ...
分类：
其他好文 时间：
2016-09-01 12:41:29
阅读次数：
135
直接上代码： <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>demo</title> </head> <body> <style type="text/css"> .div1{ width: 100px; height: 10 ...
分类：
Web程序 时间：
2016-08-31 11:52:53
阅读次数：
198
