新闻详情内页和列表内页一些书写规则
新闻详情页/介绍详情页类型:
文本容器父级需设置字体大小 特别是在移动端上。 不允许出现 没有设置字体大小问题
图片需设置属性max-width:100%;display:block;margin:0 auto;
标签内不能出现类控制样式. 只能使用 直接后代选择器来控制使用
示例:
<style> .centent{font-size:16px;}//必填 特别是在移动端上 不设置text-align:center; .centent img{max-width:100%;display:block;margin:0 auto;}//必填 .centent p{font-size:16px;....}//使用 .centent .size{font-size:16px;....}//禁用 </style> <div class='centent'> <p>这是一个示例</p><!--使用--> <p class="size">这是一个示例</p><!--禁用--> </div>
新闻列表页类型:(模板类型 会接入系统
如果为模板类型。搭好模板后。切换其他tab页效果无需编写。选中效果需设置,以方便开发识别。移动端上无需加载swiper库做滑屏切换tab
新闻列表页类型:(静态类型 手动维护
如果是静态新闻数据.则需要编写完整功能。并填入所有静态数据。tap切换需编写完成。移动端正常加载swiper库做tap页切换
普遍新闻列表页会都出现
示例【新闻】 这是一个新闻跳转入口
【】号内为另一链接 需分离开。
<div class='centent'> 【<a href='123.html'>新闻</a>】<a href='123.html'>是一个新闻跳转入</a><!--建议写法 这只是个示例括号内为另一链接。请忽略标签嵌套问题。--> </div>
每个项目详情页和列表页。样式独立出一个css文件做模板类样式表。便于后期更新维护时无须调整线上模板页。做到维护处 如果需要引用多个公用CSS时。建议在起类名时 在类名前添加一个标识号。以便于不会被其他样式表影响
新闻列表页新闻详情页返回按钮常遇到的问题:
因新闻列表页和详情页有时候设计稿上会出现一个返回按钮的情况。该按钮有时候只会显示为返回。偶尔会出现一些明确的。返回首页等。
当遇到只是返回时。 需和产品确认是否为返回上一级。还是返回某一页。。建议直接确定返回某一个页面。而非回退。否则会在某些时候只打开详情或列表页时 返回按钮会失效或出错问题
详情页列表页内的a标签所有都需要修改成全局样式 不能使用a标签默认样式.页面内hover效果需增加
2017-12-1 0:03暂完。待补充修改。金木
转载请注明:文档库 » 新闻详情内页和列表内页一些常遇问题