如何在网页上启用水平滚动

Question

的index.html

p8

index.sass

<div name="MainContent" id="MainContent" class="MainContent">

</div>

但是，只有使用页面底部的栏，水平滚动才有效。如果我尝试使用滚轮页面将不会滚动。关于为什么会这样做以及如何使其发挥作用的任何想法？

Answer 1

要删除您的正文滚动属性，请将<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.3.4/vue.min.js"></script> <div id="app"> <h2>Parent</h2> <button v-on:click="updateComponentData">Click me true</button> <child ref="component1"></child> </div>添加到您的html或正文样式。

overflow:hidden

要使div可滚动，请将其宽度设置为100％，并通过添加body,html { overflow:hidden; } 启用水平滚动。现在div的宽度对于正文来说是100％，如果div中的内容具有更高的宽度，那么滚动将被启用。

overflow-x:auto

注意：请从#MainContent { width:100%; /* you can even set a static width here, which could be less than the body width*/ overflow-x:auto; } 样式中删除min-width:2000px和max-width:2000px