File size: 1,325 Bytes
bc72e65 84df6bb bc72e65 84df6bb bc72e65 84df6bb bc72e65 84df6bb bc72e65 84df6bb bc72e65 84df6bb bc72e65 84df6bb bc72e65 84df6bb bc72e65 84df6bb bc72e65 84df6bb bc72e65 84df6bb bc72e65 84df6bb bc72e65 84df6bb bc72e65 a9aac31 84df6bb a9aac31 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 | body {
font-family: 'Segoe UI', Arial, sans-serif;
background-color: #f4f6f8;
color: #333;
margin: 0;
padding: 0;
}
.container {
max-width: 900px;
margin: 50px auto;
padding: 30px;
background-color: #fff;
box-shadow: 0 4px 20px rgba(0,0,0,0.1);
border-radius: 10px;
text-align: center;
}
h1 {
margin-bottom: 5px;
}
.subtitle {
margin-top: 0;
font-weight: normal;
color: #666;
}
.input-section, .output-section {
margin: 20px 0;
text-align: left;
}
textarea {
width: 100%;
height: 120px;
padding: 12px;
font-size: 16px;
margin-top: 5px;
border-radius: 6px;
border: 1px solid #ccc;
resize: vertical;
box-sizing: border-box;
}
textarea::placeholder {
color: #888;
opacity: 0.7;
}
button {
display: block;
margin: 15px auto 0 auto;
padding: 12px 24px;
font-size: 16px;
background-color: #4a90e2;
color: #fff;
border: none;
border-radius: 6px;
cursor: pointer;
transition: background-color 0.2s ease;
}
button:hover {
background-color: #357ab8;
}
.output-section pre {
background-color: #f0f0f0;
padding: 15px;
border-radius: 6px;
min-height: 70px;
overflow-x: auto;
}
footer {
margin-top: 40px;
font-size: 14px;
color: #999;
}
|