css - 使用跨度类是好习惯吗?

标签 css html

<分区>

在 DIV 中为 SPAN 标记提供不同的类是否明智/良好做法。例如,需要特定布局/位置颜色等的文本段落样式...?

或者有更好/更有效的方法吗?

最佳答案

如果您为段落本身赋予类,而不是用 span 包装段落的内容,您将拥有更少的 HTML,但完全有可能按照您所说的去做。你当然可以给多个段落同一个类:

HTML:

<div>
    <p class="paragraph">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
    <p class="paragraph">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
    <p class="paragraph">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
</div>

或者给 div 一个类并使用它选择段落。

HTML:

<div class="paragraphs">
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
</div>

CSS:

div.paragraph p { }

或者每个不同的类给你足够的灵 active

HTML:

<div>
    <p class="paragraph1">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
    <p class="paragraph2">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
    <p class="paragraph3">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
</div>

如果您只需要突出显示单个段落的不同部分,那么 span 是可以接受的,但不要忘记考虑现成的标签,例如 strongem

<p>Lorem ipsum dolor sit amet, <strong>consectetur</strong> adipiscing elit.</p>

关于css - 使用跨度类是好习惯吗?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12008440/

上一篇:css - 媒体屏幕是否适用于电视和投影仪?

下一篇:html - <li> - 转移到布局中的新行

相关文章:

html - 在 Bootstrap 4 中使行占据全高

html - 单击导航菜单时滚动页面视差(视差滚动)

jquery - 在索引匹配上运行函数停止 jQuery

html - 单击按钮时的 JSP + 动态 CSS

html - 纯 css slider - 为什么图像显示在 block 中?

javascript - 使用 Web 表单替换 Javascript 变量

html - 内联 block 顶部的 CSS Padding(?) 弄乱了我的 div 内容

css - Next-sibling 组合器不应该与复杂的选择器一起使用

javascript - 如何让我的功能在页面运行时运行?

html - 使文本字符串向左填充,然后向右填充