要实现“按钮的边缘仍然有一条浅灰色的线,而其边缘的颜色与背景相同”,可以使用CSS样式来设置按钮的边框颜色和背景颜色。
以下是一个示例代码,演示了如何使用CSS来实现这个效果:
HTML代码:
CSS代码:
.custom-button {
background-color: #f0f0f0; /* 设置按钮的背景颜色 */
border: none; /* 移除按钮的默认边框 */
border-top: 1px solid #f0f0f0; /* 设置按钮上边框的颜色为浅灰色 */
border-bottom: 1px solid #f0f0f0; /* 设置按钮下边框的颜色为浅灰色 */
padding: 10px 20px; /* 设置按钮的内边距 */
cursor: pointer; /* 鼠标悬停时显示手型光标 */
}
通过以上代码,按钮的边缘将会有一条浅灰色的线,而其边缘的颜色与背景相同。
你可以根据需要调整按钮的背景颜色、边框颜色和内边距等样式属性,来适应你的设计需求。