Question

以下是网站：www.red-tuxedo.com

我希望“Red Tuxedo”文本位于徽标旁边，而不是下面，我希望摆脱贯穿徽标的那条硬规则。我的CSS / HTML技能不符合它。当我更改文本时，我完全破坏了列布局，但在代码中找不到硬规则。尝试调整gif（在Photoshop中剪掉底部），这没有帮助。

我写信给创建模板的人;几天后没有收到回复。我想在开始添加更多页面之前解决此问题。

THX

Answer 1

一种方法是在#logo div中移动徽标：

<div id="header-logo">          
    <div id="logo"><img height="60" width="60" alt="Red Tuxedo Logo" src="logo_red_tuxedo.gif" id="logo_red_tuxedo"/><span class="red">Red</span>Tuxedo</div>               
    <form action="#" class="search" method="post">
        <p><input type="text" class="textbox" name="search_query"/>
        <input type="submit" value="Search" class="searchbutton" name="search"/></p>
    </form> 
</div>

Answer 2

尝试更改div（id =徽标），使其包含徽标图像和文本，并将align='absmiddle'添加到图像中。我建议使用CSS，但无论如何它看起来都有固定的属性。 “规则”看起来像来自身体元素的背景图像。我想你需要更新文件bg.gif来修改它。

<div id="logo">
    <img id="logo_red_tuxedo" src="logo_red_tuxedo.gif"
         alt="Red Tuxedo Logo" align="absmiddle" height="60" width="60">
    <span class="red">Red</span>Tuxedo
</div>

Answer 3

要移动文本，我会将图像放在logo div中，就像dmondark建议的那样。至于硬规则，它是身体背景图像的一部分bg.gif。 Here's我制作的编辑版本没有它。

移动徽标旁边的文字;摆脱一个硬性规则

3 个答案: