网站首页 > 知识剖析 正文
谈到小程序布局就不得不谈WXSS (WeiXin Style Sheets)!WXSS是微信小程序专用的样式语言。WXSS与css虽然在尺寸单位和样式导入不同,但是,具有CSS大部分特性。小程序的样式,由项目公共样式和页面样式共同作用。与Web开发不同的是,开发者不需要去优化样式文件的请求数量,只需要考虑代码的组织,样式文件最终会被编译优化。
小程序常见的五种布局方式:
表格布局 是最早出现的布局方式。table设计初衷,是为了呈现表格化数据。属于歪打正着的一种布局方式,兼容于所有的页面表现。
定位布局 根据参考元素的不同,设置当前元素的位置。常见的五种定位方式:静态定位(static,正常的文档流)、绝对定位(absolute,相对于已定位父元素)、相对定位(relative,相对其正常位置)、粘性定位(sticky,基于用户的滚动位置)、窗口定位(fixed ,基于可视窗口的固定位置)
浮动布局 出现在css2.0中,设置元素浮动后,元素将脱离普通流,可以控制元素在水平上左右移动,再通过margin属性调整位置。主要用于设置多个元素,共存于一行。
弹性盒子布局 是一种一维布局模型,大部分的属性作用于主轴。能够在子元素的大小未知或动态变化情况下,调节子元素的高度、宽度和排布的顺序,适应布局空间。
网格布局 是一个基于网格的二维布局系统,借鉴了平面装帧设计中的格线系统,将页面划分为一个个网格,定义这些网格的大小、位置、层次,组合做出各种各样的布局。可以看作是table布局的升级版,由Microsoft提出。
本文由尤佳coding原创,欢迎关注,带你一起长知识!
猜你喜欢
- 2025-04-06 浏览器打印方案(浏览器打印功能在哪)
- 2025-04-06 WPF基础之UI布局(wpf中用于布局的面板主要有)
- 2025-04-06 WinForm实现窗体自适应缩放(winform设置窗体大小不可调整)
- 04-29php开发者composer使用看这一篇就够了
- 04-29引用和变量声明在不同语言中的实作
- 04-29PHP 没你想的那么差
- 04-29Ubuntu linux 上的 Nginx 和 Php 安装
- 04-29CentOS下通过yum搭建lnmp(单版本PHP)
- 04-29为什么 PHP8 是个高性能版本
- 04-29PHP8函数包含文件-PHP8知识详解
- 04-29使用无参数函数进行命令执行
- 最近发表
- 标签列表
-
- xml (46)
- css animation (57)
- array_slice (60)
- htmlspecialchars (54)
- position: absolute (54)
- datediff函数 (47)
- array_pop (49)
- jsmap (52)
- toggleclass (43)
- console.time (63)
- .sql (41)
- ahref (40)
- js json.parse (59)
- html复选框 (60)
- css 透明 (44)
- css 颜色 (47)
- php replace (41)
- css nth-child (48)
- min-height (40)
- xml schema (44)
- css 最后一个元素 (46)
- location.origin (44)
- table border (49)
- html tr (40)
- video controls (49)