一、如何让一个不定宽高的div,垂直居中？ 1、使用flex布局，只需要在盒子的父级设置如下代码即可： 2、使用css3transform布局: 父级盒子设置： div设置： 3、使用 display:table-cell 方法 父级盒子设置： div设置： ...
分类：
Web程序 时间：
2018-02-28 18:33:17
阅读次数：
221
父元素： display: -webkit-flex; ①子元素： flex：1；（设置占比） 计算规则： 父元素会将所有子元素的flex 相加求和后，算其子元素比例。 ②flex混合划分；第一个子元素 width:100px;第二个子元素 flex:2第三个子元素 flex:1 关于不定宽高的水平 ...
分类：
其他好文 时间：
2018-01-19 23:21:35
阅读次数：
448
最新写法：CSS3，不兼容IE8 position: fixed; top: 50%; left: 50%; width: 50%; max width: 630px; min width: 320px; height: auto; z index: 2000; visibility: hidden ...
分类：
Web程序 时间：
2018-01-17 00:20:04
阅读次数：
218
1,让不定宽高的div,垂直水平居中? 父盒子:display:table-cell;text-align:center;vertical-align:middle div盒子:display:inline-block;vertical-align:middle; 2,CSS强制英文、中文换行与不换 ...
分类：
Web程序 时间：
2017-10-13 17:07:24
阅读次数：
159
1 2 这是一个终极实现的水平垂直居中实例 3 4 5 #demo{ 6 height:100px; 7 text-align:center; 8 font-size:0; //注意这里是去除文字间隔，放在内容宽度为100%时挤出换行 9 } 10 #demo:after,#demo span{ 1... ...
分类：
其他好文 时间：
2017-06-12 23:51:08
阅读次数：
186
transform的兼容性 transform的兼容性还是比较乐观的。IE9以下不兼容，IE9支持代替的-ms-transform属性不过只支持2D转换。 谷歌和Safari支持代替的-webkit-transform属性。IE9以上、火狐和欧朋是兼容的。 transform 属性向元素应用 2D ...
分类：
其他好文 时间：
2017-05-25 11:57:09
阅读次数：
163
项目中遇到的，关于居中弹出层的字体模糊问题。 先来个对比图： 清晰版： 模糊版： 这个是一个不定宽高的弹出框，居中的方式如下代码： 使用了固定定位 和 transform: translate来居中，但是由于居中的时候显示的弹框视觉效果上会有点偏下，所以调整了Y轴上的移动数字，-65%，也就是因为这 ...
分类：
其他好文 时间：
2017-02-04 11:15:48
阅读次数：
1030
一、在需要居中的元素加上如下C3属性即可: 二、只要在父级元素上面加上这三句话就可以实现不定宽高水平垂直居中: ...
分类：
Web程序 时间：
2016-11-16 20:09:14
阅读次数：
239
父级必设属性：display:table;//让子级垂直居中text-align:center//让子级水平居中子级必设属性：display:table-cell;vertical-align:middle;要点：父级要给宽高，子级在父级所设的宽高之内居中显示，如果图片要全屏居中显示，父级同过JS设置成窗口大小，若不希望图片超出窗口..
分类：
其他好文 时间：
2016-04-23 07:36:21
阅读次数：
153
