flex布局开发 1. 布局原理 flex时flexible Box的缩写，意为“弹性布局”，用来为盒子模型提供最大的灵活性，任何一个容器都可以定位flex布局 【注意】 当我们为父盒子设为flex布局以后，子元素的float、clear和vertical align属性将失效 伸缩布局=弹性布局= ...
分类：
其他好文 时间：
2019-11-26 00:01:02
阅读次数：
82
CSS Grid 网格布局 一、概括 1.1功能 将网页划分成一个个网格，可以任意组合不同的网格，做出各种各样的布局。 1.2和flex的区别 Flex 布局是轴线布局，只能指定"项目"针对轴线的位置。Grid 布局则是将容器划分成"行"和"列"，产生单元格，然后指定"项目所在"的单元格。 二、基本 ...
分类：
Web程序 时间：
2019-11-25 11:54:37
阅读次数：
175
很长一段时间没有写静态页面布局，很多东西都开始模糊了，趁着最近做了一个小项目，把一些静态页面布局的知识简单梳理一下，加深自己的印象 一、流式布局——flex布局 1.流式布局的特征 （1）宽度自适应，高度固定，但是不是百分百还原设计图 （2）图标和字体的大小都是固定的，并不是所有的东西都是自适应的 ...
分类：
移动开发 时间：
2019-11-23 21:52:56
阅读次数：
73
1. flex布局，新版本 2. flex布局，老版本 3. 容器position为absolute ...
分类：
其他好文 时间：
2019-11-20 23:32:59
阅读次数：
81
注意，设为 Flex 布局以后，子元素的float、clear和vertical-align属性将失效。 1.指定flex布局： .box{ display: flex; }行内元素.box{display: inline-flex;} 2.容器的属性： flex-direction：该属性决定主轴 ...
分类：
其他好文 时间：
2019-11-19 13:43:37
阅读次数：
56
一、弹性布局 弹性布局，又称“Flex布局” 1、弹性布局的使用 给父容器添加display: flex/inline-flex;属性，即可使容器内容采用弹性布局显示，而不遵循常规文档流的显示方式 容器添加弹性布局后，仅仅是容器内容采用弹性布局，而容器自身在文档流中的定位方式依然遵循常规文档流； d ...
分类：
其他好文 时间：
2019-11-17 10:31:22
阅读次数：
101
flex布局绝对是我们平常在布局中用的最多的一个属性，我们来看看它在can i use中的浏览器支持度：（截止到2019/11/16） 挖藕，凹森！支持度居然这么好，好到连ie也能支持大部分的flex布局的属性，那接下来我们就看看它的三大招式吧。 基本概念 任何一个元素，无论块级元素还是行内元素，都 ...
分类：
其他好文 时间：
2019-11-16 21:44:25
阅读次数：
81
写一个靠谱的flex布局 <!DOCTYPE html> <html> <style> .block { padding-top: 30%; margin-top: 3%; border-radius: 10%; background-color: orange; width: 30%; } .co ...
分类：
其他好文 时间：
2019-11-16 14:27:21
阅读次数：
125
Grid布局，还是Flex布局？网格布局和Flex布局的差异？有人认为：Flexbox用于一维布局，一行或一列。网格用于二维布局，多行和多列。有的人认为：网格使用真实的列和行，内容会被一列一列、一行一行的排列。但是Flexbox没有，不仅是在二维里面，而且在一维里面也是如此。Flexbox并不适用于... ...
分类：
其他好文 时间：
2019-11-14 09:40:23
阅读次数：
77
弹性盒子flex： 对于客户端的布局非常有用，不管是平均分配space-around这个属性还是两端对齐space-betwee在页面布局的时候都会有很好的表现。 对于部分内容区域中，具有很多大致内容相同的几个区块的布局都可以使用到它，将父级设置为display:flex；父级就会变成容器，子级就会 ...
分类：
其他好文 时间：
2019-11-09 23:58:26
阅读次数：
190
