是否可以在網頁上應用CSS，並分別使用網頁的URL？

我對CSS有一個基本的問題，因爲我對web開發很陌生。是否可以在網頁上應用CSS，並分別使用網頁的URL？

我們可以在特定於網址的網頁上應用CSS樣式嗎？

我知道CSS沒有其他條件，比如我們有Javascript，但我只是爲了檢查是否有任何智能的方法。或者它根本不可能。

例如在JavaScript，你這樣做以下：

if (window.location.href.indexOf("webpage1.com") > -1) { 
................. 
................... 
................ 
}

我們可以用CSS類似的事情呢？

請爲我提供寶貴的建議。

來源

2017-04-13 sravan kumar

我不明白爲什麼我一直被否決投票。正如我已經提到，它不可能，但只是檢查是否有聰明的做法。如果這是你想要做的事情，請在回答 –

可以加載基於url的不同樣式表之前完全閱讀這個問題。只需在腳本中添加鏈接標籤 – charlietfl

編號CSS沒有任何內容可以讀取它所嵌入的頁面的URL。

唯一標識頁面通常通過將id添加到html或body元素來完成。

來源

2017-04-13 14:08:20 Quentin

@camccar - 我認爲您的意思是HTML類...並不是，但您無法通過CSS來實現。你需要一種編程語言。 – Quentin

這是不可能的CSS與頁面的URL連接，但你可以添加一個類或ID到您的網頁的HTML元素

HTML：

<html class="subpage">

CSS：

.subpage{ add some rules }

HTML：

<html class="main">

CSS：

.main{ add some different rules}

來源

2017-04-13 14:13:16

感謝您的回覆。我無權編輯HTML代碼。我只能在外部添加自定義css或js腳本。它基本上是一個像WordPress的網站。 –

如果您不介意在加載內容後運行腳本，則可能會出現這種情況。

該腳本可以獲取主機名並將其用作className以附加到您想要根據特定url更改樣式的元素，當然提供的樣式是預定義的。例如：

HTML

<div id="main">Hello World</div> 
... 
... 
... 
<script>document.getElementById("main").className = window.location.hostname.split('.').join('-')</script>

CSS

#main { 
color : red; 
} 
#main.fiddle-jshell-net { 
    color : green; 
} 
#main.google-net { 
    color : black; 
}

看到fiddle

來源

2017-04-13 15:33:37

如果有很多的款式進行更新 - 在某種程度上，這將是值得加入的完全新樣式表到級聯的底部 - 簡單地說：

創建一個新的樣式表（例如）。extra-styles.css）
如果條件爲真，該樣式表的引用添加到DOM

EG。

if (window.location.href.indexOf('page1') > -1) { 

    var extraStyles = document.createElement('link'); 
    extraStyles.setAtttribute('rel', 'stylesheet'); 
    extraStyles.setAtttribute('href', '/path/to/extra-styles.css'); 
    document.head.appendChild('extraStyles'); 

}

來源

2017-04-13 16:08:16 Rounin

是否可以在網頁上應用CSS，並分別使用網頁的URL？

回答

相關問題