方法1：浮动 方法2：绝对定位 方法3：flex布局 方法4：display table-cell 方法5：grid布局 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <title>layout</title> <s ...
分类：
其他好文 时间：
2018-10-11 18:43:13
阅读次数：
128
<!--绝对定位： 当position的属性值设置为absolution时，则开启了元素的绝对定位 absolution的特性： 1.开启了绝对定位，会使元素脱离文档 2.但是开启绝对定位，如果不设置偏移量，则元素的位置不会发生变化 3.绝对定位是相对于离他最近的开启了定位的祖先元素进行定位的（一般 ...
分类：
其他好文 时间：
2018-10-11 10:25:30
阅读次数：
272
line-height 该方法适用于单行文字垂直居中 line-height + inline-block 将多个元素或多行元素当成一个行元素来看待，需要将这些数据多包一层，并将其设定为inline-block，并在该inline-block对象的外层对象使用inline-block来代替heigh ...
分类：
其他好文 时间：
2018-10-10 23:45:45
阅读次数：
238
div{ width: 100px; height: 100px; background: green; position: absolute; top: 50%; left: 50%; margin-left: -50px; margin-top: -50px;} 注释：DIV绝对定位，距顶和距左 ...
分类：
其他好文 时间：
2018-10-08 11:21:12
阅读次数：
147
注:本文章是参考千锋网学习视频总结得出。 最近在学习一个前端项目，项目中多处用到了浮动和定位。为此，通过看查找资料和看学习视频，从浮动、清除浮动、相对定位、绝对定位、总结等五个部分来谈谈我对浮动和定位的理解。 一、浮动 浮动的使用场景：一般是将竖起来的多个盒子进行横向的排列。 浮动的负面作用：因为浮 ...
分类：
其他好文 时间：
2018-10-07 12:10:25
阅读次数：
214
CSS3伸缩布局盒模型早期的布局主要依赖于表格，从CSS2.1中有关于布局的机制有所改变，但还是并不多。开发者通常不愿意使用绝对定位，因为太不灵活；浮动定位常用于页面的布局，但对于全页多列布局来说，它总是存在一些小毛病，功能上也有很多限制。CSS3中引入了许多的布局机制，使构建一个多列布局变得更加轻松，同时，CSS2.1规则是比较难实现的一些复杂布局表现，如今也变得更加容易。弹性盒模型：Flexb
分类：
Web程序 时间：
2018-10-06 14:31:46
阅读次数：
215
static: HTML元素的默认定位方式 absolute: 将对象从文档流中拖出，使用left，right，top，bottom等属性进行绝对定位。而其层叠通过z-index属性定义。绝对定位的元素的位置相对于最近的已定位父元素，如果元素没有已定位的父元素，那么它的位置相对于<html> rel ...
分类：
Web程序 时间：
2018-10-04 11:08:29
阅读次数：
186
1 import sys 2 from PyQt5.QtWidgets import QWidget,QLabel,QApplication 3 #demo_8: 绝对定位 4 5 class Example(QWidget): 6 def __init__(self): 7 super().__i... ...
分类：
其他好文 时间：
2018-09-30 18:19:37
阅读次数：
218
1. HTML代码： 其实结构非常简单，最外层放一个div盒子，里面放三个元素：一个label，一个input，一个i标签。使用for属性将label与input绑定，label用来显示字符串，i标签引入图标，input干好本职工作就行了——提供输入框。我这里是用的amazeUI框架的图标，所以用i ...
分类：
其他好文 时间：
2018-09-30 18:06:52
阅读次数：
302
生成绝对定位的元素，相对于 static 定位以外的第一个父元素进行定位。 元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。 生成绝对定位的元素，相对于浏览器窗口进行定位。 元素的位置通过 "left", "top", "right" 以及 "bo ...
分类：
Web程序 时间：
2018-09-28 14:39:09
阅读次数：
493
