100字范文,内容丰富有趣,生活中的好帮手!
100字范文 > 自定义按钮样式

自定义按钮样式

时间:2022-07-13 10:26:17

相关推荐

自定义按钮样式

代码如下:

<!doctype html><html><head><meta charset="utf-8"><title>自定义按钮样式</title></head><style>.btn{background-color:gray; /* Green */border: none;padding: 8px 30px;text-align: center;text-decoration: none;display: inline-block;font-size: 12px;border-radius: 5%;}.btn-hong{background: #EC2F32;color: white;}.btn-lan{background: #5897F8;color: white;}.btn-cheng{background: #FF9E00;color: white;}</style><body><div style="background: #BDBCBC;height: 35px;"><button class="btn btn-hong">红</button><button class="btn btn-lan">蓝</button><button class="btn">灰</button><button class="btn btn-cheng">橙</button></div></body></html>

效果图:

要善于用公共样式对重复属性进行编辑,然后对按钮进行单独编辑,Bootstrap插件就是这样对按钮进行编辑的

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。