高度: vh；在移动chrome中不能正常工作
高度: vh 是一个CSS单位，表示视口高度的百分比。它是相对于视口高度的一个相对单位。
在移动Chrome中无法正常工作可能是由于以下原因之一：
- 浏览器兼容性问题：不同浏览器对于CSS单位的支持程度可能不同，导致在某些浏览器中无法正常工作。可以尝试使用其他单位或者添加浏览器前缀来解决兼容性问题。
- 元素定位问题：如果在移动Chrome中使用高度: vh 无法正常工作，可能是由于元素的定位方式或者父元素的高度设置不正确导致的。可以检查元素的定位方式和父元素的高度设置，确保它们符合预期。
- 其他CSS属性的影响：某些CSS属性可能会影响高度: vh 的表现，比如盒模型属性、浮动属性等。可以检查其他CSS属性是否与高度: vh 相互冲突，导致无法正常工作。
总结起来，如果在移动Chrome中使用高度: vh 无法正常工作，可以尝试以下解决方法：
- 检查浏览器兼容性，尝试使用其他单位或者添加浏览器前缀。
- 检查元素的定位方式和父元素的高度设置。
- 检查其他CSS属性是否与高度: vh 相互冲突。
腾讯云相关产品和产品介绍链接地址： 腾讯云提供了丰富的云计算产品和服务，包括云服务器、云数据库、云存储等。具体可以参考腾讯云官方网站：https://cloud.tencent.com/
相关·内容
1回答
Chrome没有调整内容以适应视口我也在Opera mini上测试了它，它也在工作。但我发布的链接不能超过2个
.intro-noticias { height: 89vh;}
width: 50%
浏览 9提问于2017-02-18得票数 3
我正在创建一个个人网站，我正在使用css网格来显示页面的每个部分与100vh的固定高度。在我在移动设备上测试google chrome之前，一切都很正常。我知道google chrome在100vh中包含了它的导航栏，所以我用100vh来计算。它可以工作，但它也适用于所有浏览器，移动和个人电脑。我希望它只适用于移动上的谷歌<em
浏览 22提问于2019-02-19得票数 1
回答已采纳
我一直在构建一个网站的首页，以了解一些web开发在所有浏览器上运行得很好，我已经在除safari之外的所有浏览器(windows)上进行了测试。我有一个html步骤，这样我就有样式为100vw和100vh的部分。在旅行中，它们的高度似乎是0； <div id="wrapper"> <section id=&q
浏览 2提问于2016-02-23得票数 2
2回答
HTML页面不能在移动设备上滚动
、、、、
我不能强制网页在移动设备上滚动。您可以在此处查看该页面的行为：https://abeedesk.com/beta 这就是我得到的css。screen and (max-width: 512px) { -webkit-overflow-scrolling: touch;
max-height: 100vh
浏览 25提问于2021-02-06得票数 0
我将下面的SVG作为背景图像引用，其宽度和高度在我的CSS文件中定义。它在Safari (台式机和移动端)、Brave (台式机和移动端)、Firefox (台式机和移动端)以及Chrome的桌面浏览器中完美显示。由于某种原因，该图像根本不能在Chrome移动浏览器中显示。 <?xml version="1.0" encoding="utf-8&
浏览 24提问于2019-04-11得票数 1
回答已采纳
有两个嵌入在页面上的iframes，其宽度为div的100%和设备高度的40%。提前谢谢你，杰克
浏览 3提问于2015-02-23得票数 0
回答已采纳
我在Android上的Chrome遇到了这个问题，它在同一设备上的其他浏览器上也可以工作： #a{width:100%;height: 100vh;background-color: red;}</style>
<div i
浏览 8提问于2015-08-03得票数 5
我在页面上有一个元素，当单击它时，会向包含iframe的页面添加一个div。当使用Safari在移动设备上向上滚动页面时(当只显示容器和iframe时)，底部导航栏不会正常显示。当我在页面上向上滚动时，为什么底部导航栏没有显示？在我单击
浏览 41提问于2020-02-22得票数 1
我有一个100%高的div，基于使用vh单位的视口： height:100vh;} display:block; background:blue;在Chrome中运行得很好，在Safari中就不太好了。我认为它应该可以工作，但只有当我为父div高度使用
浏览 2提问于2014-03-11得票数 4
我的网站在移动响应滚动中，即使我把body和html的高度设置为100vh。html, height: 100vh height: calc(92vh - 56px);} my mobile screen mobile screen in show of
浏览 19提问于2021-08-22得票数 2
回答已采纳
它可以在桌面(Ubuntu，Firefox)上运行，但不能在移动设备(Android，Chrome)上运行。我的智能手机底部有一个白色的小缝隙。div.full {}
min-height: 100vh !cover; -o-background-size: cover;
background-size:
浏览 17提问于2018-01-25得票数 0
我在Firefox中遇到了一个问题：
css如下:更改高度: 100%到90vh工作。但我不明白为什么。.themes-outercontainer position: relative;
display: table;
浏览 27提问于2017-12-23得票数 2
我们有一个应用程序，需要在广泛的桌面和移动设备上工作。主要内容div的样式如下： height: calc(100vh - 65px);}什么是设置div高度的安全方法，它将在所有浏览器上工作？
浏览 11提问于2017-06-19得票数 1
回答已采纳
1回答
自动缩放元素以适应视口/设备方向
、、、、
width: 640px; margin: 0 auto; background-color: orange;在桌面上然而，在移动环境下(屏幕高度小于640px )，我的正方形填满了整个宽度，用户需要滚动才能看到正方形的底部，这是不可接受的。
我想要实现的是使正方形适合屏幕的高度，以便在景观视图中可以完整地看到它。我曾尝试将.content更改为height: 100%，但因为它的大部分内容都是绝对定位的，所以它们
浏览 0提问于2016-01-19得票数 2
2回答
所以我注意到移动Chrome将地址栏计算成视口高度。因此，在元素上使用height: 100vh无法工作，因为当地址栏滚动时，视口高度会发生变化。实际上，我能够在ios上看到同样的问题，但是经过进一步的调查，我意识到这发生在所有的移动Chrome浏览器上。当地址栏从视口外滚动，当滚动到视口时，视口高度会发生变化。这将导致使用vh的任何元素重新计算，从而使页面跳转。当使用背景图像时，
浏览 5提问于2016-09-08得票数 21
回答已采纳
我在React.js中有一个简单的无限滚动实现。我使用event.target.scrollHeight来检测div的结尾。但是它在不同的浏览器上并不能一致地工作。例如，当我将div的高度设置为30vh时，它在chrome中有效，但在firefox中不起作用。如果我将其设置为35vh，它可以在火狐中工作，但不能在chrome中工作</em
浏览 17提问于2019-10-09得票数 2
回答已采纳
1回答
在Chrome中，这是一种魅力，但在Firefox中，边缘底部不是窗口高度。<div class="container">CSS： position: relative; margin-bottom: 100vh;}打开Chrome
浏览 0提问于2018-10-10得票数 1
我知道，由于多种原因，在手机上使用高度:100 on是不好的做法。然而，当高度:100 in与Next.js中的宽度:100 in耦合时，为什么不尊重它呢？我得到的正方形不是页面/浏览器的全部高度。它只发生在移动，而不是当我调整我的窗口大小。Chrome和Firefox也是如此。 background: blue; width: 100vh;<section>
浏览 5提问于2022-08-06得票数 0
1回答
我正在尝试实现一个效果，我有一个完整的高度英雄区域是固定的位置，并随着你的滚动向下移动。然后一旦离开屏幕，我希望它下面的内容在正常的滚动流中移动。我已经使用JS让它在某种程度上工作了。但是，除非我给包含的div设置一个固定的高度，否则我根本不能滚动。到目前为止，我已经在结果中包含了一个codepen，但显然希望摆脱显式的固定高度。{ position: fi
浏览 4提问于2018-10-25得票数 0
，因为我希望这个div包含在页面的一个段中，所以我使用CSS垂直高度( vh )属性来设置div高度。和目前我正在处理一个表单，我正在调整div的vh值，以便通过滚动显示整个表单。然而，我已经注意到，在桌面浏览器和移动浏览器(特别是Chrome和Safari )之间，我最终获得的高度是不同的。由于某种原因，桌面版比移动版创建的空间要大得多，我认为这可以归因于显示器上的屏幕空间比平板电脑大得多，但我认为使用CSS可以解
浏览 4提问于2015-09-08得票数 0
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
实时音视频
云直播活动推荐
腾讯云开发者
