<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <style> div{ position: absolute; background: red; /* width:200px; ...
分类：
其他好文 时间：
2017-09-13 09:49:51
阅读次数：
182
在网页中让一个未知高度的块元素水平垂直居中是一个老生常谈的问题，但是总是有些特殊场景让你无法得心应手的实现居中，本文介绍几种常用的经典的居中方法，总有一种适合你！ 1. position 2. flex 3. translate 4. calc 本文介绍的四种方法全部由以下实例验证通过，且加了兼容性 ...
分类：
Web程序 时间：
2017-09-10 20:40:54
阅读次数：
289
为什么会居中？期初我也不明白，但是看到下面的代码我就知道了，这是博主曾经写过一个水平垂直居中的技巧，就是利用空白标签实现这个效果，只不过这里换成了伪类元素。点赞.dialog_container:after {display: inline-block;content: ”;width: 0;hei ...
分类：
其他好文 时间：
2017-09-10 20:39:27
阅读次数：
135
<body> <div> <img src="1.jpg" alt="haha"> </div> </body> 将display设置成table-cell，然后水平居中设置text-align为center，垂直居中设置vertical-align为middle。 <style type="tex ...
分类：
其他好文 时间：
2017-09-09 19:05:59
阅读次数：
184
1. 请用div+css写出文字水平垂直居中，图片水平垂直居中的样式及布局。2. 请用div+css写出左侧固定(width：200px)，右侧自适应的页面布局。3. 请写出至少五种css浏览器兼容性的写法。4. jquery的绑定事件有几种方式 ，请举例说明其优缺点。5. 请写出至少三种js浏览器 ...
分类：
其他好文 时间：
2017-09-05 01:38:36
阅读次数：
171
1.父元素设置display:table;子元素设置display:table-cell; 缺点：IE7不支持，而且子元素会填满父元素，不建议使用 2.使用css3 transform:translate(-50%; -50%) 缺点:兼容性不好，IE9+ 3.使用flex布局 缺点:兼容性不好，I ...
分类：
其他好文 时间：
2017-08-28 23:44:51
阅读次数：
208
居中 日常工作常用到居中，方法很多，在这里梳理几种常见方法 水平居中 大致列表，主要有三类： 1.适用块级元素水平居中 2.适用行内元素水平居中 3.需要已知居中元素的宽 水平垂直居中 绝对定位居中 讲一讲这个的原理，先把居中元素从文档流脱离所以设置了绝对位置，父元素设置相对位置就可以包裹绝对位置的 ...
分类：
其他好文 时间：
2017-08-19 18:30:22
阅读次数：
191
水平垂直居中 一、未知宽高 1. table布局(display:table) 2. 转化为行内标签display:inline-block，借助另外一个标签高度来实现 3. 绝对布局（position:absolute）+translate 4. flex布局（box-flex） 方法一 方法一 ...
分类：
其他好文 时间：
2017-08-12 11:49:14
阅读次数：
214
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv ...
分类：
其他好文 时间：
2017-07-29 00:01:38
阅读次数：
352
