以下是一个使用HTML、CSS和JavaScript实现边框溢出和可折叠显示的示例代码：

HTML代码：

  
这是一些内容，当内容溢出时，将显示边框。
  隐藏

CSS代码：

.container {
  position: relative;
  width: 200px;
  height: 200px;
  border: 1px solid gray;
  overflow: hidden;
}

.content {
  width: 100%;
  height: 100%;
  overflow: auto;
  padding: 10px;
}

#toggleButton {
  position: absolute;
  bottom: 10px;
  left: 50%;
  transform: translateX(-50%);
}

JavaScript代码：

window.onload = function() {
  var container = document.querySelector('.container');
  var content = document.querySelector('.content');
  var toggleButton = document.getElementById('toggleButton');

  toggleButton.addEventListener('click', function() {
    if (container.style.height === '200px') {
      container.style.height = 'auto';
      toggleButton.innerHTML = '显示';
    } else {
      container.style.height = '200px';
      toggleButton.innerHTML = '隐藏';
    }
  });
};

该示例中，使用了一个固定大小的容器，当容器中的内容溢出时，将显示边框。点击"隐藏"按钮时，容器的高度会自动调整为适应内容的高度，再次点击时又会恢复到固定的高度。