bootstrap3.0风格学习笔记按钮

bootstrap3.0风格学习笔记按钮
在引导程序中,按钮(按钮)有六种不同的方式。默认的按钮样式:按钮。这是必要的风格。有六种不同的方式来展示另一种。分别为:缺省、主要、成功、信息、警告、风险、链接。今天我们要仔细探索按钮样式。
这篇文章主要是关于按钮的风格。

1。选项

2。尺寸

三.活跃的状态

4。禁用状态

5。可用于按钮的HTML标记

6。总结

选项
使用上面列出的类可以快速创建具有样式的按钮。

复制代码代码如下所示:
违约
原发性
成功
信息
警告
危险
链接

大小

你需要一个有不同尺寸的钮扣吗大小不同的按钮可以得到利用。BTN LG,Btn sm,and.btn-xs。

复制代码代码如下所示:

大按钮
大按钮
默认按钮
默认按钮
小按钮
小按钮
额外的小按钮
额外的小按钮
adding.btn-block的按钮使它充满父节点的100%的宽度,和按钮变成一个块级元素(块)。

复制代码代码如下所示:
块级按钮
块级按钮

活跃的状态

当按钮处于活动状态,其表现是压在出版社(底部颜色较深,边缘的框架是更深的,影子是内置),B元素,它是由:活跃。对于元素,它实现了by.active.however,您也可以使用。积极起来,以编程方式使它活跃。
按钮元件

因为活动是一个伪状态,所以它不需要添加,但是当您需要显示相同的外观时,您可以添加。

复制代码代码如下所示:
主按钮
按钮
链接元素

你可以add.activeclass。

复制代码代码如下所示:
首要环节
链接
你可以把它和上面的按钮比较一下。
禁用状态

一个可点击的效果可以通过按钮的背景颜色50%衰落过程介绍
按钮元件

添加禁用属性

复制代码代码如下所示:
主按钮
按钮

你可以点击按钮上的鼠标点击效果。
浏览兼容性

如果你添加禁用的属性、Internet Explorer 9和更低版本的浏览器会在按钮灰色绘制文本,并有恶心的影子。没有办法解决这个问题。
链接元素

对add.disabledclass。

复制代码代码如下所示:
首要环节
链接

这与上面的按钮形成对比。

我们使用。残疾人作为一种工具类,就像Activeclass,所以我们不需要增加前缀。
链接功能不受影响

上面提到的类只是变化的外观,不影响函数。在这个文档中,我们通过Javascript代码禁用链接的默认函数。
具体用法

而按钮类可以使用onandelements,onlyelements支持在我们的

可用于按钮的HTML标记

可以为元素或元素添加按钮类。

复制代码代码如下所示:
链接
按钮
跨浏览器的性能

作为最佳实践,我们强烈建议尽可能使用元素以确保跨浏览器的一致性风格。

由于其他原因,这个Firefox的bug阻止我们设置基于标签的按钮的行高,这会导致Firefox与其他按钮不一致。

总结

这个部分的主要内容是按钮按钮的样式。
免责声明:本网信息来自于互联网,目的在于传递更多信息,并不代表本网赞同其观点。其原创性以及文中陈述文字和内容未经本站证实,对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺,并请自行核实相关内容。本站不承担此类作品侵权行为的直接责任及连带责任。如若本网有任何内容侵犯您的权益,请及时联系我们,本站将会在24小时内处理完毕。
相关文章
返回顶部