body {
 font-family: 'yahei', sans-serif;
 background-color: #f4f4f4;
 margin:0;
 padding:20px;
}

h1 {
 color: #333;
 text-align: center;
}

form {
 background-color: #fff;
 border-radius:5px;
 box-shadow:0010px rgba(0,0,0,0.1);
 padding:20px;
 max-width:500px;
 margin:0 auto;
}

label {
 font-weight: bold;
 display: block;
 margin:10px 05px;
}

input[type="text"],
textarea {
 width:100%;
 padding:10px;
 border:1px solid #ccc;
 border-radius:5px;
 box-sizing: border-box;
 margin-bottom:15px;
 transition: border-color 0.3s;
}

input[type="text"]:focus,
textarea:focus {
 border-color: #007BFF;
 outline: none;
}

input[type="submit"] {
 background-color: #007BFF;
 color: white;
 border: none;
 padding:10px;
 width: 100%;
 border-radius:5px;
 cursor: pointer;
 font-size:16px;
 transition: background-color 0.3s;
}

input[type="submit"]:hover {
 background-color: #0056b3;
}

pre {
 background-color: #fff;
 border-radius:5px;
 box-shadow:1px 5px rgba(0,0,0,0.1);
 padding:15px;
 max-width:600px;
 margin:20px auto;
 white-space: pre-wrap; /*使文本换行 */
 word-wrap: break-word; /*处理长单词换行 */
}

footer {
 text-align: center;
 margin-top:20px;
 font-size:14px;
 color: #777;
}

hr {
 opacity:0.2; /* 设置透明度，范围从0到1，数值越小越淡 */
}