我正在使用 ionic 框架开发应用程序。我需要在侧面菜单标题中显示图像。我使用item-avatar 来显示图像。这是代码。
<ion-side-menus>
<ion-side-menu side="left">
<ion-header-bar class="bar-calm style="height:200px" >
<div class="list" >
<a class="item item-avatar">
<img src="some image source">
<p>This is an image</p>
</a>
</div>
</ion-header-bar>
</ion-side-menu>
<ion-side-menu-content>
<ion-list >
<!-- Links to the pages that must contain the side menu. -->
<ion-item href="#/side-menu24/page1">Page1</ion-item>
<ion-item href="#/side-menu24/page2"> Page2</ion-item>
</ion-list>
</ion-side-menu-content>
如何更改(增加)元素头像中显示的图像的大小?我被建议使用以下 CSS:
.list .item-avatar{
width: 20px !important;
height : 60px !important;}
这会增加整个元素头像的内容大小(分配给 div 标签的大小),但图像大小保持不变。有什么方法可以增加元素头像内显示的图像的大小吗?
最佳答案
元素头像具有默认的最大宽度和最大高度属性。您可以在 ionic.css 文件中找到它。 您可以在那里更改它,也可以在您的 CSS 中添加:
.item-avatar {
width:100% !important;
height : 100% !important;
max-width: 100px !important; //any size
max-height: 100px !important; //any size
}
关于html - 如何更改 ionic 中元素头像的大小?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35623577/