 /* CSS基础样式 */  
 body {   
    background-image: url(图片\pexels-photo.webp); 
    margin: 0;    
    padding: 0;    
    font-family: Arial, sans-serif;    
    /* display: flex; （如果不再需要垂直居中，可以移除）*/  
    /* justify-content: center; （如果不再需要垂直居中，可以移除）*/  
    /* align-items: center; （如果不再需要垂直居中，可以移除）*/  
    /* height: 100vh; （如果不再需要视口高度，可以移除）*/  
    background-color: #f5f5f5;    
    /* 如果需要滚动条，可以添加 overflow-y: auto; */  
}    
  
/* 网页版式（垂直变长） */  
.content-wrapper {    
    min-height: 2300px; /* 设置一个最小高度 */  
    display: flex; /* 如果需要垂直居中内容，则添加此属性 */  
    flex-direction: column; /* 垂直方向上的flex容器 */  
    justify-content: center; /* 内容在垂直方向上居中 */  
    align-items: center; /* 子项在交叉轴上居中（对于单行flex容器，等同于justify-content）*/  
    padding: 20px; /* 添加一些内边距 */  
    text-align: center; /* 水平居中 */  
    /* overflow-y: auto; 如果需要垂直滚动条，可以添加此属性 */  
}  
  
  
    /* 网页文本样式 */  
    .text-sample {  
        font-size: 60px;  
        color: #333;  
    }  
  
    /* 超链接样式 */  
    a {  
        text-decoration: none;  
        color: #ff000d;  
        transition: color 0.3s ease; 
        font-size: 40px;  
    }  
  
    a:hover {  
        color: #1100ff;  
    }  
  
    /* 网页图片样式 */  
    .image-sample {  
        width: 300px;  
        height: auto;  
        border-radius: 5px;  
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);  
    }  
  
    /* 列表样式 */  
    .list-sample {  
        list-style-type: none;  
        padding: 0;  
    }  
  
    .list-sample li {  
        margin-bottom: 10px;  
    }  
  
    /* 表格样式 */  
    .table-sample {  
        width: 100%;  
        border-collapse: collapse;  
    }  
  
    .table-sample th, .table-sample td {  
        border: 1px solid #ddd;  
        padding: 8px;  
        text-align: left;  
    }  
  
    /* 表单样式 */  
    .form-sample {  
        width: 300px;  
    }  
  
    .form-sample label, .form-sample input {  
        display: block;  
        margin-bottom: 10px;  
    }  
  
    /* 网页版式（居中） */  
    .content-wrapper {  
        text-align: center; /* 水平居中 */  
    }  