Пример CSS свойство overflow-y со всеми значениями

Source Code: (back to article)

<!DOCTYPE html>
<html>
  <head>
    <title>Заголовок документа</title>
    <style> 
      div.scroll {
      background-color: #8ebf42;
      height: 70px;
      width: 150px; 
      overflow-y: scroll;
      }
      div.hidden {
      background-color: #8ebf42;
      height: 70px;
      width: 150px;   
      overflow-y: hidden;
      }
      div.auto {
      background-color: #8ebf42;
      height: 70px;
      width: 150px;  
      overflow-y: auto;
      }
      div.visible {
      background-color: #8ebf42;
      height: 70px;
      width: 150px; 
      overflow-y: visible;
      }
    </style>
  </head>
  <body>
    <h2>Пример свойства overflow-y</h2>
    <h3>overflow-y: scroll</h3>
    <div class="scroll">Lorem Ipsum - это текст-"рыба", часто используемый в печати и вэб-дизайне. Lorem Ipsum является стандартной "рыбой" для текстов на латинице с начала XVI века. В то время некий безымянный печатник создал большую коллекцию размеров и форм шрифтов, используя Lorem Ipsum для распечатки образцов.</div>
    <h3>overflow-y: hidden</h3>
    <div class="hidden">Lorem Ipsum - это текст-"рыба", часто используемый в печати и вэб-дизайне. Lorem Ipsum является стандартной "рыбой" для текстов на латинице с начала XVI века. В то время некий безымянный печатник создал большую коллекцию размеров и форм шрифтов, используя Lorem Ipsum для распечатки образцов.</div>
    <h3>overflow-y: auto</h3>
    <div class="auto">Lorem Ipsum - это текст-"рыба", часто используемый в печати и вэб-дизайне. Lorem Ipsum является стандартной "рыбой" для текстов на латинице с начала XVI века. В то время некий безымянный печатник создал большую коллекцию размеров и форм шрифтов, используя Lorem Ipsum для распечатки образцов.</div>
    <h3>overflow-y: visible</h3>
    <div class="visible">Lorem Ipsum - это текст-"рыба", часто используемый в печати и вэб-дизайне. Lorem Ipsum является стандартной "рыбой" для текстов на латинице с начала XVI века. В то время некий безымянный печатник создал большую коллекцию размеров и форм шрифтов, используя Lorem Ipsum для распечатки образцов.</div>
  </body>
</html>