<p id="something">My Text Here</p>
是否有可能使用某種僞選擇的CSS的樣式僅適用於從我的文字某些文本元素?
例如,我想:
「我的」 是顏色:紅; 和「文字」顏色:藍色;
<p id="something">My Text Here</p>
是否有可能使用某種僞選擇的CSS的樣式僅適用於從我的文字某些文本元素?
例如,我想:
「我的」 是顏色:紅; 和「文字」顏色:藍色;
不,這是不可能的。
有僞選擇,如:first-letter
和:first-line
,但你不能沒有包裝他們的元素,你可以單獨風格選擇invidual話:
<p id="something">
<span class="foo">My</span>
<span class="bar">Text</span>
<span class="baz">Here</span>
</p>
你會那麼能夠單獨他們的風格:
.foo {
color: #ff0000;
}
.bar {
color: #00ff00;
}
.baz {
color: #0000ff;
}
不可以。如果您希望文本的各個部分具有不同的顏色,您必須將它們包裹在單獨的元素中(最有可能是「s」)。例如:
<p id="something"><span class="red">My</span> <span class="blue">Text</span> Here</p>
當然,這也需要爲.red
和.blue
相應的CSS。
上述例外是僞選擇器:first-letter
和:first-line
,但這些不提供任何靈活性。
您可以使用首字母僞類造型首字母
p:first-letter
{
font-size:200%;
color:#8A2BE2;
}
但是你不能使用僞類作爲第二個「文本」,你必須將它包裝在一個html標記&風格它分開。
對於不同的樣式文字不可能。
其他用戶已經告訴你,它本身不可能。 如果你使用jQuery,因爲我從你的標籤假設,你可以做從JavaScript有點掛羊頭賣狗肉和「記號化」的P
標籤中的文字與:
$("p").html($.map($("p").text().split(" "),function (i,e) {return "<span id='w"+e+"'>"+i+"</span>";}).join(" "));
此命令在這種情況下,需要選擇(p
,但你可以使用p#myId
等)和替代的每一個字:
This is a sentence
成爲
<span id='w0'>This</span>
<span id='w1'>is</span>
<span id='w2'>a</span>
<span id='w3'>sentence</span>
因此,您可以使用如下的CSS:
p span.w2 {color: red;}
給第三個單詞上色。
感謝您的回覆,我知道如果我將文本元素放在類或ID上,我可以輕鬆完成,但在我的情況下,文本是從PHP函數返回的字符串。 我終於明白了,我將字符串分解,然後創建它,所以它會自動爲所有文本元素添加類,現在我可以輕鬆地設置它們的樣式。 –