本文介绍了8 bootstrap3.0特殊效果,包括1。2 3克拉的关闭按钮。快速设置4。区域中心5。清浮浮6。显示或隐藏内容7。用于屏幕阅读器内容8。图像置换,非常实用,是一篇很好的文章,推荐给大家。





本研究的主要内容如下:

1。关闭按钮

2克拉。

三.快速设置浮动

4。中间的内容区域

5。清除浮动

6。显示或隐藏内容

7。用于屏幕阅读器的内容

8。替换图片

9。总结

关闭按钮

模式对话框和警告框可以通过使用由符号关闭的图标来解除模式对话框和警告框。
复制代码如下所示:时间;


克拉

使用插入代表功能和方向的下拉。注意默认的插入自动扭转dropup菜单。
复制代码代码如下所示:


快速设置浮

在这两类让页面元素漂浮。重要的是用来避免一些问题。你也可以使用这两类混合。
复制代码如下所示:…
复制代码如下: / / classes.pull-left {浮动:重要;},{左右拉!浮子:右边!重要的使用作为混合。元;}或{(拉左)};。另一元{。拉右}(;)

不要使用导航栏

如果你是用来校准组件上的导航栏,一定要use.navbar-left or.navbar-right.view详情导航栏的文件。

内容区的中间

设置页面元素来显示:块放在中心设置的边缘。它可以作为混合或类。
复制代码代码如下所示:…
复制代码如下: / /班using.center-block块margin-left: {显示:;汽车;右边距:汽车;} / /混合使用。元(){ }中心块;


清除浮动

使用clearfix清除任何页面元素的彩车。我们用微Clearfix Nicolas Gallagher。它可以作为混合。
复制代码代码如下所示:…
复制代码如下: / /混合本身。Clearfix(前,后):{ },{内容:;显示:表;明确::{是}后;} / /使用mixin。元(Clearfix){ };


显示或隐藏内容

任何页面元素(包括屏幕阅读器)可以强制显示或隐藏的显示and.hidden.the两类使用!为了避免冲突的重要。这两类只能用于块级元素,可作为混合。

隐藏仍然是可用的,但它不影响屏幕阅读器和将被标记为不推荐,因为V3.0.1版本。请使用隐藏or.sr-only。

此外,还可以使用不可见来切换只有一个元素的可见性,这意味着它的显示没有被修改,并且它仍然可以影响文档流中的元素。
复制代码如下所示:…
将代码复制为以下内容:类:!重要的;隐藏的重要的;能见度:无!隐藏!重要的。看不见的可见性:隐藏;} { }; / /使用的混合。元(显示);} { {,}(隐藏。一元);
屏幕阅读器的内容

using.sr-only可以隐藏其他所有设备的屏幕阅读器的一个元素。这类也可以被用来作为一个mixin。
复制代码如下:跳过主要内容
复制代码如下:作为一个mixin / / usage.skip-navigation(。SR){ };
替换图片

using.text-hideclass(也作为一个mixin)可以替换文本内容包含在一个网页元素作为背景图。
复制代码代码如下:自定义标题
复制代码如下:作为一个mixin / /使用。标题(。文本隐藏){ };
总结

本文主要介绍了一些特殊效果,如显示隐藏、删除浮动、关闭按钮等。