css中怎样设置多个span

在 HTML 中，<span> 元素是一个非常有用的标记。通常情况下，开发者需要将多个 <span> 标记样式化，这时我们就需要使用 CSS 来设置多个 <span> 元素的样式。

下面是一个实例，假设有 3 个文本元素需要样式化：

 <p>
        <span>Hello</span>,
        <span>world!</span> 
        and <span>universe!</span>
    </p> 

为了选择所有的 <span> 元素，我们可以使用 span 选择器：

 span {
        color: red;
        font-style: italic;
    } 

使用 span 选择器会将所有的 <span> 元素都选择出来，并同时应用上述样式。

但如果我们只想选择其中的两个 <span> 元素，而不是全部，我们可以为它们添加一个具体的 class 属性，例如：

 <p>
        <span class="hello">Hello</span>,
        <span>world!</span> 
        and <span class="universe">universe!</span>
    </p>

    span.hello {
        color: blue;
    }

    span.universe {
        color: green;
    } 

使用 .hello 或 .universe 选择器，我们分别只选择了拥有这些 class 属性的 <span> 元素，并分别为它们应用样式。

这就是在 CSS 中设置多个 <span> 元素的方法。