Question

我对CSS很新，所以我想确保我正确实现它。我需要在网页上加上解释性段落。我希望它看起来不同，所以我在外部CSS文件中包含以下内容：

div.usage { font-style: italic; margin-left... margin-right... ; }

然后在HTML文件中包含<div class="usage">Explanation</div>。这是按预期工作的。

我的理解是，在使用CSS时，内容和布局是分开的。那么，如何在我的解释中强调一些文字呢？我的理解是，我应该避免以下内容：<div class="usage">This is <u>very</u> important.</div>。

Answer 1

你是正确的分离内容和布局，但在这种情况下，我会将其包装在标签中。不过，<u/>标记已弃用。我会用的是这样的：

<div class="usage">This is <em>very</em> important.</div>

和

em { text-decoration:underline; }

<em/>代表强调文字。默认为斜体，因此根据CSS重置，您可能还需要将font-syle重置为正常。

顺便说一句，为文本加下划线通常是一个坏主意，因为大多数人认为带下划线的文本是链接。我会改为大胆，或者甚至给它一个背景颜色。

Answer 2

正如您所说，HTML代表内容，CSS代表样式。因此，您不必在HTML中使用样式内容。实际上，当您在HTML中思考时，您必须以语义方式思考内容。

因此，您对div.usage使用的类选择得非常好，因为它没有说明它的风格，而是关于它的语义。现在，您要强调的文字怎么样？我想以语义的方式说这是一个你想要突出显示的文本，HTML有一个很好的元素：<strong>。然后，在HTML中，您可以覆盖所需下划线的<strong>元素（粗体）的浏览器默认样式。

<div class="usage">This is <strong>very</strong> important.</div>

strong {
  font-weight: normal;
  text-decoration: underline;
}

如果您希望仅将此样式用于div.usage元素内的突出显示文本，则更具体：

.usage strong {
  font-weight: normal;
  text-decoration: underline;
}

当然，您不希望将div添加到选择器（我的意思是.usage优于div.usage）。通过这种方式，您就可以进行编码，例如，列表或具有usage语义的pragraph。

Answer 3

您应该使用其中一个代码：<strong>或<em>并在css中设置它们的样式。

.usage strong { font-weight: bold; }

在标记中，您可以定义一些要强调的内容（<em>）或强调（<strong>）。见http://www.w3.org/TR/html4/struct/text.html。我不会使用下划线来强调，因为这会让用户误以为它是一个超链接。

Answer 4

只是一些友好的建议，不要在网络上使用下划线是一个好主意，因为非常经常与可点击的链接混淆。

我建议使用

<strong>this is important</strong>

默认情况下显示为粗体。

或许你可以在文字上使用黄色背景，比如高亮标记......

<p>text <span class='highlight'>hightlighed</span> text</p>

并将其放入您的CSS

  span.highlight {
    background-color: #FF9;
  }

Answer 5

“text-decoration：underline”属性允许您为文本加下划线。

Answer 6

嗨，下划线你可以在这里举一个小例子

HTML

<div>
    <p>
        This is just a text to check <span>underline</span> with CSS
    </p>

</div>

CSS

div p { font-style: italic; }

div p span{ text-decoration: underline;}

Answer 7

如今，人们常说不应该使用<u>标记，但很少有人可以用事实论证来支持这一点（与引用声称的权威和使用负面听话形容词相反）。如果你真的想要下划线（这在HTML文档中通常不是一个好主意，正如这里所指出的那样），那么<u>是最简单和最健壮的方式。你仍然可以自由地决定你想要使用粗体而不是下划线，然后你可以简单地用CSS来做：

u { text-decoration: none; font-weight: bold; }

强调，其他方法几乎总是比下划线更好。但有些情况下，下划线是常规符号的一部分（例如，在语音或数学中），然后您可能想要使用<u>（并且您不希望依赖CSS）。

Answer 8

你可以试试这个：

<div class="usage">This is <span class="underline">very</span> important.</div>

的CSS：

.underline { text-decoration: underline; }

Answer 9

您可以在 span 中封装要加下划线的文本，并为 span 指定一个类

.underline {
  text-decoration:underline;
}

<div class="usage"> This is <span class='underline'>very</span> important.</div>

使用CSS时强调文本

9 个答案: