1，float不是绝对意义上的浮动，absolute才是（float无法压住盒子里面的文字 和图片，absoulte可以）（写两个盒子上面一个盒子浮动下面的盒子放img或者盒子里写文字进行测试） 2，加了定位或者浮动的盒子 margin:0 aruto 就失效了，如何居中对齐？（垂直居中同理） 首先 ...
分类：
Web程序 时间：
2019-12-17 22:17:31
阅读次数：
97
一：在知道宽高的情况下： <div style=" width:200px; height:200px; background: red; position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; "></div> ...
分类：
其他好文 时间：
2019-12-17 18:42:23
阅读次数：
80
网页布局（layout）是 CSS 的一个重点应用。 布局的传统解决方案，基于盒状模型，依赖 display 属性 + position属性 + float属性。它对于那些特殊布局非常不方便，比如，垂直居中就不容易实现。 2009年，W3C 提出了一种新的方案 Flex 布局，可以简便、完整、响应式 ...
分类：
其他好文 时间：
2019-12-15 16:26:55
阅读次数：
99
Flex布局语法教程 网页布局(layout)是css的一个重点应用 布局的传统解决方案：基于盒状模型，依赖display+position+float属性。它对于那些特殊布局非常不便，比如，垂直剧中就不易实现 //传统解决垂直居中 <div class = "content"></div> <st ...
分类：
其他好文 时间：
2019-12-14 23:04:12
阅读次数：
98
张鑫旭老师在文章《我对CSS vertical-align的一些理解与认识（一）》中提到： vertical-align:middle属性的表现与否，仅仅与其父标签有关，至于我们通常看到的与后面的文字垂直居中显示那都是假象！ 经过摸索测试，才对这句话有种豁然开朗的感觉。 html： <span cl ...
分类：
其他好文 时间：
2019-12-14 19:04:14
阅读次数：
67
一、各种背景属性 1.background-image 属性为元素设置背景图像。 元素的背景占据了元素的全部尺寸，包括内边距和边框，但不包括外边距。 默认地，背景图像位于元素的左上角，并在水平和垂直方向上重复。 提示：请设置一种可用的背景颜色，这样的话，假如背景图像不可用，页面也可获得良好的视觉效果 ...
分类：
Web程序 时间：
2019-12-11 23:14:21
阅读次数：
174
1、垂直居中对齐 .vc{ position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); } .vc{ position:absolute; top:50%; left:50%; width:100px; height:1 ...
分类：
Web程序 时间：
2019-12-07 21:24:35
阅读次数：
123
事实上，每次面试前端必问的问题就是这个。及其常见的需求，看起来似乎非常简单，但是实现起来很费劲，尤其是涉及尺寸不固定的元素。 本篇文章将介绍比较流行的几种方法。 行内块 <body> <div id="ghost"></div> <span> hello </span> </body> #ghost ...
分类：
Web程序 时间：
2019-12-01 13:27:37
阅读次数：
98
关于input光标在手机端偏移 问题根本：不要使用line-height垂直居中。 解决方法：可直接定义height，然后高度由上下padding值撑开。 移动端清除input光标 ios input 添加 readonly unselectable=”on” 属性，光标依旧还在 input聚焦时马 ...
分类：
移动开发 时间：
2019-11-30 11:37:50
阅读次数：
112
1. 伸缩布局应用: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style> section { width: 80%; height: 200px; border: ...
分类：
Web程序 时间：
2019-11-26 19:24:33
阅读次数：
115
