[分享]css全屏大小但是有滚动条

CSS是一个非常强大的工具，可以用来精确控制网页的样式和布局。其中，控制网页的大小和滚动条是很重要的一个方面。以下是一种实现全屏大小但是有滚动条的方法。html, body { padding: 0;...

CSS是一个非常强大的工具，可以用来精确控制网页的样式和布局。其中，控制网页的大小和滚动条是很重要的一个方面。以下是一种实现全屏大小但是有滚动条的方法。

html, body {
  padding: 0;
  margin: 0;
  height: 100%;
}

body {
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

.full-screen {
  min-height: 100%;
  width: 100%;
  position: relative;
}

.content {
  padding: 50px 20px;
} 

首先，我们需要将html和body的大小设为100%。这样可以确保我们的网页能够占据整个屏幕。

接着，我们将body的overflow属性设为auto，这样当内容超过屏幕大小时，浏览器会自动添加滚动条。

然后，我们在网页中创建一个标签，将其类名设为.full-screen。这个标签的最小高度设为100%，宽度设为100%。这样，我们就可以让这个标签占据整个屏幕的大小。

最后，我们可以在.full-screen标签内创建一个标签，将其类名设为.content。这个标签的padding属性可以用来设置网页的内容在屏幕上的位置。

使用以上CSS代码，我们就可以实现一个全屏大小但是有滚动条的网页啦！