123456789101112131415161718192021222324252627 |
- /* 父容器样式 */
- .container {
- display: flex;
- flex-direction: column; /* 垂直排列 */
- align-items: center; /* 居中对齐 */
- padding: 20px 0; /* 增加上下内边距 */
- margin: 150px 20px 20px 20px; /* 增加顶部外边距 */
- }
- /* 按钮样式 */
- .full-width-button {
- width: 100%; /* 按钮占满宽度 */
- padding: 15px 0; /* 按钮内边距,控制高度 */
- margin: 15px 0; /* 按钮间距 */
- background-color: #3EC01E; /* 按钮背景颜色 */
- color: white; /* 按钮文字颜色 */
- font-size: 18px; /* 按钮文字大小 */
- border: none; /* 去除按钮边框 */
- outline: none; /* 去除焦点边框 */
- text-align: center; /* 文字居中 */
- border-radius: 5px; /* 圆角效果 */
- }
- /* 按钮点击效果 */
- .full-width-button:active {
- background-color: #299A0C; /* 按下按钮时的颜色变化 */
- }
|