CSS在同一行中指定2种字体错误_Css

CSS在同一行中指定2种字体错误

css

CSS在同一行中指定2种字体错误,css,Css,我指定了两种不同颜色的字体。一种字体环绕一个名为的元素，它们环绕一个类。这些字体在firefox上完美地显示在一起，但在IE 9或更早版本中，浏览器显示它们的颜色相同，因为较早版本的浏览器不会重新识别名为的元素，如果我将其放在中。这会打破界限。如何使这两种字体在IE上具有不同的颜色我的CSS .b{float:left;background-color: #EEF2FB; width: 230px; font-size: 20px; font-family: Cordia

我指定了两种不同颜色的字体。一种字体环绕一个名为

的元素，它们环绕一个

类。这些字体在firefox上完美地显示在一起，但在IE 9或更早版本中，浏览器显示它们的颜色相同，因为较早版本的浏览器不会重新识别名为

的元素，如果我将其放在

中。这会打破界限。如何使这两种字体在IE上具有不同的颜色

我的CSS

.b{float:left;background-color: #EEF2FB; 
   width: 230px;
  font-size: 20px; 
  font-family: CordiaUPC;
  color: #72757A;}

d{font-size: 20px; 
  font-family: CordiaUPC;
  color: #010203;
  margin-left: 5px;}

我的HTML

  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  <link rel="stylesheet" href="float.css">

  <div class="b"> Hello<d>Distance</d> </div>


希腊立场

使用

标记来执行此操作，它将保持以内联方式显示内容。使用span的原因是，默认情况下，

被赋予一个

显示：内联

属性，而一些其他元素，例如

div

被浏览器默认赋予

显示：块

  <div class="b"> Hello<span>Distance</span></div>

不要使用根本不存在的

，而是使用

：

然后，您的CSS将是：

.b{
  float:left;
  background-color: #EEF2FB; 
  width: 230px;
  font-size: 20px; 
  font-family: CordiaUPC;
  color: #72757A;
}

#mySpan{
  font-size: 20px; 
  font-family: CordiaUPC;
  color: #010203;
  margin-left: 5px;
}

如前所述，您可以使用

代替

，或者如果愿意，您甚至可以使用

：

<div class="b"> Hello<b>Distance</b> </div>

b {
  font-size: 20px; 
  font-family: CordiaUPC;
  color: #010203;
  margin-left: 5px;
  font-weight: normal;
}

HelloDistance
b{
字体大小：20px；
字体系列：CordiaUPC；
颜色：#010203；
左边距：5px；
字体大小：正常；
}

谢谢evan的帮助

是粗体，为什么要更改其默认行为？！这绝对不是一个好主意……就像

，

是一个非常方便的样式内联钩子，就像

一样。它们被一些业内最优秀的人用作造型挂钩，因此了解它们是否适用于此非常有用。它们只是没有实际语义值的元素。它们只有默认的浏览器显示，可以通过CSS进行更改。否决答复是一个不幸的错误。使用

比使用

有什么好处？这只会让你的代码变得非常混乱，因为你会期望一些粗体的东西，然后它就不会了。没有什么特别的优势，除了它比较短。如果你需要几个这样的钩子，它就会派上用场。它使您不必在类中使用各种跨度，仅此而已。因为原来的问题有一个

，我想指出它可以简单地改为

，这会很有趣。没有理由认为这是令人困惑的。不过，我并不是想引起一场战争。我只是不想让人们读到这篇文章，认为在这篇文章中使用

是错误的，因为它不是。这只是一个值得了解的选项，我看不出有什么可读性较差。如果能在这里分享知识而不被盲目否决，那就太好了。

<div class="b"> Hello<span id="mySpan">Distance</span> </div>

.b{
  float:left;
  background-color: #EEF2FB; 
  width: 230px;
  font-size: 20px; 
  font-family: CordiaUPC;
  color: #72757A;
}

#mySpan{
  font-size: 20px; 
  font-family: CordiaUPC;
  color: #010203;
  margin-left: 5px;
}

<div class="b"> Hello<b>Distance</b> </div>

b {
  font-size: 20px; 
  font-family: CordiaUPC;
  color: #010203;
  margin-left: 5px;
  font-weight: normal;
}