/* 全局样式 */ body { font-family: Arial, sans-serif; line-height: 1.6; margin: 0; padding: 0; width: 40%; max-width: 1200px; margin: 0 auto; /* 可选:添加一些内边距,让内容不紧贴容器边缘 */ padding: 20px; /* 设置背景颜色为纯白色 */ background-color: #ffffff; color: #333; } @media (max-width: 768px) { body { width: 100%; /* 全屏展示 */ padding: 10px; /* 适当调整内边距 */ } } /* 容器样式 */ .container { width: 40%; max-width: 1200px; margin: 0 auto; /* 可选:添加一些内边距,让内容不紧贴容器边缘 */ padding: 20px; } /* 标题样式 */ h1, h2, h3 { color: #444; } /* 链接样式 */ a { color: #007BFF; text-decoration: none; } a:hover { text-decoration: underline; } /* 表单样式 */ form { background-color: #fff; padding: 20px; border-radius: 5px; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); } /* 按钮样式 */ button { background-color: #007BFF; color: #fff; padding: 10px 20px; border: none; border-radius: 5px; cursor: pointer; } button:hover { background-color: #0056b3; } /* 定义单选按钮容器样式 */ .radio-button-group { display: flex; gap: 10px; /* 按钮之间的间距 */ } /* 定义单选按钮隐藏样式 */ .radio-button-group input[type="radio"] { display: none; } /* 定义单选按钮标签样式 */ .radio-button-group label { padding: 10px 20px; border: 1px solid #ccc; border-radius: 5px; cursor: pointer; } /* 定义单选按钮选中时标签样式 */ .radio-button-group input[type="radio"]:checked+label { background-color: #007BFF; color: white; }