如果不对span应用样式，那么span元素中的文本与其他文本不会任何视觉上的差异。尽管如此，上例中的span元素仍然为p元素增加了额外的结构。
可以为span应用id或class属性，这样既可以增加适当的语义，又便于对span应用样式。
可以对同一个<span>元素应用 class 或 id 属性，但是更常见的情况是只应用其中一种。这两者的主要差异是，class 用于元素组（类似的元素，或者可以理解为某一类元素），而 id 用于标识单独的唯一的元素。
提示：事实上，您也许已经注意到了，比如“提示”使用了粗体的橘红色。尽管实现这种效果的方法非常多，但是我们的做法是：使用“提示”使用span元素，然后对这个span元素的父元素，即p元素应用class，这样就可以对这个类的子元素span应用相应的样式了。
HTML:
1 |
|
CSS:
1 2 3 4 |
|
效果图很简单：
【小编推荐】
html p标签是单标签吗？html p标签的使用方法介绍（内附实例）
html select下拉框样式怎么制作？html select样式详解
以上就是HTML span标签如何做到自动换行？HTML span标签的用法介绍的详细内容，更多文章请关注木庄网络博客！
相关阅读 >>
html h1标签是双标签吗？如何设置html h1标签的位置？
html中的图片如何自适应屏幕？这篇文章有图片的自适应用法介绍
html中的段落文本如何换行？一篇文章告诉你换行标签br的用法
更多相关阅读请进入《span》频道 >>
Vue.js 设计与实现 基于Vue.js 3 深入解析Vue.js 设计细节
本书对 Vue.js 3 技术细节的分析非常可靠，对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪，Vue.js作者
