Question

请教高手：如何用CSS定义网页在不同设备上区别显示？

一个网页，想通过CSS定义在不同设备上区别显示，比如在桌面电脑上和在智能手机上。外部链接CSS文件时到底应该怎么写？

只采纳有效的方案。谢了先！

Answer 1

（一）放在head标签中的写法如下：

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

media="only screen and (max-device-width:480px)">

（二）放在styleSheet样式表的写法如下：

@media only screen and (max-device-width:480px){

/*css样式*/

}

追问

对，我想要的就是第一种的那行代码。谢了！
但我是想在一个页面上同时挂两个CSS，让该页面在手机上用一个CSS，而在常规桌面电脑上刚用另一个。
那么，与你给的那行代码并存的，用于桌面电脑的代码是什么样的？关键就是那个media属性应该怎么写呢？

追答

用于电脑的不用写。

追问

我试了。不写的话，手机上也跟着回到与桌面一样的样式了。
用这个media="screen" 问题似乎就解决了。

还是要谢谢您，帮我解决了关键问题。
希望以后有机会再向您求教。

Answer 2

桌面电脑上不同的浏览器出现不同的显示效果，你做到兼容所有主流的浏览器就行了。智能手机也是。1：放在head标签中的写法如下：
<style type="text/css">
.youji a{
font-size:13px;
color:#000;
}
</style>
2：放外面的CSS文件链接方法
<link rel="stylesheet" href="./jsda/fancybox/style1.css"/>

Answer 3

这个css本身不能实现，你可以通过程序来实现，然后写多个css。