在BFC布局规则中提到内部Box垂直方向距离由margin决定，属于同一个BFC的两个相邻Box的margin会发生重叠。 总结出margin重叠三个条件 1、属于同一个BFC 2、相邻的Box 3、块级元素 常见margin重叠的两种方式： <!DOCTYPE html> <html> <head ...
分类：
其他好文 时间：
2020-07-28 00:01:01
阅读次数：
82
btn.semanticContentAttribute = .forceRightToLeft 查了下资料 semanticContentAttribute 是反转 ，即描述视图的内容,用来确定视图之间切换时应翻转从左到右和从右到左的布局 最低支持到9.0 参考链接：https://www.jia ...
分类：
编程语言 时间：
2020-07-27 13:58:20
阅读次数：
110
一、理解BFC 1.BFC(Box Formatting Context) Box是css布局的对象和基本单位，直观讲就是一个页面多个Box组成。 元素的类型和display属性决定了这个Box的类型；不同类型的Box，参与不同的Formatting Context（一个决定如何渲染文档的容器），因 ...
分类：
其他好文 时间：
2020-07-26 19:36:32
阅读次数：
70
BFC布局规则2：BFC不会与float box重叠 当overflow不为visible时会生成BFC 布局结构： <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>两列布局</title> <style> *{ margin: ...
分类：
其他好文 时间：
2020-07-26 19:31:33
阅读次数：
69
一、什么是stickyFooter？ 1.经典的粘连“footer”布局； 2.有一块内容<main>； 3.当<main>的高度足够长的时候，<footer>应该紧跟在<main>元素后面； 4.当<main>元素比较短的时候，（小于屏幕的高度），我们期望这个<footer>元素能够“粘连”在屏幕 ...
分类：
其他好文 时间：
2020-07-26 19:19:28
阅读次数：
83
CSS3动画 CSS3优点 浏览器可以对CSS3动画进行优化 浏览器使用与requestAnimationFrame 类似的机制，requestAnimationFrame 比起js中使用setTimeout、setInterval 优势在于requestAnimationFrame 会把每一帧中的 ...
分类：
Web程序 时间：
2020-07-26 01:23:42
阅读次数：
81
/* http://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 License: none (public domain) */ html, body, div, span, applet, object, iframe, h1, h2, h ...
分类：
Web程序 时间：
2020-07-26 00:16:30
阅读次数：
118
（一）三表 用途 list列表 整齐布局 ul先到先得，ol有序排列，还有个自定义【dl>dt>dd】 table列表 展示数据结构 【caption table>th/tr>td（thead标题 tbody数据 tfoot脚注）】 【border/cellspacing/cellpadding表格 ...
分类：
Web程序 时间：
2020-07-25 09:40:55
阅读次数：
110
1.圣杯布局 整体思路： 中间列放在最前优先加载，并设置宽度100%自适应； 三列都向左浮动 (此时左右列在下面一行，因为中间列占100%)； 左列设置margin-left：-100%，右列设置margin-left:-宽度，使左右列与中间列同行 (此时左右列会遮挡中间列内容)； 给最外部cont ...
分类：
其他好文 时间：
2020-07-24 23:45:22
阅读次数：
84
瀑布流布局其核心是基于一个网格的布局，而且每行包含的项目列表高度是随机的（随着自己内容动态变化高度），同时每个项目列表呈堆栈形式排列，最为关键的是，堆栈之间彼此之间没有多余的间距差存大。 代码比较简单： <!DOCTYPE html> <html lang="en"> <head> <meta ch ...
分类：
Web程序 时间：
2020-07-24 21:34:08
阅读次数：
87
