1.cell(表格视图) 列表元素,用于将信息以列表的形式显示在页面中。其基本结构如下: 最外层盒子引用的weui-cell类,内层子元素引用的weui-cells类,weui-cell类的外层盒子包含weui-cells盒子和标题weui-cells__title,其页面显示效果如下: 图中可以看到weui-cells的展示形式是横向布局排列,同时weui-cells盒子中包含了头...
cell由thumbnailweui_cell_hd、bodyweui_cell_bd、accessoryweui_cell_ft三部分组成,cell采用自适应布局,在需要自适应的部分加上classweui_cell_primary即可: 带说明的列表项 带说明的列表项标题文字说明文字 Cell可根据需要进行各种自定义扩展,包括辅助说明、跳转、单选、复选等。下面以带图标、说明、跳转的列表项,其...
weui cell 学习笔记一 语意化的html css .container .page 单页 .slideIn 页面出现动画 animation .page,.slideIn{animation:a .2s forwards; }@-webkit-keyframe a{0%{ -webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0);opacity:0}to{-webkit-transform:translateZ(0);transform...
1 cell_globalweui-cells__title weui-cells weui-cell weui-cell_active 选中被激活 weui-cell__bd weui-cell_primary weui-cell__ft weui-cells__tips //file: src/style/widget/weui-cell/weui-cell_global.less @import "../../base/fn"; /* z-index: 0: .weui-swiped-btn 1: .weui-cell_sw...
接下来的内容是对WeUI中列举到的控件的一些理解,除了微信中的实例 也会提及这些控件的通用用法;主要包括Button、Cell 、 Toast 、 Dialog 、Progress 、 Msg 、 Article、 Actionsheet、Icons、 Panel、 Tab、 Searchbar。 Button 一般情况,我们认为按钮有三态Normal(正常)、Pressed/Highlighted(按下)、Disabled(不可用...
WeUI v2.3.0 解读 40 cell_access WeUI2.3.0 920 1 返回 1 access访问 -> ? 点击后访问其他页面 weui-cell_access weui-cell_link //file: src/style/widget/weui-cell/weui-access.less @import "../../base/fn"; .weui-cell_access { .setTapColor(); color: inherit; &:active { background...
在实际应用中,通常会结合.weui-cell类与其他辅助类共同作用,来构建出既美观又实用的列表视图。比如,可以使用.weui-cell_access来指示某个单元格后存在更多内容可供探索,或者利用.weui-cell_title、.weui-cell_value分别标记标题和值区域,以此增强信息的可读性。下面是一个简单的单元格布局示例:...
为帮助网页开发者实现与微信客户端一致的视觉体验,并降低设计和开发成本,微信团队推出了网页设计样式库:WeUI。该样式库目前包含 button (按钮)、cell (单元格)、toast (浮层提示)
接下来的内容是对WeUI中列举到的控件的一些理解,除了微信中的实例也会提及这些控件的通用用法;主要包括Button、Cell 、 Toast 、 Dialog 、Progress 、 Msg 、 Article、 Actionsheet、Icons、 Panel、 Tab、 Searchbar。 Button 一般情况,我们认为按钮有三态Normal(正常)、Pressed/Highlighted(按下)、Disabled(不可)。
WeUI 是一套同微信原生视觉体验一致的基础样式库,由微信官方设计团队为微信 Web 开发量身设计,可以令用户的使用感知更加统一。包含button、cell、dialog、 progress、 toast、article、actionsheet、icon等各式元素。 WeUI2.0.0新特性 【增强】 颜色规范、字体大小规范、间距规范对齐微信7.0新视觉风格 ...