1

我正在制作一个标题带有不同颜色的单词和字体的网站。为此，我将每个单词放在不同的 div id 中以更改文本颜色。不知道有没有比这更好的方法……</p>

无论如何，标题的前半部分（彩色部分）低于标题的其余部分。它在 Firefox 和 Chrome 上以这种方式显示，但在 Internet Explorer 上看起来还不错。我不确定为什么会有差异，我尝试了不同的字体，有时会减轻问题，但从未完全消除它。当然，当我添加填充使其对齐时，它会在 Internet Explorer 上搞砸。

这是该页面的链接：http ://www.dinneronthespot.com/index2.html

4

5 回答 5

1

解决方案是，使用span

<span id="dotPerfect">
    <span id="color1">Dinner </span>
    <span id="color2">On The </span>
    <span id="color3">Spot </span>
</span >
<span id="dotPersonal">Personal Meal Service is perfect for...</span>
于 2013-09-30T06:15:40.477 回答
1

尝试这个：

#topText > h1 > div {
    display: inline;
}

在样式表中添加此代码

于 2013-09-30T06:15:43.350 回答
0

使用span而不是div用于此类操作。

<h1>
    <span id="color1">Dinner </span><span id="color2">On The </span><span id="color3">Spot </span>
</h1>
于 2013-09-30T06:16:22.697 回答
0

我已将每个单词放在不同的 div id 中以更改文本颜色。不知道有没有比这更好的方法……</p>

最好使用<span>-Tags

DIV-Tags 也有一个来自用户代理样式的默认属性“display:block”，这就是你必须设置“float:left”的原因（在这种情况下真的很难看）。

于 2013-09-30T06:17:20.880 回答
0

尝试这个

<div id="dotPerfect">
  <div id="color1">Dinner </div>
  <div id="color2">On The </div>
  <div id="color3">Spot </div>
  <div id="dotPersonal">Personal Meal Service is perfect for...</div>
</div>

将 id 为 dotPersonal 的 div 移动到 id为dotPerfect的 div 中。

于 2013-09-30T06:21:08.697 回答