/* 基本样式 */  
body, html {  
    margin: 0;  
    padding: 0;  
    overflow-x: hidden;
    font-family: PingFang SC;  
}  

 /* Wrapper样式 */  
 .wrapper {  
    width: 100%; /* 宽度为视窗宽度的80% */  
    margin: 0 auto; /* 居中显示 */  
    padding: 0px; /* 内边距 */  
    background-color: #FFFFFF; /* 背景色 */  
    box-shadow: 0 0 5px rgba(0,0,0,0.1); /* 盒子阴影 */  
} 
  
header, footer {  
    background-color: #333;  
    color: #fff;  
    font-size: 2em;
    height: 40%;
    text-align: center;   
}  
  
nav ul {  
    list-style: none;  
    padding: 0;  
    text-align: center;  
}  
   
  
/* Flexbox 布局 */  
main {  
    display: flex;  
    flex-wrap: wrap;  
    padding: 10px;  
    width: 100vw;
}  

.container {
    display: flex;
    justify-content: center;
    align-items: center;
} 
  
/* 媒体查询 */  
@media (min-width: 600px) {  
    #main-min{  
        display: none;  
    } 
}   

.div-container {
    display: flex; /* 使用Flexbox布局 */
}
.div-flex {
    flex: 1; /* 每个div占一份 */
    box-sizing: border-box; /* 包括内边距和边框在内的总宽度 */
    padding: 10px;
    margin: 5px;
}
  
p {  
    font-size: 1em; /* 基准字体大小 */  
}  
  
@media (max-width: 599px) {  
    #main-max{  
        display: none;  
    } 
    p {  
        font-size: 0.9em; /* 在小屏幕上减小字体大小 */  
    }  
    main {  
        display: flex;  
        flex-wrap: wrap;  
        padding: 10px;  
        width: 100vw;
    }  
}