当前位置:首页 > 技术分享 > 详情
sousuo
sousuo

21、面包屑导航的标准写法及类名命名规范

上传时间:2020-08-13            浏览次数:214

一、现象


面包屑导航前端架构自由度太高,容易让后台书写困难,所以我们要规范一些面包屑导航的书写标准。请大家使用规范的架构方式并用合适的类名。

二、解决办法

1、类名规范如下(一般不超出一下类名,需要超出的也要以“crumbs_”开头):

面包屑导航:crumbs

面包屑前的图片:crumbs_icon

面包屑分割线:crumbs_line

面包屑分割线上半部分:crumbs_line_top

面包屑分割线下半部分:crumbs_line_bottom

2、手机站参考代码:

<div class="crumbs">

<a  href="#"><span class="crumbs_icon"></span>返回首页</a>

<div class="crumbs_line"><span class="crumbs_line_top"></span><span class="crumbs_line_bottom"></span></div>

<a href="#">服务流程</a>

<div class="crumbs_line"><span class="crumbs_line_top"></span><span class="crumbs_line_bottom"></span></div>

详情

</div>

3、电脑端参考代码:

<div class="crumbs"><span class="crumbs_icon"></span>当前位置:<a href="#">首页</a> &gt; <a href="#">建站流程</a> &gt; 详情</div>

css样式不再详述。
永易搜建站用技术和实力说话
0371-56789390
公司地址

郑州市花园路东风路向西300路南弘熹台22层

联系我们