版式
- 标题
- H1 到 H6 标题标签进行的优化。这里将不针对标签而是标题类 .H1 到 .H6。小程序仅识别 VIEW 标签。
- 重设上下边界为固定值,默认为一个行高距离,优化后统一为上 20 像素、下为 10 像素,h4 到 h6 距离顶部为 10 像素且不分标题级别,全部统一样式
- 固定所有标题行高为 1.1,避免行高因标题字体大小而变化,同时也避免不同级别标题行高不一致,影响版式风格统一
- 固定不同级别标题字体大小,依次为 36px 30px 24px 18px 14px 12px。这里将像素单位改成 rpx 以兼容小程序
- 标题里面 small 类取消了字体粗体样式(font-weight:noraml)字体颜色为浅灰色 #999999 行高为 line-height:1。修改一级二级三级风格大小为 65%,四级五级六级风格大小为 75%
- 文本
- wxml 页面代码通通常推荐有一个顶层 类似于 body 标签。为顶层标签添加类样式 page 应用预定义的默认样式
- .page 类定义页面字体默认样式 font-size 为 14px ,line-height 为 1.428, color 为 #333333 background-color 为 #ffffff
- .p 类定义为 1/2 行高(10px (14 * 1.428 正好是 20 px))的底部外边距属性
- 对齐
- 文本水平对其方式有三种 分别是 左对其(text-left)中对齐(text-center)右对齐(text-right)
时间: 2024-10-13 05:41:30