如何在离子的标题栏添加徽标 [英] how to add a logo to header -bar in ionic
本文介绍了如何在离子的标题栏添加徽标的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我正在尝试使用 Ionic 在我的标题栏的中央添加一个徽标.关于如何做的任何建议?
这是我的代码
<!--徽标--><离子导航按钮><img class="title" src="https://s3-us-west 2.amazonaws.com/s.cdpn.io/139144/sp_symbol_option2_1.png"></ion-nav-buttons><ion-nav-buttons side="left"><!--左侧图标--><button class="button button-icon button-clear ion-navicon" ng-click="toggleLeft()"></button></ion-nav-bar>
解决方案
如何做这样的事情:
<div class="buttons"><button class="button" ng-click="doSomething()">左按钮</button>
<h1 class="title"><img class="title-image" src="http://www.ionicframework.com/img/ionic-logo-white.svg" width="123" height="43"/></h1><div class="buttons"><button class="button">Right Button</button>
</ion-header-bar>
您也可以看看这个 plunker.
他们的论坛中的一些额外信息.
I am trying to add a logo in the center of my header bar using Ionic. Any advise on how to do it?
Here is my code
<ion-nav-bar class="bar-light">
<!--Logo-->
<ion-nav-buttons >
<img class="title" src="https://s3-us-west 2.amazonaws.com/s.cdpn.io/139144/sp_symbol_option2_1.png">
</ion-nav-buttons>
<ion-nav-buttons side="left">
<!--Left icons-->
<button class="button button-icon button-clear ion-navicon" ng-click="toggleLeft()">
</button></ion-nav-bar>
解决方案
How about doing something like this:
<ion-header-bar align-title="center" class="bar-positive">
<div class="buttons">
<button class="button" ng-click="doSomething()">Left Button</button>
</div>
<h1 class="title"><img class="title-image" src="http://www.ionicframework.com/img/ionic-logo-white.svg" width="123" height="43" /></h1>
<div class="buttons">
<button class="button">Right Button</button>
</div>
</ion-header-bar>
You can have a look at this plunker as well.
Some extra info in their forum.
这篇关于如何在离子的标题栏添加徽标的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文