nagenage123-优快云博客

原创仿微信 java IM即时通讯 | uni-app IM即时通讯 | vue IM即时通讯桌面端 | 源码出售

uniapp IM 即时通讯源码私有云服务、无第三方服务,方便二开可支持数十万并发连接、数据加密传输一套代码支持 Android, IOS, h5IM 即时通讯

2020-11-12 12:14:25 4356 2

原创 css 快速入门教程 - Grid 网格布局教程

css 快速入门教程 - Grid 网格布局教程学习 grid 时，需要先了解 grid 的一些重要术语。CSS Grid 网格布局 - 重要属性属性描述设置在网格容器上 display display grid 或者 inline-grid 声明元素为网格容器行和列 grid-template-columns 设置网格列 grid-template-rows 设置网格行网格排序 grid-aut

2021-06-28 16:51:49 221

原创 CSS Grid 网格布局 - auto-fit 关键字和 auto-fill 关键字的区别

CSS Grid 网格布局 - auto-fit 关键字和 auto-fill 关键字的区别auto-fit 和 auto-fill 都是模式填充，在网格容器宽度大于网格项的最小宽度总和时就会有区别。实例解析：css.css :.wrap{ display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); grid-template-rows: 60px; grid-auto-rows: 60px;

2021-06-25 14:25:49 1242

原创 css 快速入门之 flex 布局教程

css 快速入门之 flex 布局教程flex 简称弹性布局，是2009年W3C提出的 css3 新属性。弹性布局（flexible box）模块旨在提供一个更加有效的方式来布置，对齐和分布在容器之间的各项内容，即使它们的大小是未知或者动态变化的。弹性布局的主要思想是让容器有能力来改变项目的宽度和高度，以填满可用空间（主要是为了容纳所有类型的显示设备和屏幕尺寸）的能力。最重要的是弹性盒子布局与方向无关，相对于常规的布局（块是垂直和内联水平为基础），很显然，这些工作以及网页设计缺乏灵活性，无法支持大型

2021-06-24 15:20:10 249

原创 css grid 网格布局 - 网格区域对网格线的影响

网格区域的命名会影响网格线的命名。当给区域命名后，区域2条边会自动得到命名 “-start” 和 “-end”。这意味着一条网格线可能有多个名称。比如以下：.wrap{ display: grid; grid-template-areas:'header header header' 'sidebar main main' 'footer footer footer';}区域名称相同的，在使用时就像单元格合并，如以上的 main ，其上边行线和左边列线为 main-s

2021-06-21 13:34:22 382