当前位置:K88软件开发文章中心编程全书微信小程序 → 文章内容

微信网页开发样式库

减小字体 增大字体 作者:佚名  来源:网上搜集  发布时间:2019-1-26 15:46:45

ading_leaf weui_loading_leaf_0"></div>           <div class="weui_loading_leaf weui_loading_leaf_1"></div>           <div class="weui_loading_leaf weui_loading_leaf_2"></div>           <div class="weui_loading_leaf weui_loading_leaf_3"></div>           <div class="weui_loading_leaf weui_loading_leaf_4"></div>           <div class="weui_loading_leaf weui_loading_leaf_5"></div>           <div class="weui_loading_leaf weui_loading_leaf_6"></div>           <div class="weui_loading_leaf weui_loading_leaf_7"></div>           <div class="weui_loading_leaf weui_loading_leaf_8"></div>           <div class="weui_loading_leaf weui_loading_leaf_9"></div>           <div class="weui_loading_leaf weui_loading_leaf_10"></div>           <div class="weui_loading_leaf weui_loading_leaf_11"></div>       </div>       <p class="weui_toast_content">数据加载中</p>   </div></div>Msg Page结果页通常来说可以认为进行一系列操作步骤后,作为流程结束的总结性页面。结果页的作用主要是告知用户操作处理结果以及必要的相关细节(可用于确认之前的操作是否有误)等信息;若该流程用于开启或关闭某些重要功能,可在结果页增加与该功能相关的描述性内容;除此之外,结果页也可以承载一些附加价值操作,例如提供抽奖、关注公众号等功能入口。<div class="weui_msg">   <div class="weui_icon_area"><i class="weui_icon_success weui_icon_msg"></i></div>   <div class="weui_text_area">       <h2 class="weui_msg_title">操作成功</h2>       <p class="weui_msg_desc">内容详情,可根据实际需要安排</p>   </div>   <div class="weui_opr_area">       <p class="weui_btn_area">           <a href="#" class="weui_btn weui_btn_primary">确定</a>           <a href="#" class="weui_btn weui_btn_default">取消</a>       </p>   </div>   <div class="weui_extra_area">       <a href="">查看详情</a>   </div></div>Article文字视图显示大段文字,这些文字通常是页面上的主体内容。Article 支持分段、多层标题、引用、内嵌图片、有/无序列表等富文本样式,并可响应用户的选择操作。在微信客户端 webview 中使用 Article,必须保证文字有足够的可读性和可辨识性、使用规范字体、保证足够的段间距、段首无缩进。<article class="weui_article">   <h1>大标题</h1>   <section>       <h2 class="title">章标题</h2>       <section>           <h3>1.1 节标题</h3>           <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod               tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,               quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo               consequat. Duis aute</p>       </section>       <section>           <h3>1.2 节标题</h3>           <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod               tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,               cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non               proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>       </section>   </section></article>ActionSheetActionSheet 用于显示包含一系列可交互的动作集合,包括说明、跳转等。由底部弹出,一般用于响应用户对页面的点击。<div id="actionSheet_wrap">   <div class="weui_mask_transition" id="mask"></div>   <div class="weui_actionsheet" id="weui_actionsheet">       <div class="weui_actionsheet_menu">           <div class="weui_actionsheet_cell">示例菜单</div>           <div class="weui_actionsheet_cell">示例菜单</div>           <div class="weui_actionsheet_cell">示例菜单</div>           <div class="weui_actionsheet_cell">示例菜单</div>       </div>       <div class="weui_actionsheet_action">           <div class="weui_actionsheet_cell" id="actionsheet_cancel">取消</div>       </div>   </div></div>Icon<i class="weui_icon_msg weui_icon_success"></i><i class="weui_icon_msg weui_icon_info"></i><i class="weui_icon_msg weui_icon_warn"></i><i class="weui_icon_msg weui_icon_waiting"></i><i class="weui_icon_safe weui_icon_safe_success"></i><i class="weui_icon_safe weui_icon_safe_warn"></i><div class="icon_sp_area">   <i class="weui_icon_success"></i>   <i class="weui_icon_success_circle"></i>   <i class="weui_icon_success_no_circle"></i>   <i class="weui_icon_info"></i>   <i class="weui_icon_waiting"></i>   <i class="weui_icon_waiting_circle"></i>   <i class="weui_icon_circle"></i>   <i class="weui_icon_warn"></i>   <i class="weui_icon_download"></i>   <i class="weui_icon_info_circle"></i>   <i class="weui_icon_cancel"></i></div>

上一页  [1] [2] 


微信网页开发样式库