另一個元素中的文本和元素的不同樣式

我試圖在Asp.Net MVC中設置WebGrid元素的尋呼機樣式。尋呼機看起來是這樣的：另一個元素中的文本和元素的不同樣式

<td colspan="4"> 
    <a href="#"><<</a>&nbsp; 
    <a href="#">1</a>&nbsp; 
    &nbsp;2&nbsp; 
    <a href="#">3</a>&nbsp; 
    <a href="#">>></a>&nbsp; 
</td>

雖然我可以很容易的樣式元素a，我有造型的「無標記」文本的問題（在這個例子中，2）。有沒有一種方法可以定位/選擇文本而不是錨元素？（提供JSFiddle）

來源

2014-04-22 Andrei V

像周圍添加''邊框和背景嗎？ –

@SalmanA，正好。舉一個基本的例子，我們假設我想像「a」元素那樣對它進行設置，但是使用不同的背景顏色（藍色）。 –

@AndreiV你的例子中的未加標籤的文本只是一個**文本節點**，據我所知，我們不能在CSS中設計一個**文本節點**而無需以文本節點的父節點爲樣式只有少數我們可以設計的東西，比如'color'，但'background'是不能通過父項應用於**特定**文本節點的）。 –

我不知道任何可以定位文本節點的CSS選擇器。您可以使用JavaScript或jQuery將活動鏈接包裝在標籤中;然後適當地設計它。這裏有一個例子：

$(".pagination").contents().filter(function() { 
    return this.nodeType === Node.TEXT_NODE && /\d+/.test(this.nodeValue); 
}).wrap("<b></b>");

Demo here

來源

2014-04-23 07:46:04

我其實並沒有想到一個「直接」的CSS選擇器。我懷疑可能有一個簡潔的方式來瞄準這個元素的一部分，但不知道是否要解決它。你的解決方案是完美的謝謝！ –

另一個元素中的文本和元素的不同樣式

回答

相關問題