css - 移动样式表干扰主样式表

标签 css

我有这样的移动样式表:

<link rel='stylesheet' media='only screen and (max-device-width: 480px)' href='css/mobile.css' type='text/css' />

我的主要样式表是这样的:

<link rel="stylesheet" href="css/style.css" type="text/css" media="screen"/>

当我从移动设备访问该页面时,它混合了移动和主要样式表规则。如何使移动样式表专用于移动设备,而主样式表专用于屏幕?

最佳答案

<link rel="stylesheet" href="css/style.css" type="text/css" media="screen"/>

<link rel='stylesheet' media='screen and (max-device-width: 480px)' href='css/mobile.css' type='text/css' />

还要确保你的头脑中有这个:

<meta name="viewport" content="width=device-width, initial-scale=1.0" />

关于css - 移动样式表干扰主样式表,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5641158/

相关文章:

html - 如何在html表格上显示滚动条

html - SVG:在圆弧中插入图像

html - 具有自动边距的 css div 不会缩小

javascript - jQuery一个div,两个url,用css做一个选择框

css - 如何防止结构为水平列表的图像换行?

html - 上下两个 div 堆叠在另一对相似的 div 旁边

css - 像 zip 一样组合两列 - 最佳模式

css - MVC、CSS 和 302 身份验证 hell

html - @font-face 在 IE7 和 IE8 中不工作

html - FA Glyphicon 仅显示为正方形