0

嗨，我正在尝试设置页脚的样式。在一个块中，我需要左侧的文本和右侧的图像（用作文本的徽标名称）内嵌文本，后面还有更多文本。我已经成功地做到了这一点，除了在我的移动版本上，图像没有与文本内联。请参阅 .pull-left 和 .pull-right 的使用代码。

HTML

<p class="pull-left">© 2013 
<a href="contact">ENVY BEAUTY</a>
. All rights reserved.
</p>

<p class="pull-right">DESIGNED &amp; MAINTAINED BY 
<a href="http://smugstudios.com.au"><img align="middle" alt="" src="/sites/default/files    /SMUG.FOOTER.STAMP.png" style="width: 50px; height: 30px; float:right; padding-left: 5px; padding-right: 5px; padding-top: 0px; margin-top: 0px; " />
</a>
</p>

CSS

.pull-right { float: right; }

.pull-left { float: left; }
4

4 回答 4

0

尝试使用，

img{
    vertical-align: middle;
}

或添加到样式vertical-align: middle;

为您的页脚图像。

于 2013-09-11T06:56:43.890 回答
0

只需float: right从标签的内联样式中删除即可。img

工作小提琴

于 2013-09-11T07:07:53.863 回答
0 
<table>
<tr>
<td>© 2013 </td>
<td><a href="contact">ENVY BEAUTY</a></td>
<td>. All rights reserved.</td>
<td>DESIGNED &amp; MAINTAINED BY </td>
<td><a href="http://smugstudios.com.au"><img  alt="" src="/sites/default/files    /SMUG.FOOTER.STAMP.png" style="width: 50px; height: 30px; /></td>
</tr>
</table>
于 2013-09-11T06:59:12.080 回答
0

为两个元素设置宽度。我通常使用不超过 48%，但使用任何工作。

.pull-right {width: 48%; float: right; }

.pull-left {width: 48%; float: left; }

此外，现在最好尽可能避免使用内联样式。在你的你有一个 style 属性。我会在样式表中包含这些样式，类似于：

.pull-right a img {width: 50px; height: 30px; float:right; padding: 0 5px; margin-top: 0; }

我希望这对你有一些帮助

于 2013-09-11T07:01:23.923 回答