如何实现上面的效果，请看下面的步骤 第一步：用 css 调整样式 ，这里小编用的是弹性盒子实现导航的平均分配。（聪明的你可以尝试用其他的方式看看能不能实现）css代码如下： <style type="text/css"> *{padding:0;margin:0;} a{text-decoratio ...
分类：
Web程序 时间：
2020-04-26 20:33:58
阅读次数：
70
CSS3 弹性盒子(Flex Box) 弹性盒子是 CSS3 的一种新的布局模式。 CSS3 弹性盒（ Flexible Box 或 flexbox），是一种当页面需要适应不同的屏幕大小以及设备类型时确保元素拥有恰当的行为的布局方式。 引入弹性盒布局模型的目的是提供一种更加有效的方式来对一个容器中的 ...
分类：
Web程序 时间：
2020-04-13 15:26:03
阅读次数：
83
View、Text、Image组件 View 1. 示例代码 2. view控件属性： class="" 样式类 Text 1. 示例代码 2. text控件属性： class="" 样式类 font size="" 字体大小 单位可以为px或者rpx，有关rpx后面会提到 font weight= ...
分类：
其他好文 时间：
2020-03-31 23:10:35
阅读次数：
137
1. : 父元素盒子空间有剩余的时候, 这个属性的设置就是将剩余空间的瓜分比例,默认为0即不参与瓜分,设置值越大瓜分权重越大,当然参与者越多,瓜分到手的空间就越少~ 有点分蛋糕的意思,人一多就不够分了啊~ 参考伪代码 2. : 与 是两个极端, 这个是当父元素盒子不够分给子元素的时候,也可能是子元素 ...
分类：
其他好文 时间：
2020-03-08 15:41:39
阅读次数：
72
由于要改版前几天做的HTML编辑器，编辑器页面重新设计了一下，整个界面全部用flex box实现： 可能有的朋友会有类似需求，就把纯静态html和CSS发布到github上了，在这个项目下面： https://github.com/vularsoft/studio-ui 里面的html-demo.h ...
分类：
其他好文 时间：
2020-03-03 21:01:43
阅读次数：
107
在HTML中，要实现区域内容的滚动，只需要设定好元素的宽度和高度，然后设置CSS属性overflow 为auto或者scroll： 在Flex box布局中，有时我们内容的宽度和高度是可变的，无法确定下来，这时候设置滚动条，可能会失效。只要记住几个关键要素，就可以解决这个问题。 1、清楚的知道当前元 ...
分类：
其他好文 时间：
2020-03-03 20:50:23
阅读次数：
138
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title> 弹性布局嵌套: 1，谨记：由外向内进行设置弹性盒子。先设置外部弹性布局，然后在设定里面的布局即可。 </title> </head> <style> /* 1 ...
分类：
其他好文 时间：
2020-03-01 14:31:27
阅读次数：
80
常见的移动端布局方法 flex布局，很重要！！ 其他的布局，你掌握也就ok了，但是这个布局，你一定要非常非常熟悉，因为我们后面的前段框架react 以及手机端混合app开发，微信小程序开发都是用的是这个布局。 我做了以一个仿 携程网的移动端首页，供你参考 flex布局原理 1. 这个是“弹性盒子”布 ...
分类：
移动开发 时间：
2020-02-25 20:25:16
阅读次数：
100
使用弹性盒子兼容低端适配有时需要： display:flex 和 display:-webkit-box display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit ...
分类：
Web程序 时间：
2020-02-12 12:55:03
阅读次数：
91
flex-grow 首先介绍flex-grow属性，flex-grow会在容器太大时对元素作出调整。 如果图片A的flex-grow属性的值为 1，图片B的flex-grow为 2，那么 2 的会比 1 的扩大两倍： 也许“扩大两倍”这个概念不便于理解，我们可以换一种说法。 首先要理解一个词“剩余空 ...
分类：
Web程序 时间：
2020-02-05 09:16:54
阅读次数：
142
