将iPad (宽768px，高1024px )作为小屏幕的材质UI
iPad是由苹果公司推出的一款平板电脑，它具有宽768px，高1024px的屏幕分辨率。作为小屏幕的材质UI，可以通过以下方式进行设计和开发：
- 响应式设计：针对不同屏幕尺寸和分辨率进行适配，确保在iPad上呈现出良好的用户体验。可以使用CSS媒体查询来针对不同屏幕尺寸应用不同的样式。
- 移动优先设计：考虑到iPad是一种移动设备，应该采用移动优先的设计原则。这意味着在设计和开发过程中，首先关注移动设备的用户体验，然后再逐步适配到更大屏幕的设备。
- 简洁直观的界面：iPad的屏幕相对较大，可以充分利用空间展示内容，但仍然需要保持界面简洁直观。避免过多的信息密集显示，注重用户操作的便捷性和可视化效果。
- 触摸友好的交互设计：iPad是通过触摸屏幕进行操作的，因此需要设计易于触摸的交互元素，如大按钮、合适的间距和触摸手势等。同时，还可以考虑使用iPad特有的功能，如多点触控和手写笔记等。
- 优化性能和加载速度：在开发过程中，需要注意优化页面的性能和加载速度，以提供流畅的用户体验。可以通过压缩和合并CSS和JavaScript文件、使用图片压缩和懒加载等技术手段来提高页面加载速度。
- 应用场景：iPad作为一种移动设备，广泛应用于教育、娱乐、办公、零售等领域。例如，在教育领域，可以开发教育类应用程序，提供在线学习、电子书阅读和交互式教学等功能。
腾讯云相关产品和产品介绍链接地址：
- 腾讯云移动应用开发平台：https://cloud.tencent.com/product/madp
- 腾讯云移动推送服务：https://cloud.tencent.com/product/tpns
- 腾讯云移动直播：https://cloud.tencent.com/product/mlvb
- 腾讯云移动分析：https://cloud.tencent.com/product/mta
- 腾讯云移动测试：https://cloud.tencent.com/product/mst
请注意，以上仅为示例，实际上还有更多腾讯云的产品和服务可供选择。
相关·内容
我正在尝试使用媒体规则来将CSS定位为仅iPad。我想排除iPhone/iPod和桌面浏览器。如果可能的话，我也想排除其他移动设备。
我用过
<style type="text/css" media="only screen and (min-device-width: 768px) and (max-device-width: 1024px)">
但是刚刚发现桌面Safari4可以读取它。我试过用"481px“而不是"768px”和另一个增加了方向的变体：
<style type="text/css" medi
浏览 1提问于2010-04-21得票数 20
回答已采纳
我正在为桌面和iPad设计一个网站。iPad和台式机也将使用相同的网站。
网站的设计宽度是1024px，在iPad肖像模式下，它将是768px。我的问题是，在设计和编写CSS时，我应该考虑哪些事情，所以不应该需要为肖像模式编写特定的css
我想在不使用媒体查询的情况下为这两个方向做灵活的布局。
浏览 0提问于2011-07-31得票数 1
我想根据是笔记本电脑屏幕还是iPad屏幕，为1024px宽度的屏幕设置不同的媒体查询。
例如，如果有人在笔记本电脑上(宽度: 1024px)查看我的网站，他们应该看到一个图像，而如果他们从iPad(宽度: 1024px )查看，图像应该是隐藏的(显示:无)。
浏览 0提问于2016-10-08得票数 2
2回答
如何定位宽于1000像素的设备？也就是说，包括横向模式下的iPad和大多数桌面，但不包括纵向模式下的iPad。
我找到了
/* iPads (landscape) ----------- */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : landscape) {
/* Styles */
}
/* iPads (portrait) ----------- */
@media only screen
and (min-device
浏览 1提问于2013-10-10得票数 1
回答已采纳
我的代码帮助过滤出的CSS只适用于iPad。它是1024x768分辨率。
@media all and (device-width: 768px) and (device-height: 1024px) and (orientation:portrait) {
}
@media all and (device-width: 1024px) and (device-height:768px) and (orientation:landscape) {
}
我想问一下，这段代码是否适用于所有的iPad版本，如iPad 1-4、iPad Mini、iPad Air。
如果不是，我需要纯CSS代码
浏览 5提问于2014-04-25得票数 1
回答已采纳
我正在一个响应式的网站上工作，我想让网站对浏览器的反应小于1024px宽，并使用这些相同的风格在肖像中的iPad。
但是，如果我在浏览器小于1024像素时应用样式的媒体查询，如下所示
@media only screen and (max-width : 1024px) { /* styles */ }
它们会影响景观中的iPad，这是我不想要的-我怎么能排除景观iPad而包括肖像iPad呢？
浏览 7提问于2013-10-09得票数 0
3回答
我使用的背景图像(是固定的)以Web格式100%显示，但当我在Ipad (1024x768)上模拟它时，图像不再适应屏幕的宽度，它只填充了大约70%的屏幕高度。
这是我在网站格式中使用的CSS：
.body{
background-image: url("/img/bg.jpg");
background-repeat: no-repeat;
background-attachment: fixed;
background-size: 100% auto;
height: 5700px;
width: 100%;
}
这是我在Ipad样式中使用的
浏览 2提问于2017-08-02得票数 0
回答已采纳
我正试图为我的srcset映像实现这些大小：
桌面(最小宽度:1024 min)：100 min
片剂(最小宽度:768 min)：150 min
Phone+Other: 200
(它应该比屏幕更大，因为它是动画的)。但是，在size属性中，正确的顺序是什么？
这不起作用(加载更大的图像的方式)：
sizes="(min-width: 768px) 150vw, (min-width: 1024px) 100vw, 200vw"
目前看来，这似乎是可行的：
sizes="(min-width: 1024px) 100vw, (min-width:
浏览 3提问于2016-09-05得票数 3
回答已采纳
2回答
是否可以仅为iPad显示器显示DIV？我试着在谷歌和这里出现的一些解决方案上搜索，但它不起作用，只是在你的电脑上显示它。是否有可能只在iPad显示屏上显示
@仅媒体屏幕和(最小设备宽度: 768px)和(最大设备宽度: 1024px) { /*样式在此处*/}
*对我的英语表示感谢和抱歉
浏览 7提问于2018-01-28得票数 0
回答已采纳
1回答
我使用iPad和Ipad的媒体查询如下：
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation : portrait)
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation : landscape)
问题1:在景观模式下观察渲染中的差异，在iPad中按预期呈现UI元素，而iPad Mini与另一个重叠，
HTML片段
浏览 0提问于2018-08-09得票数 0
1回答
我正在使用下面的媒体屏幕查询来正确显示图像，因为iPhone/ipad可以正常工作。但是，我不知道我应该为andriod手机做些什么？它以原来的形式显示图像？
/* iphone */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
img { max-width: 100%; }
}
/* ipad */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px)
浏览 0提问于2014-08-10得票数 1
回答已采纳
我的应用程序的中屏幕和小屏幕之间的布局有很大的不同，我正在利用Material UI's breakpoints来决定正确的布局。 从我在文档中可以看出，small屏幕是600px及以下版本。然而，即使有了这些断点，即使它的宽度是768px，iPad上的组件仍然被呈现为一个小屏幕。 例如： const MyComponent = () => (
<div>
<Box display={{ xs: 'none', sm: 'none', md: 'block', lg: 'block
浏览 20提问于2020-12-12得票数 1
回答已采纳
1回答
针对iPad的媒体查询
、、、
我有一个问题，为谷歌浏览器开发人员工具上出现的iPad专业版和iPad的具体查询...我不能瞄准iPad专业版，例如
“和(最小设备宽度: 768px)和(最大设备宽度: 1024px)”
但它也恰好适用于其他分辨率，如
“和(最小设备宽度: 1024px)和(最大设备宽度: 1366px)”
有谁知道我如何为不同的iPad大小编写不同的媒体查询规则？非常感谢：)
浏览 1提问于2020-02-28得票数 0
1回答
我有一个ipad，我想应用媒体查询时，它是在景观模式。这就是我尝试过的(我尝试了这两种选择)：
选项1:
/* iPads (landscape) ----------- */
@media all and (device-width: 1024px) and (device-height: 768px) and (orientation:landscape) {
.ipad-landscape { color: blue; } /* your css rules for ipad landscape */
}
备选方案2:
/* iPads (landscape) -----------
浏览 0提问于2019-09-19得票数 1
8回答
嗨，我正在使用多个平板电脑设备，iPad，银河平板电脑，宏碁图标，LG 3DPad等。
iPad - 1024 x 768LG Pad - 1280 x 768银河标签- 1280 x 800
我只想使用CSS3媒体查询来定位iPad。因为，LG和iPad的设备宽度是相同的768px -我有困难分离每个设备。
我试着用下面的方法分开，但似乎不起作用：
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation : portrait) /* applied to
浏览 238提问于2011-11-25得票数 78
回答已采纳
我有以下媒体屏幕：
/*
768px - 1280px
WXGA - (Windows Phone com DPI alta)
*/
@media only screen
and (min-device-width: 768px)
and (max-device-width: 1280px)
and (orientation: portrait){}
@media only screen
and (min-device-width: 768px)
and (max-device-width: 1280px)
and (orientation: landscape){}
/*
10
浏览 5提问于2017-07-21得票数 1
回答已采纳
2回答
我正在尝试开发一个web应用程序，该应用程序根据设备(及其方向)应用适当的样式表。
我总共有5个媒体查询：
//for mobile phones in portrait mode
<link rel="stylesheet" media="all and (max-device-width: 480px) and (orientation:portrait)" href="css/mobile-portrait.css">
//for mobile phones in landscape mode
<link rel=
浏览 0提问于2011-06-10得票数 4
回答已采纳
我正在尝试使用Phonegap(cordova)和IBM Worklight制作一个示例混合移动应用程序。我已经添加了iPad和iPhone作为目标设备。
应用程序中的web内容将是响应式的，使用CSS @media查询。
我面临的问题是，当我在iPad/iPhone上启动应用程序时，它无法识别我编写的媒体查询。我尝试使用设备定向方法和最大宽度方法来切换CSS。还是没有成功。
在设备宽度方法中使用的代码是
/* Portrait */
@media screen and (max-width: 768px) {
/* Portrait styles since iPad in portra
浏览 0提问于2013-03-22得票数 0
回答已采纳
我在一个网站上工作，这是设计成最好的工作时，在iPad上查看横向模式。一切都在一个1024px宽的<div>容器中。但是，我仍然需要缩小视口，以便当用户将iPad转换为纵向时，用户不必缩小或水平滚动来查看页面上的所有内容。
目前，我的<head>中有这个<meta>标签
<meta name="viewport" content="width=1024px, initial-scale=1.0, maximum-scale=10.0" />
当页面以横向模式查看时，一切显示正常，但我无法获得上面提到的所需的纵向行为
浏览 0提问于2011-06-29得票数 14
回答已采纳
我正在iPad(1,2)和三星Tab 2上测试我的网络应用程序。我有不同的CSS(外部)适用于景观/肖像模式在iPad和景观/肖像模式在表2。
但我无法为Tab 2编写一个正确的媒体查询。与我所喜欢的相反，用于iPad景观的CSS也适用于Tab 2的景观模式！
以下是我尝试过的：
<link rel="Stylesheet" type="text/css" media="only screen and (min-device-width : 600px) and (max-device-width : 1024px) and (orientatio
浏览 3提问于2013-01-08得票数 2
回答已采纳
1回答
我有以下媒体查询..。景观媒体查询总是优先考虑。我试着改变这些想法的顺序，如果是第一张肖像，它将优先，但这是行不通的。事实上，即使我完全删除了景观媒体查询，而离开了“肖像”，它也不起作用，所以看起来肖像媒体查询似乎被打断了:S
以下是我的两个问题：
/* iPad Retina, landscape */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : landscape)
and (-webkit-min-device-pixel-r
浏览 1提问于2014-10-29得票数 0
1回答
媒体查询边距失败
、、
到目前为止，我所有的媒体查询都很好，除了这次。我有一个实际的iPad，我使用的是模拟器，而且我的客户不喜欢他的徽标停在屏幕的边缘，所以我想要做的就是给它一点填充或者空白(填充也不起作用)。我想另一双眼睛不会疼-我是不是漏掉了什么东西？？
@media screen only and (min-width:768px) and (max-width: 1024px) {
.site-header .home-link {
margin: 0 20px!important;
}
}
.site-header .home-link {
background:
浏览 2提问于2015-05-20得票数 0
回答已采纳
我试图为iPad Pro 12.9英寸版本实现以下媒体查询，但当我检查实际的iPad设备时，它不起作用。
@media only screen and (min-device-width: 1024px) and (max-device-width: 1366px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2)
{
//CSS
}
上面的媒体查询是在Chrome上进行的，但是当我查看实际设备，甚至xCode上的模拟器时，它就不起作用了，我也尝试过使用(-webkit-min-device
浏览 1提问于2017-10-06得票数 2
回答已采纳
我有一个用于ipad的媒体查询css块
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px) {
}
对于笔记本电脑和台式机，@media只显示屏幕和(最小宽度:1224 and ){}
我有一个js函数，它需要有不同的参数，这取决于我所使用的设备。所以让我们这样说吧
if(@media only screen && (min-width : 1224px)){
function operation(){
var x = 2;
}
}
浏览 9提问于2014-04-19得票数 0
回答已采纳
我对使用媒体查询进行编码有点陌生，我想我已经把自己画到了角落里，使用了太多的媒体查询(可能是以错误的方式)。
我想做的是当屏幕或设备的宽度小于481px时隐藏一些页面元素。因此，在下面的屏幕截图中，您可能会看到右上角的几行文本。
我的问题与我使用的媒体查询有关。我很想弄清楚(1)为什么页面元素(右上角的那两行文本)在页面小于481px时不会消失，或者(2)为什么当我设法让页面元素消失时，它们不会出现在任何更大的屏幕/设备尺寸中。
下面这段CSS代码似乎会引起一些问题：
/* Smartphones (landscape) ----------- */
@media only scre
浏览 0提问于2013-10-16得票数 9
回答已采纳
1回答
跨设备工作的媒体断点
、、、
我有一组媒体查询断点，用于检测iPad是否处于横向或纵向状态。断点是；
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : portrait)
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : landscape)
现在我将这些断点用于iPad的phonegap应用程序，但现在我需要
浏览 0提问于2013-05-23得票数 0
回答已采纳
目前正在开发一个响应性设计网站。根据宽度和屏幕分辨率，我使用媒体查询来针对不同的设备。
我有一个场景，如果我想使用屏幕分辨率来瞄准设备，但我不明白这是如何工作的。
我想检查最小宽度和最大宽度，屏幕分辨率也可能从97 ipad到ipad max分辨率264 ipad。但这似乎行不通。如果我给出一个单一分辨率最小宽度:155 min的惠普加载的平板电脑，它可以工作。但最小到最大分辨率条件似乎不起作用。你们能分享一下你们的想法吗。
为此，我使用了如下代码
@media only screen and (min-width:768px)
and (max-width:1024px)
浏览 3提问于2013-04-10得票数 9
1回答
我是新使用媒体查询。我正在做一个网站，我希望它能正确地显示在Ipad上。
I have tried this,
//css use for Ipad
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px) {
.overlayBox{
width:200px;
}
}
// css use for Window
.overlayBox{
width:450px;
}
浏览 4提问于2013-07-25得票数 1
回答已采纳
我想根据设备更改css样式。
我是这样写的
<link rel="stylesheet" type="text/css" href="@Url.Content("~/Content/Destop.css")"
media="only screen and (min-width : 1224px) "/>
<link rel="stylesheet" type="text/css" href="@Url.Content("~/Content
浏览 3提问于2014-11-04得票数 0
回答已采纳
4回答
我有一组断点，我正在尝试使用这些断点，并且使用下面的CSS代码来更改css规则，但是这些规则只适用于1200 to宽的屏幕，而不是其他的屏幕。
/* Large Desktop Devices */
@media (min-width: 1200px) {
.header {
height: 120px;
}
}
/* Small Desktop Devices and iPad Landscape */
@media (min-width: 1024px) and (max-width: 1199px) {
.header {
浏览 6提问于2015-08-12得票数 2
回答已采纳
1回答
我的媒体查询似乎不适用于ipad。网站是。在最后的css中，我为ipad应用了媒体查询-
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
#mainContent, #container, #sidebar, #content, #footer, #betaSpacer {
width: 765px;
overflow: hidden;
}
// Other queries targeting ipad
}
/*End*/
完整的CSS在这里-
以元形式设
浏览 0提问于2015-07-01得票数 0
我在Ipad和Android平板电脑上遇到了媒体查询的问题，尤其是在横向模式下。
我需要一些关于适当的媒体查询的帮助。
以下是我正在使用的媒体查询：
Android环境：
@media only screen and (min-device-width : 800px) and (max-device-width: 1280px) and (orientation : landscape) {}
Ipad环境：
@media only screen and (min-device-width : 768px) and (max-device-width: 1024px) and (orient
浏览 3提问于2013-07-01得票数 0
1回答
我试图让我的站点在两个设备上响应。
三星标签(600 X 1024)
iPad (768x1024)
使用以下媒体查询
@media only screen and (min-device-width : 600px) and (max-device-width : 1024px) and (orientation : portrait){ }
和
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait){ }
浏览 2提问于2013-05-10得票数 0
1回答
用于多分辨率的CSS媒体查询
、、、、
我正在考虑使用CSS Media Query来支持多个平板电脑(Android/iPad)。下面是我的媒体查询；
<link rel="stylesheet" media="only screen and (max-device-width:1024px)" href="css/tablet.css">
<link rel="stylesheet" media="only screen and (min-device-width:1024px)" href="css/desktop.css
浏览 0提问于2011-11-11得票数 2
回答已采纳
我正在尝试理解ios设备的viewport元标签。我创建了一个测试页面，其中插入了一个862 is宽的图像。因此，我将viewport meta标记设置为：
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale: .5, maximum-scale: 5.0">
然而，在分辨率为1536像素的ipad 3上，如果将视口设置为与ipad 3相同的可见区域，862 in图像就会被放大，其宽度略大于可见区域。所以我必须水平滚动，才能看到图像的
浏览 0提问于2013-04-11得票数 4
回答已采纳
1回答
我正在尝试设置一个媒体查询，该查询将对视口为1024px或更高的桌面浏览器以及横向模式下的iPads使用相同的样式表。
@media only screen and (min-width: 1024px)
对于纵向模式的iPads和手机，我们有一个不同的样式表可以加载。
实际情况是，桌面显示正常，但iPad生成一个空白页面，因为桌面媒体查询无法识别。然而，媒体对肖像和手机版本的查询也没有注册。
我尝试了各种组合，比如@media only screen and (min-device-width: 481px) and (max-device-height: 1024px) and (orie
浏览 1提问于2015-05-02得票数 3
我有一个移动响应视图的问题，如果应用程序在平板电脑或iPad上运行，屏幕将适合iPad的屏幕，我想强制此屏幕视图(iPad)为更小的屏幕视图(360×640)。有谁知道怎么做吗？
此屏幕视图：
要这样做：
浏览 1提问于2019-07-11得票数 1
4回答
我正在尝试加载一个仅适用于ipad的css文件。我试过这个：
<link href="/css/ipad.css" rel="stylesheet" media="all and (max-device-width: 1024px)" type="text/css">
它适用于iPad，但如果我在桌面上将分辨率降低到1024x768，并在firefox中查看站点，那么ipad样式表也会加载。所以我试着：
<link href="/css/ipad.css" rel="stylesheet&
浏览 0提问于2011-02-03得票数 3
回答已采纳
我的问题是，媒体查询在所有设备上都工作得很好，但问题出现在三星GLAXYTAB10.1上，而它在ipad等设备上工作正常，请检查我的媒体查询
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape)
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait)
浏览 1提问于2015-03-10得票数 1
我在一个响应式网站上工作，我的客户希望将某些样式应用于768px的桌面，但不适用于该大小的平板电脑。我已经尝试了多种媒体查询，但我只能让Firefox配合。Chrome、Safari和IE都忽略了媒体查询。这是我尝试过的。
@media only screen and (min-width: 768px), not (min-device-width: 768px) and (max-device-width: 1024px) {
/* styles for desktop only here */
}
我认为这与"not“运算符有关，但我看不出我做错了什么。值得一提的是，
浏览 2提问于2012-03-09得票数 5
我正在尝试使用1366x768的媒体查询CSS来特别针对我的桌面分辨率。因此，我使用了这种方法。
@media (max-width: 1367px)
这个桌面媒体查询CSS实际上是有效的。
不幸的是，它与我的S4和iPad的媒体查询CSS冲突，导致它们无法工作。如下所示是我对S4和iPad的媒体查询
S4
@media only screen and (max-device-width: 440px)
iPad
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (o
浏览 3提问于2014-01-09得票数 0
1回答
我一直在为一个网站做一些移动测试，无法让我的媒体查询在移动浏览器中工作。我在iPad Air 2和iPhone 5c上对Chrome和Safari进行了测试，但没有结果。将max-device-width等属性更改为max-width，这些更改在浏览器中起作用，但在移动设备上仍然不起作用。下面是一些缩短到相关部分的代码。
HTML:
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=
浏览 2提问于2015-10-07得票数 1
我正在重新设计我的网站，有两个基于屏幕分辨率的布局。对于任何1010px或更大的屏幕，一个有1000px，另一个有675px，用于较小的屏幕。现在我使用下面的viewport标签：
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes">
这个设置在桌面浏览器和iPad上都工作得很好。然而，安卓和iPhone浏览器都不能正确显示页面，它们从不同级别的缩放开始。取而代之的是，我希望675px的显示屏显示正确缩放，以便在屏幕上显示整个
浏览 0提问于2013-02-26得票数 4
我希望添加一些响应式的网页设计到我的网站为iPad肖像。我有了我的主css文件(style.css)，然后我添加了下面这行：
<link rel="stylesheet" href="ipad-portrait.css" media="only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait)" />
但是，当我尝试将div的背景颜色设置为红色或其他颜色，然后调整窗口大小时，当窗口变为iP
浏览 0提问于2012-11-29得票数 0
1回答
我有一个问题，在一个网站上的4个元素的响应能力，我正在做的饼形图元素，完美地在我的桌面互联网浏览器上缩放。但出于某种原因，IPAD 2的元素重叠。我使用了这个CSS：
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px) {
.q_pie_chart_holder {
display: inline-block;
margin: 0 auto;
opacity: 0;
transition: opacity 0.3s ease 0s;
w
浏览 3提问于2015-05-25得票数 0
回答已采纳
2回答
网站不会填满iPad上的屏幕
、、、、
我正在开发一个600像素宽的网站，并使用响应式查询使其适合不同的设备。我使用了以下代码：
<meta name="viewport" content="width=device-width" />
@media only screen and (min-width: 320px) and (max-width: 480px) {
/* iPhone */
.container { width: 100%; max-width: 480px; }
...
}
@media only screen and (min-wi
浏览 0提问于2014-02-16得票数 0
@media only screen
and (min-device-width: 980px)
and (max-device-width: 1024px)
and (orientation: landscape)
and (-webkit-min-device-pixel-ratio: 1) {
#menu {
display: none;
}
#mobile-nav {
display: block;
float: right;
}
#mobilemenu{
display:block;
}
#navigation-mobile{
mar
浏览 2提问于2016-06-22得票数 1
回答已采纳
3回答
我在我的网站上使用以下媒体查询。
<link rel="stylesheet" href="web.css" media="only screen and (min-device-width : 1025px)" />
<link rel="stylesheet" href="ipad.css" media="only screen and (min-device-width : 768px) and (max-device-width : 1024px)" />
我在这里的
浏览 1提问于2011-11-10得票数 1
**业余警告**
我想有四个设置我的CSS，我希望最后一个是一个“一切其他”的媒体查询，有这样的事情吗？
这是我的前三个问题：
@media only screen and (min-width: 1024px) and (min-height: 940px) /* for large displays */
@media only screen and (min-width:1024px) and (min-height:689px) and (max-height:939px) /* for smaller displays */
@media only screen and (max-w
浏览 0提问于2014-08-21得票数 4
2回答
嗨，我写了媒体查询，以便在ipad中有导航栏的响应视图。我的媒体查询不起作用。
.nav-tabs>li>a {
color: #2b2b2b;
font-size: 13px;
line-height: 26px;
padding: 4px 12px;
outline: none;
margin-left: 50px;
position: relative;
display: block;
}
@media only screen and (device-width: 768px) and (device-heig
浏览 0提问于2017-07-03得票数 0
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
实时音视频
即时通信 IM活动推荐
腾讯云开发者
