一 大致规范:

1 统一前缀

统一前缀【read】+模块对应的公共字段【article/content……】
页面需修改特定定义的样式规范,在原有元素命名后添加【-channel】等页面特定元素,如频道页面头部有特定样式重置的,class类定义示例:

  1. <div class="mui-header read-header read-header-channel"></div> //仅作为示例,非标准用法

2 模块对应的公共字段

模块 常设公共字段
首页 index
男频/女频 channel
分类 classify
排行/榜单 chart
分类列表 list
书籍详情 details
目录 chapter
最终阅读页 article
用户中心 article
搜索 search

二 UI公共类:

头部:

  1. .read-header

底部:

  1. .read-footer

主体内容容器:

  1. .read-content

标题:

  1. .read-title
  2. .read-h1
  3. ……
  4. .read-h6

搜索:

  1. .read-search

列表及元素:

  1. .read-list
  2. .read-list-item

轮播及元素:

  1. .read-slider
  2. .read-slider-item

按钮:

  1. .read-btn