如何使平板电脑和iphone的样式表 [英] how to make style sheet for tablet and iphone

问题描述

我认为样式表上的链接目标将使我的css文件只加载在平板电脑或iphone上加载。但我想隐藏的元素仍然存在。目前正在使用（media =handheld）

I was thinking the link target on the stylesheet would make my css file only load when it loads on a tablet or iphone. But the elements I'm trying to hide are still there. Im currently using (media="handheld")

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

推荐答案

有太多的移动设备型号样式表您最好根据屏幕尺寸调整CSS。

There are too many mobile device models out there to write stylesheets for; you'd be better off adjusting your CSS based on Screen Size.

这对于定位不同尺寸的Android平板电脑特别有用。

This is especially helpful for targeting Android Tablets which comes in different sizes.

说明：

http://css-tricks.com/分辨率特定样式表/

因此，与其定位特定的屏幕尺寸（随着更多设备的发布而不断变化），

So, instead of targeting a specific screen dimensions (which would keep changing as more devices are released), you'd want stylesheets that change according to the screen size.

然后您将添加多个样式表：

Then you'll add several 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' />

等。

small.css和大于700px的平板电脑将使用medium.css。

So iPhones would use the small.css, and tablets larger than 700px will use medium.css.

这篇关于如何使平板电脑和iphone的样式表的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！