use*_*888 8 image header jquery-mobile
我正在尝试在基于jQuery Mobile的网页的标题中添加图像.
我希望图像与右边缘对齐,并使用CSS实现此目的.但结果并不令人满意.
(问题*)图像和边缘之间存在较大间隙,并且也未与标题文本对齐.
这是标题代码:
<header data-role='header'><h1>My App<img src="my_logo.png" alt="Low resolution logo"class="align-right"/></h1></header>
Run Code Online (Sandbox Code Playgroud)
这是class align-right的CSS代码:
.align-right{
float:right;
margin-right: 5px;
}
Run Code Online (Sandbox Code Playgroud)
Gil*_*ong 26
无需添加自定义样式等.Jquery-Mobile已经为此提供了内置解决方案.只需将"ui-btn-left"或"ui-btn-right"类添加到图像中(就好像它是一个按钮),然后就可以了.
<header data-role="header">
<h1>My App</h1>
<img src="my_logo.png" class="ui-btn-right" />
</header>
Run Code Online (Sandbox Code Playgroud)
我知道这个问题之前已被问过,但我认为这可能会帮助那些仍在寻找解决方案的人.此外,这个问题没有得到回答.
像这样的东西应该有效:
<head>
<style>
body{ margin: 0; }
.align-right{ float:right; margin-right: 0px;}
</style>
</head>
<body>
<div data-role='header'><h1>My App<img src="my_logo.png" alt="Low resolution logo"class="align-right"/></h1></div>
</body>
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
36133 次 |
| 最近记录: |