【django】class='btn' btn按钮样式
Button
目录
- 基本使用
- 按钮状态
- 按钮尺寸
- 块级显示
- 按钮 Icon
基本使用
默认样式
在要应用按钮样式的元素上添加 .am-btn，再设置相应的颜色。
.am-btn-default- 默认，灰色按钮.am-btn-primary- 蓝色按钮.am-btn-secondary- 浅蓝色按钮.am-btn-success- 绿色按钮.am-btn-warning- 橙色按钮.am-btn-danger- 红色按钮.am-btn-link
Copy
默认样式 主色按钮 次色按钮 绿色按钮 橙色按钮 红色按钮 链接 应用按钮样式的链接
链接
应用按钮样式的链接圆角按钮
在默认样式的基础上添加 .am-radius class.
Copy
默认样式 主色按钮 次色按钮 绿色按钮 橙色按钮 红色按钮
椭圆形按钮
在默认样式的基础上添加 .am-round class.
Copy
默认样式 主色按钮 次色按钮 绿色按钮 橙色按钮 红色按钮
按钮状态
激活状态
在按钮上添加 .am-active class。
Copy
激活状态 激活状态
链接按钮激活状态 链接按钮激活状态
链接按钮激活状态
链接按钮激活状态禁用状态
在按钮上设置 disabled 属性或者添加 .am-disabled class。
Copy
禁用状态 禁用状态
链接按钮禁用状态 链接按钮禁用状态
链接按钮禁用状态
链接按钮禁用状态IE9 会把设置了 disabled 属性的 button 元素文字渲染成灰色并加上白色阴影，CSS 无法控制这个默认样式。
按钮尺寸
.am-btn-xl.am-btn-lg.am-btn-default.am-btn-sm.am-btn-xs
Copy
按钮 - xl 按钮 - lg 按钮默认大小 按钮 - sm 按钮 - xs
按钮 - xl 按钮 - lg 按钮默认大小 按钮 - sm 按钮 - xs
块级显示
添加 .am-btn-block class。
Copy
块级显示的按钮块级显示的按钮
按钮 Icon
使用 Icon 之前需先引入 Icon 组件。
Copy
设置 结账 加载中 下载片片
结账
Issue 列表
- 建议将链接按钮访问后的样式统一改为白色