html中带有类的标签[关闭]

Question

我有一个 CSS 类，我经常将其添加到内联 HTML 元素中以更改显示。

在 CSS 中：

  .mymath{ font-family:...; color:...;...}

在 HTML 中：

normal text <span class="mymath"> math text </span> normal text

我可以使用比<span class="mymath"> 更短的东西吗？

CSS/javascript 有什么帮助吗？

如果解决方案涉及 HTML5，请注明

提前致谢。

Answer 1

由于 HTML5 中的 B 标记在语义上没有意义（查找它），我不介意“滥用”它来对现有内容进行屏幕纯呈现格式：

  <style>
    b{ font-weight: normal; font-family:...; color:...;...}
  </style>


  normal text <b> math text </b> normal text

这减少了您的开销

  "<span class="mymath"></span>" 

到

  "<b></b>"

这有点短。

从技术上讲，您甚至可以制作自己的标签，只要将它们修补到您的 IE 的 HTML5 shim 中，CSS 仍然会“占用”标签。当 javascript 动态标记现有文档时，这很好。除非您希望验证暴民用干草叉围绕您的房子，否则不要发布这样的恶意！

Answer 2

可以使用后代或子选择器来指定您想要的样式，这将减少您需要在元素上指定的类的数量。例如：

<style>
  #test > p > span {
     font-weight: bold;
  }
  #test span {
     color: red;
  }
</style>

<div id="test">
 <p>my content <span>different</span> more content</p>
 <div>
   <p>my content <span>different</span> more content</p>
 </div>
</div>

这将使所有 span 文本颜色为红色，但只有第一个 span 为粗体（那里未经测试的代码，但您应该明白这一点）。

Here's a link 到一组不错的 CSS 选择器教程，您可能会觉得有帮助。

但是，这确实不是一个好主意。这意味着您的风格与文档的结构密切相关，因此非常脆弱。向您的元素添加更多类可以让您获得更细粒度的控制，并且不会那么脆弱 - 即使文档结构发生变化，样式也将保持一致。

Answer 3

如果您想为您的 html 应用更全局的样式，您可以改为定位元素。 您还可以使用较短的版本来设置字体大小、行高和系列。 http://www.w3schools.com/cssref/pr_font_font.asp

例子：

body {
  font: normal 12px/14px Arial, Verdana;
}

请注意，没有 .身前。这将针对您的 html 中的标签。如果您愿意，您也可以在例如 span 标签上执行此操作。

Answer 4

不，你不能真正使用更短的东西。这是最简洁的。当然你可以缩短你的班级名称。这样会更短:-)

Answer 5

是的，创建一个 .css 文件会有所帮助。您不需要将 CSS 内联。您只需在每个 html 页面中添加对 CSS 文件的引用即可。