Css 以下标记应该是锚内嵌套跨度的什么?

Css 以下标记应该是锚内嵌套跨度的什么?,css,html,Css,Html,我正在努力学习html和标记的基础知识 我想创建一个包含两行信息的锚 第一行:链接的名称 第二行:简短的解释 e、 g 这是正确的吗 如有必要,应如何修改以下(第二跨度) 多谢各位 注:两行都需要用span包围,以便进行css样式设置。为了使它们位于单独的行中,请尝试使用标记。您仍然可以为样式指定一个类,唯一的区别是s是块元素;它们中的每一个都在单独的行上渲染。以下是代码的修改版本: <a href='#'> Studies <div class="alt">-Inf

我正在努力学习html和标记的基础知识

我想创建一个包含两行信息的锚

第一行:链接的名称 第二行:简短的解释

e、 g


这是正确的吗

如有必要,应如何修改以下(第二跨度)

多谢各位


注:两行都需要用span包围,以便进行css样式设置。

为了使它们位于单独的行中,请尝试使用
标记。您仍然可以为样式指定一个类,唯一的区别是
s是块元素;它们中的每一个都在单独的行上渲染。以下是代码的修改版本:

<a href='#'>
Studies
<div class="alt">-Information about studies</div>
</a>
(请注意,
class=“alt block”
表示元素既有类
alt
又有类
block
,还请注意,第一个
已被删除,因为不需要使用任何东西设置该节点的样式)

CSS:


希望这对你有帮助

首先,不要排除使用
br
标记。这是
br
标记在语义上合适的位置(强制在文本的一行或一段中使用硬分隔符)。另外,如果您使用
br
标记,则可能不再需要将两行文本中的任何一行放在单独的标记中,除非您希望将它们设置为不同的样式

<a href='#'>
    Studies<br/>
    -Information about studies
</a>
这里有一些个人偏好的空间。这只是两种方法

在这种情况下,使用
small
标记可能有点牵强,但这并非完全不合适。
小的
标签通常用于“精细打印”、属性、免责声明或旁注。从语义上讲,这并不意味着文本很小,但它确实倾向于用于次要的内容(澄清其他内容)。但它应该只用于长度较短的文本


而且
strong
标记不必设置为粗体。事实上,这就是语义标记的全部要点:它没有指定或暗示内容的样式;它所做的只是对内容的含义或上下文提供提示。
strong
标记可以合理地被赋予
font-weight:normal

的样式。我不知道这是如何针对HTML5的。@j08691与其抱怨错误,不如试着解释为什么这不是针对提问者的HTML5,显然,他在网页设计和HTML方面不是很有经验。更正确的语法是没有第一个span-你可以使用
a
样式在
span
中设置文本的样式,并将第二个
span
样式设置在第二行,看起来有点像doferent@Abody97-我的评论究竟是如何向您投诉的?我还发现一个拥有300名代表的人告诉我如何使用这个网站很奇怪;这是每个人的抱怨。你真烂。我们相信,这里的问题属于我们所有人。这是相对于html5的,因为我问的是标签。html5有很多新功能。要不然我为什么要把这个问题贴上html5的标签呢?@Tamlyn所以基本上你是说应该使用
并用
display:block而不是仅仅使用
?我可能在这里遗漏了一些东西,但有什么意义呢?@Abody97,在我看来这是一个重要的观点,因为你需要理解html是用于标记的,而不是用于样式的。所以选择一个
div
是个坏主意,因为你需要它看起来像块一样对不起,我投了反对票。我不同意您提供的三种变体中的任何一种。@skip405本着协作构建和改进问答网站的良好精神,我应该感谢您的否决票:)无论如何,在某种程度上:P@Abody97您不应该仅将链接拆分为两行。尝试编写HTML,重点关注内容。然后添加CSS作为外观,添加JS作为交互。
<a href='#'>
Studies
<span class = "alt block">-Information about studies</span>
</a>
.block {
    display: block;
}
<a href='#'>
    Studies<br/>
    -Information about studies
</a>
<a href='#'>
    <strong>Studies</strong><br/>
    -Information about studies
</a>

<a href='#'>
    Studies<br/>
    <small>-Information about studies</small>
</a>