[分享]css全屏适应屏幕大小

CSS全屏适应屏幕大小，是指网页的内容自适应屏幕大小重新排版，以达到更好的视觉效果。具体实现方法如下：

 body{
      width: 100%;
      height: 100%;
      background-color: #ccc;
      overflow: hidden;
   }
   
   .container{
      width: 100%;
      height: 100%;
      display: flex;
      justify-content: center;
      align-items: center;
   }
   
   .content{
      width: 80%;
      height: 80%;
      background-color: white;
      border: 1px solid black;
   } 

上述代码中：

1. body样式指定了网页宽度高度均为100%，并设置了背景色，同时指定了溢出内容隐藏；

2. container样式使用了弹性布局，水平垂直居中，所以在其中添加的内容总是居中显示；

3. content样式指定了其中元素的宽度和高度都是container的80%，并添加了一些边框、背景色等效果。

通过上述CSS，我们可以实现一个自适应屏幕大小且居中显示的容器，使网页内容更加美观。