css - 如何使用 css 为一个标签字段添加不同的样式？

Question

嗨，我有一个具有价值的标签，但我需要为该词添加不同的样式。

<label> 00001 M2 Available </label>

label{
font-size:15px;
}

字体大小 15px 应仅应用于 0001。任何人都可以帮助我解决如何使用 css 实现这一点。

score 4 · Accepted Answer

目前，唯一可行的方法是将第一个单词（或任何其他单词）包装在特定元素中并设置该元素的样式：

<label><span>0001</span> M2 Available</label>

label span {
    font-size: 15px;
}

您可以使用 CSS 设置::first-letter和::first-line伪元素的样式，但出于某种原因，W3C 没有选择或没有考虑允许使用::first-word伪元素。

从测试（在 Chromium 28/Win XP 中）看来，使用::first-line伪元素将设置第一个单词的样式（尽管我认为这不是指定的行为），因此它可能不是可靠的跨浏览器：

label {
    display: inline-block;
}

label::first-line {
    font-size: 2em;
}

参考：

score 2 · Accepted Answer

首先，大卫的解决方案是完美的，但是如果你不想添加任何额外的元素，那么你可以使用content: ""属性..如果你仍然不能使用这个，那么你需要使用 JavaScript

label.class_name:before {
    content: "00001";
    color: red;
}

score 0 · Accepted Answer

检查js小提琴

<label> <span style="font-size:15px">00001</span> M2 Available </label>

score 0 · Accepted Answer

给你的标签 span 一个 class <label><span class="labelItem"> 00001</span> M2 Available </label>。然后设置该类 .labelItem 的样式{ font-size: 15px; }

score 0 · Accepted Answer

0

HTML：

<label><p class="p01">00001</p> M2 Available</label>

CSS：

p.p01{
font-size:15px;
}

于 2013-09-25T08:45:34.563 回答

5 回答 5