overflow: visible; width: 200px; height: 50px;
Este contenido de una capa, con overflow = visible, quiere decir que la capa debe crecer hasta que todo el contenido de la misma quepa en la caja.

visible es el valor predeterminado de overflow.


overflow: auto; width: 300px; height: 100px;
<html>
<head>
   <title>Título</title>
</head>

<body>

Cuerpo...

</body>
</html>


overflow: hidden; width: 200px; height: 50px;
Esta capa tiene un contenido mayor del que cabe en el espacio que he asignado con el atributo width y height. Como le he puesto overflow: hidden, lo que ocurrirá es que parte del texto que estoy colocando no se va a ver...


overflow: scroll; width: 300px; height: 100px;
Con overflow scroll salen las barras aunque el texto quepa bien.