如何在标题栏(header)添加一个上面是iconfont图标下面附带文字的布局?

分类：HBuilderX

headers iconfont icon HBuilder

已引入iconfont的相关文件能够正常显示图标.

参考了: https://ask.dcloud.net.cn/article/128 的底部导航栏可以做到上下的结构.
但是在<header>标签里面的标题中不懂怎么设置class.

类似的效果见附件截图

现有的导航栏代码:

<header class="mui-bar mui-bar-nav" style="box-shadow: 0px 0px 0px">  
    <i id="confBtn" class="mui-icon iconfont iconicon-test mui-pull-left"></i>  
    <h1 id="title" class="mui-title">标题</h1>  
    <i id="todoBtn" class="mui-icon iconfont icondaibanshixiang mui-pull-right" ></i>  
</header>

如果按参考那样使用 a标签 + span标签是横向不太好看 , 改用 a标签 + div标签文字会超出标题栏

2020-08-12 15:18 负责人:无分享

2 个回复

5***@qq.com - 95It

导航栏代码贴出来

这下真的舒服了 (作者)

<header class="mui-bar mui-bar-nav" style="box-shadow: 0px 0px 0px">

<i id="confBtn" class="mui-icon iconfont iconicon-test mui-pull-left"></i>

<h1 id="title" class="mui-title">标题</h1>

<i id="todoBtn" class="mui-icon iconfont icondaibanshixiang mui-pull-right" ></i>

</header>

2020-08-12 16:34
5***@qq.com

回复这下真的舒服了: 你试试这样

2020-08-13 11:16

5***@qq.com - 95It

<header class="mui-bar mui-bar-nav" style="box-shadow: 0px 0px 0px">  

    <div>  
        <i id="confBtn" class="mui-icon iconfont iconicon-test mui-pull-left"></i>  
        <div>测试</div>  
    </div>  

    <h1 id="title" class="mui-title">标题</h1>  

    <i id="todoBtn" class="mui-icon iconfont icondaibanshixiang mui-pull-right" ></i>  

</header>

该问题目前已经被锁定, 无法添加新回复

如何在标题栏(header)添加一个上面是iconfont图标下面附带文字的布局?

2 个回复

公告

相关问题

如何在标题栏(header)添加一个 上面是iconfont图标下面附带文字的 布局?

与内容相关的链接

2 个回复

公告

相关问题

如何在标题栏(header)添加一个上面是iconfont图标下面附带文字的布局?