- objective-c - iOS 5 : Can you override UIAppearance customisations in specific classes?
- iphone - 如何将 CGFontRef 转换为 UIFont?
- ios - 以编程方式关闭标记的信息窗口 google maps iOS
- ios - Xcode 5 - 尝试验证存档时出现 "No application records were found"
我正在尝试创建许多彼此相邻的正方形 div(如果文本太多,它们的高度会扩展......但大多数时候不会有太多文本)。我正在尝试以响应式方式进行设置。
在页面上滚动时,我的移动浏览器中的地址栏不断出现和消失。当手机处于横向模式时发生这种情况时,每次地址栏打开或关闭时尺寸都会改变。这会造成非常烦人的用户体验。
我的 HTML 代码中有以下视口(viewport)行:
<meta name="viewport" content="width=device-width, initial-scale=1.0">
我的代码是这样的:
.block {
width: 80vmin;
min-height: 80vmin;
margin: 5% auto;
border-radius: 15vmin;
padding: 20px 10px;
}
显然,罪魁祸首是 vmin 组件。如果我不指定 vmin,那么在横向模式下查看时,框会太大。
有没有办法让 vmin 忽略地址栏并假装它不存在?如果没有,我还有什么其他选择可以解决这个问题?
最佳答案
从糟糕的 UX 开始,Chrome 添加了仅在隐藏地址栏后才计算 vh
、vmin
等值的功能。这样浏览器就不会统计太多次,fps也不会下降,但是会出现跳跃
的效果。
如果我是你,我会使用网格。您可以使用 min-content
高度,并且每行中的框将独立地具有相同的高度。使用 repeat
、auto-fill
和 minmax
可以添加尽可能多的框,而无需通过移动查询添加额外的 css。 (@media ...
)
编辑:
评论示例:
main {
display: grid;
grid-auto-rows: min-content;
/* to each row same height:
grid-auto-rows: 1fr; */
grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
/* to center:
justify-items: center;
align-items: center; */
}
<main>
<div>Hello</div>
<div><img src="http://via.placeholder.com/100x150/000000"></div>
<div><img src="http://via.placeholder.com/100x150/000000"></div>
<div>World</div>
<div>Hello</div>
<div>World</div>
</main>
关于html - 具有 vmin 和移动地址栏的响应式设计,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50634272/
描述 我有一个奇怪的错误,当使用 vmin 设置时,边框会导致内容和边框本身之间出现小间隙。单位。 可重现的片段 调整窗口大小以查看它,因为它只发生在某些设备视口(viewport)上 body {
我正在尝试创建许多彼此相邻的正方形 div(如果文本太多,它们的高度会扩展......但大多数时候不会有太多文本)。我正在尝试以响应式方式进行设置。 在页面上滚动时,我的移动浏览器中的地址栏不断出现和
在这种情况下,我想创建一个颜色条,其颜色(与散点图相关联)跨越特定范围,但仅显示颜色条本身上该范围的子集。我可以用 contourf 来做到这一点,因为我可以独立于轮廓级别设置 vmin 和 vmax
我编写了图像校准脚本(暗框和平场)...这是代码的一部分 for n in range(len(img)): with pyfits.open(img[n], mode='update', mem
更新: Simple Proof of Concept解释不同的行为。 假设我使用 tcgetattr 和 tcsetattr 设置 VMIN = 0, VTIME = 0 并删除 ICANON,将终
问题 我正在尝试设置我的根 font-size 以在 calc() 中使用 vmin 和 px > 功能。当使用 rem 设置圆 div 的 height 和 width 时,所述圆在小尺寸时被“压扁
我正在使用 hist2d 在 python 中绘制一些数据。对于色标的标准化,我使用参数 norm=matplotlib.colors.LogNorm(). 如何获得(后验)matplotlib 分配
我正在使用 hist2d 在 python 中绘制一些数据。对于色标的标准化,我使用参数 norm=matplotlib.colors.LogNorm(). 如何获得(后验)matplotlib 分配
on my site我正在尝试创建一个可扩展的 ui othello 游戏。棋盘的每一 block 都应该是一个正方形。我使用表格作为董事会的标记。我使用的 css 是 #board td {
我正在尝试通过串口连接设备。设备每 700 毫秒发送一次 10 字节 轮询作为“心跳”。每次我读取心跳时,我都必须回复一个 12 字节 长的响应。 在此响应中,我可以请求设备在轮询之间发送特定数据。不
我是 bokeh 的新用户。虽然问题很简单我还没有找到答案。在bokeh库中,matplolib imshow的vmax和vmax等价的是什么?例如,在 Matplolib 中,我使用具有这些值的 v
我在一个项目中工作,我需要从我的 Linux (Ubuntu 12.04 LTS) 计算机的 USB 端口读取数据。 我正在使用读取函数以非规范模式从终端读取数据,并且 VTIME = 5(0.5 秒
我正在尝试为 Linux 编写一个简单的 C 串行通信程序。我对阻塞/非阻塞读取和 VMIN/VTIME 关系感到困惑。 我的问题是,是否应该根据我是否有阻塞/非阻塞打开调用来设置 VMIN/VTIM
我正在使用 GeoViews 绘制网格数据的 map ,如 gv.Image目的。目前,我的绘图功能如下所示: def plot_variable(path): var_ = xr.open_
有没有一种方法可以在同一个元素上同时使用 vmax 和 vmin,这样我就可以制作一个范围来阻止它变小或变大?当我只使用一个时,它会变大或变小,我试图限制它两侧的极端。这用于响应式设计。 http:/
我对 Autonumeric 插件有疑问: HTML Javascript //Init Autonumeric $("#testInput").autoNumeric('init', { aS
我有这段代码 .image.medium { width:10vmin; height:10vmin; } .image.small { width:6vmin; he
我正在改编我为跨平台兼容性而编写的一个简单的 Linux 串行库。大多数事情都会保留下来(尽管 Microsoft 坚持要重命名所有内容),但有一些我没能找到的功能。 我当前的问题是 VMIN 和 V
在使用 contourf 绘图时尝试调整数据范围时得到一个奇怪的结果 import matplotlib import numpy as np import matplotlib.cm as cm i
使用新的 vmin css 属性来获得正确的字体大小。效果非常好! div.sample { font-size: 1.5vmin; text-align: center; ... } 问题发生在调整
我是一名优秀的程序员,十分优秀!