如何制作平板电脑和iphone的样式表

Question

我认为样式表上的链接目标会使我的css文件仅在平板电脑或iphone上加载时加载.但我试图隐藏的元素仍然存在.我目前正在使用(media ="掌上电脑")

  <link rel="stylesheet" type="text/css" hrf="css/media.css" media="handheld" />

Answer 1

有太多的移动设备型号可以编写样式表; 你最好根据屏幕尺寸调整你的CSS .

这对于定位不同大小的Android平板电脑特别有用.

有关进一步说明,请参阅此有用教程

http://css-tricks.com/resolution-specific-stylesheets/

因此,您不希望定位特定的屏幕尺寸(随着更多设备的发布而不断变化),您需要根据屏幕尺寸更改样式表.

然后你将添加几个样式表:

<link rel="stylesheet" media="screen and (min-width: 480px) and (max-width: 700px)"     href="css/small.css" />
<link rel='stylesheet' media='screen and (min-width: 701px) and (max-width: 900px)'     href='css/medium.css' />

等等

因此iPhone将使用small.css,而大于700px的平板电脑将使用medium.css.