如何创建:图标按钮
如何创建图标按钮
第一步 - 添加 HTML:
添加图标库,例如 font Awesome,并将图标附加到 HTML 按钮上:
Icon buttons:
Icon buttons with text:
第二步 - 添加 CSS:
/* 设置按钮的样式 */
.btn {
background-color: DodgerBlue; /* 蓝色背景 */
border: none; /* 删除边框 */
color: white; /* 白色文本 */
padding: 12px 16px; /* 一些内边距 */
font-size: 16px; /* 设置字体大小 */
cursor: pointer; /* 鼠标悬停时的鼠标指针 */
}
/* 鼠标悬停时背景变暗 */
.btn:hover {
background-color: RoyalBlue;
}
亲自试一试