是否可以創建內聯僞類型？

例如，我可以做類似以下的事情嗎？

<a href="#" style="background-color:green;{hover:background-color:red;}">Coding Horror</a>

這背後的原因是我正在開發一個.NET庫創建UI元素。我想生成HTML元素，可以在不使用外部樣式表的情況下設置懸停狀態。

來源

2009-06-12 Peter Bridger

@robbotic：假設他有一個函數foo（串U，顏色1串，串COLOR2）的輸出Coding Horror 使用嵌入式hover樣式比較簡單。這是一個好主意嗎？我寧願只有這樣一種風格的功能......但是這會迫使使用我的班級的人們自己使用css，這使得短期內部署稍微多一些工作。 – Brian 2009-06-12 13:38:53

@Brian我儘可能避免內聯樣式。我知道他們建立的速度更快，但如果您需要在其他地方複製相同的樣式，我認爲您會失敗。我寧願有一個大的CSS文件（或多個CSS文件）與我的網站上的所有樣式。通過這種方式，我可以輕鬆訪問任何我想要的內容，並且可以對整個網站進行一次更改並實現所有我想要的內容。 – 2009-06-12 13:42:08

這到底是什麼目的？聯線式樣是一種有害的分離問題。把它留給CSS。 – annakata 2009-06-12 13:45:39

不幸的是，你不能使用內聯CSS實現懸停效果。

解決此問題的一個（差）解決方法是讓您的控件在呈現時呈現樣式塊。例如，你的控制可能呈現爲：

<style type="text/css"> 
    .custom-class { background-color:green; } 
    .custom-class:hover { background-color:Red; } 
</style> 
<a href="#" class="custom-class">Coding Horror</a>

如果你可以強制用戶在自己的網頁上，掉了「的風格控制」，你可以使您的所有自定義類了，而不是下一個使它們每個控制，這將是一件非常非常糟糕的事情（瀏覽器每次遇到樣式塊時都會重新開始渲染，散佈在頁面周圍的很多樣式塊會導致渲染速度緩慢）。

不幸的是，這個問題沒有優雅的解決方案。

來源

2009-06-12 13:38:06

-1

或者您可以使用jQuery的hover函數並設置背景顏色。

來源

2009-06-12 13:39:14 David

這是一種Catch-22情況。

一方面，您可以在您的元素插入頁面之前添加一個樣式塊，但是Chris Pebble指出了這個問題。（如果你決定這一點，一定要爲你的元素選擇唯一的ID，這樣你的選擇器不會意外地選擇或設計其他任何東西）。

在另一方面，你可以做這樣的事情：

<a href="#" onmouseover="this.style.color=red;" onmouseout="this.style.color='blue';">...</a>

但是，這本身就是討厭，因爲它聯繫在一起的標記，演示，行爲和一大堆其他東西。

您也可以通過寫出鏈接標籤或操作document.stylesheets將樣式表注入頁面，但這會觸發下載。

我通常看到第一種方法（添加一個樣式塊）在大型上完成。「模塊化」門戶站點可以做這種事情，所以也許這是事實上的標準（它至少比可以在那裏填充JavaScript更易讀，更容易維護）。 JavaScript方法似乎對DOM和整個頁面的影響最小，因爲您將自己的演示文稿保留下來。

這是一些前端dev morasses，你選擇的每個答案在某種程度上都是錯誤的，所以權衡選項並選擇最容易建立和維護的選項。

來源

2009-06-12 14:32:36 ajm

我會動態創建一個CSS文件，因爲我解析了所有的控件，並且將服務器端屬性添加到包含懸停或其他僞類樣式的控件。

<a style="color:blue" styleHover="color:blue" id="a1">Click!</a>

您的代碼可以看看這些屬性和動態

#a1:hover { 
    color:blue 
}

我不知道.NET允許你做這種類型的屬性解析生成CSS文件，但我在爲php創建的框架中做了類似的事情。

來源

2016-09-26 21:33:38

是否可以創建內聯僞類型？

回答

相關問題