Question

我有这个网站：link我希望黑色部分只有一个滚动条，以便用户可以看到整个内容。

我在身体上使用了溢出，因此整个页面拒绝滚动，但我无法在此特定div上启用它。

我该怎么做才能使黑色区域可滚动？

提前致谢！

Answer 1

改变这一点。

#lue1 {
width: 450px;
float: left;
box-sizing: padding-box;
background-color: #000;
height: 100vh;
padding: 20px;
overflow-y: scroll; /* New added code */
color: #fff;
font-family: 'Georgia';
text-align: justify;
font-size: 14px;
box-sizing: border-box;
}

Answer 2

添加样式溢出-y：滚动到具有类

的元素

container_inner default_template_holder clearfix

Answer 3

如果<div id="lue1"> ... </div>是您想要垂直滚动的元素，请转到overflow-y: auto;：

＆＃13;

body {
  overflow: hidden;
}

#lue1 {
  width: 450px;
  float: left;
  box-sizing: padding-box;
  background-color: #000;
  height: 100vh;
  padding: 20px;
  color: #fff;
  font-family: 'Georgia';
  text-align: justify;
  font-size: 14px;
  box-sizing: border-box;
  
  overflow-y: auto;
  
}

＆＃13;

<body>
  <div id="lue1">
    <div id="lue2"></div>
    <h2 id="lue3">THE<br>OAK HOTEL</h2>
  
    <div id="lue4"></div>
    <div id="lue5">FEELS LIKE HOME</div>
    “The Oak Hotel” ένα ξενοδοχείο 4 αστέρων για τους λάτρεις της μοντέρνας,
    industrial αισθητικής. Νεόδμητη ξενοδοχειακή μονάδα, χτισμένη το 2015,
    προσφέρει στους επισκέπτες, μοναδική εμπειρία διαμονής, χάρη στις
    υπερσύγχρονες εγκαταστάσεις που διαθέτει. Βρίσκεται στην παραθαλάσσια περιοχή,
    της Κεραμωτής και διαθέτει 19 δίκλινα δωμάτια.<br>
    <br>
    Η αρχιτεκτονική του κτιρίου, το οποίο χαρακτηρίζουν οι επιβλητικές γωνίες και
    η ξύλινη του πρόσοψη, είναι εξαιρετική. Στο πίσω μέρος του ξενοδοχείου υπάρχει
    πισίνα και pool bar, για αξεπέραστες στιγμές χαλάρωσης.<br>
    <br>
    Το “The Oak Hotel” σας περιμένει να το επισκεφθείτε σε μια τοποθεσία που
    προσφέρει ηρεμία, ησυχία και χαλάρωση. Ζήστε μια αξέχαστη εμπειρία
    διαμονής.<br>
    <br><br>
  
    <div id="lue6">ΓΕΝΙΚΕΣ ΠΑΡΟΧΕΣ ΞΕΝΟΔΟΧΕΙΟΥ</div>
  
    <ul id="lue7">
      <li>24ωρη reception</li>
      <li>café-bar</li>
      <li>εστιατόριο</li>
      <li>πισίνα</li>
      <li>pool bar</li>
      <li>ιδιωτικό parking</li>
      <li>δωρεάν φύλαξη αποσκευών</li>
      <li>φιλικό με ΑΜΕΑ επισκέπτες</li>
    </ul>
  </div>
</body>

＆＃13;

在特定div上启用滚动条

3 个答案: