首先是弹性盒布局:dispaly:flex;和display:inline-flex;(两个元素会在一行显示,类似于块状元素和行内块元素的区别) 1.设置成弹性盒后,所有的元素都会在主轴上排列,默认x轴为主轴,与主轴垂直的为侧轴 2.如果父元素设置成了弹性盒,想让子元素在弹性盒上下左右居,子元素只需 ...
分类:
其他好文 时间:
2020-05-26 22:13:49
阅读次数:
102
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style> *{ margin:0;padding:0; } .container{ display: flex; hei ...
分类:
其他好文 时间:
2020-05-26 20:33:35
阅读次数:
64
flex 是个非常好用的属性,如果说有什么可以完全代替 float 和 position ,那么肯定是非它莫属了(虽然现在还有很多不支持 flex 的浏览器)。然而国内很多浏览器对 flex 的支持都不是很好,这里针对微信内置浏览器写了一套兼容写法。下面入正题。 首先还是从两个版本的语法开始讲吧,这 ...
分类:
微信 时间:
2020-05-26 20:29:29
阅读次数:
79
一、什么是弹性盒布局(可伸缩的盒子) 优势:1》写起来比较简单 2》灵活性、代码优雅 缺点:1》不兼容ie和安卓低级版本 新弹性盒(讲) 老弹性盒 二、使用 容器 (父元素) display:flex : 让容器成员是弹性的项目 flex-direction : 决定主轴是什么方向(项目排序方向) ...
分类:
其他好文 时间:
2020-05-26 20:08:26
阅读次数:
72
电商毕业设计里的一个购物车demo,效果图: .vue文件 <template> <div class="box"> <div class="flex-left tit"> <span v-for="(i,inx) in tit" :key="inx" class="flex-around">{{i ...
分类:
Web程序 时间:
2020-05-26 12:22:36
阅读次数:
564
微信小程序自定义组件详解 自定义组件能够帮我们更好的复用代码和重构简化代码复杂度。一起来学习一下小程序自定义组件的内容吧。 从小程序基础库版本 1.6.3 开始,小程序支持简洁的组件化编程。所有自定义组件相关特性都需要基础库版本 1.6.3 或更高。 开发者可以将页面内的功能模块抽象成自定义组件,以 ...
分类:
微信 时间:
2020-05-25 12:49:40
阅读次数:
83
注意:无论是什么布局,最外面都需要加个版心,这样不会导致整个布局超过可视区域,形成横向滚动条。 1.流式布局 (百分比布局) 宽度使用百分比,高度使用px 2.伸缩布局 (弹性布局) flex 2.1 作用:使得我们对块级元素的布局排列变得十分灵活,适应性非常强,其强大的伸缩性,在响应式开中可以发挥 ...
分类:
移动开发 时间:
2020-05-24 14:07:21
阅读次数:
108
1.element-ui中$message的实现你了解么,如果让你写一个自定义组件弹层你会怎么写? 2.$mount挂载的实现了解吗? 3.如何解决并发请求,比如有100个请求,每次最多允许10个请求,如何实现? 4.实现深层访问的方法 5.深层拷贝的实现 6.让你自己实现一个Promise.all ...
分类:
其他好文 时间:
2020-05-24 13:33:17
阅读次数:
103
学习css的flex属性使用方法前要先了解flex 有主轴和副轴的概念。 主轴默认就是x轴,副轴默认是y轴。但是主轴和父轴是可以设置的。 一、先了解 display:flex; 添加弹性盒子 和 flex-direction 设置x轴或y轴哪个是主轴的属性 <!DOCTYPE html> <html ...
分类:
Web程序 时间:
2020-05-24 11:40:52
阅读次数:
68
使用React简短代码动态生成栅格布局 作为 TerminalMACS 的一个子进程模块 React Web管理端,使用Ant Design Pro作为框架。 本文应用到的知识 1.样式文件less中方法的使用 2.for循环创建按钮和栅格布局(flex布局) 1. 最终效果及源码链接 作为前端新手 ...
分类:
其他好文 时间:
2020-05-24 09:15:45
阅读次数:
52