移動和主CSS混合

Question

我有兩個CSS頁面用於我的網站，一個主CSS和一個移動CSS。問題是，在移動設備（iPhone，Android）上觀看時，兩張樣式表會混淆在一起。例如，在iPhone上查看網站時，正在應用主樣式表中的一些樣式。

這可能是什麼原因造成的？下面是我的CSS聲明：

<link href="css/main.css" rel="stylesheet" type="text/css" /> 

<link media="only screen and (max-device-width: 480px)" href="css/mobile.css" type="text/css" rel="stylesheet" /> 
<meta name = "viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> 

Answer 1

的main.css的文件將被列入任何設備你看着，媒體查詢部分爲mobile.css的頁面被稱爲在您給定參數以及其他樣式表。

如果您遇到包含樣式的問題，請使用媒體查詢排除main.css，或在mobile.css文件中重新聲明這些樣式。