media-queries

1热度

1回答

当我为标题使用背景图像时出现问题。标题高度为100vh，图像在计算机和景观设备中显示效果良好。但是当我在纵向设备或屏幕上观看它时，背景会变得混乱。我真正的问题是：有没有一种方法来显示不同的图像为横向和肖像屏幕？

0热度

1回答

我有一个项目有不同的布局，取决于你使用的设备来访问它。我使用下列行：我的HTML <link rel="stylesheet" type="text/css" media="only screen and (max-device-width: 480px)" href="mobile_style.css" /> 访问不同的文件与CSS的移动设备。该行低于一般的CSS一。该CSS不是针对手机的。

0热度

3回答

如何使div始终使用CSS浮动视口中心

目标是让包含两个图像的div始终处于浮动视口的中间位置。有没有办法做到这一点，而不必做媒体查询调整每种类型的屏幕的边缘和底部？感谢您提前帮助。 body { background: url(../images/willscape-bg.png); background-repeat: no-repeat; background-size: 100% 100

0热度

1回答

媒体查询和javascript resize事件之间的区别

媒体查询和javascript resize事件之间有什么区别？他们两人看起来非常相似。哪些优点和缺点有媒体查询，哪些是调整大小的事件？

0热度

1回答

响应表固定的第一列折叠列成行

我有如下的布局的表： --------------------- | A1 | A2 | A3 | A4 | --------------------- | B1 | B2 | B3 | B4 | --------------------- 当用户改变浏览器，我想在表中的右列枢转到第二列和让他们表现为行。而不是他们叠加，我希望他们转动。我发现了很多在线堆叠的例子，它确实不是我想要的

0热度

1回答

如何减少图像宽度

我想知道如何在屏幕宽度缩小时调整本节中找到的图像大小。图像是视差效果的一部分，但它不是背景，它是滚动的东西（我通常将其作为文本发现）。 <div class="bgimg-1 w3-display-container" id="home"> <div class="w3-display-middle" style="white-space:nowrap;"> <img src=

1热度

1回答

如何通过CSS媒体查询区分手机和屏幕？

我读过，大多数媒体查询使用视口宽度来确定您是否在手机，平板电脑或PC上。我在无尽的网格中建立一个具有1000个小拇指的图像网格。每个拇指都是125px，在我的笔记本电脑上（MacBook 13“），我可以轻松地将9-10拇指放在一行中 - 这给用户带来了不错的体验。如果我将相同的代码添加到nexus 5， -7大拇指，这是一个糟糕的用户体验，连线是6-7厘米，MacBook是25英寸厘米 - 差别

0热度

1回答

Safari浏览器（移动和桌面）表浮动错误

我的影片格式为菜单表，并在窗口（使用媒体查询）变得太小，应该使自己适应。而不是在一条线上，菜单项应该将自己定位对方的下面，所以这样的：它在Chrome桌面工作正常，但是当我尝试在Safari中出现这种情况：这真的很奇怪。我清除了缓存，所以这不是问题。移动Safari和移动Chrome浏览器也会出现同样的问题。我在这里真的很沮丧，我希望有人知道一个解决方案。这里有一个展示的jsfiddle菜单

0热度

1回答

How to you window.mediaQuery匹配typescript

我有很多列的表，我想基于浏览器宽度隐藏，所以我尝试使用window.matchMedia（“（max-width：700）”）。matches，window .media（“（max-width：500）”）。matches等。在打字稿中，但我无法获得媒体侦听器。请找代码 for(let i : number =0 ; i< this.col.length; i++){ let media,

-6热度

2回答

手机的确切屏幕宽度和高度是多少？

我想做一个网站设计相对于手机的屏幕宽度和高度。我是这样做的： @media screen and (max-width: ...) and (max-height: ...) {...} 我想要得到的数目尽可能完美，所以如果有人知道什么分辨率的手机有，或与此有关的任何其他设备，请让我知道。