<!DOCTYPE html>
<html lang="zh-cn"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>处理内容溢出</title><style>#d1{width: 400px;height: 300px;background-color: aqua;/* overflow: hidden; */}#d2{width: 1000px;height: auto;background-color: yellow;}</style>
</head><body><div id="d1">Lorem ipsum dolor sit amet consectetur adipisicing elit. Nisi atque praesentium delectus ullam, illo inciduntquam ex cupiditate ab consequuntur dolor natus. Pariatur quia perferendis, rerum quos corporis est, voluptatenostrum maiores iusto tempora sequi culpa praesentium doloremque, itaque aliquid aspernatur eligendi<div id="d2">Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sunt eligendi optio repellat a totam at pariaturquod ea eveniet mollitia saepe rem, maiores perspiciatis, cumque dolores repellendus corporis iste iustoinventore explicabo asperiores! Hic quisquam laborum similique at ratione quibusdam sequi sapiente ex beataeeos debitis molestias, dolore, ducimus maiores!</div>perspiciatis possimus magni eius atque. Officia doloribus molestias consectetur explicabo ab nemo exercitationemmagnam voluptates, ea eveniet provident adipisci asperiores voluptatem fugit laborum ad. Suscipit cum nemo,autem fuga est nobis esse quaerat tenetur sequi, blanditiis adipisci? Repudiandae molestiae in eum, temporadolorem hic velit. Assumenda distinctio sed ut architecto vel iste deleniti rem nemo, ducimus modi accusamus!</div>
</body></html> 
overflow加入这个属性后，溢出的内容就会消失 如下
overflow - x
水平方向溢出内容的处理方式
overflow - y
垂直方向溢出内容给的处理方
#d1{width: 400px;height: 300px;background-color: aqua;overflow-x: auto;overflow-y: auto;}