加载器

0
视频
0
完成
0%
进度
0
分钟
0
完成
0%
进度

Loader 可以翻译成加载器,或者加载工具 .. 它的功能就是告诉用户正在执行的任务需要等一会儿 .. 这里我们先添加一块内容 .. div.ui.segment .. 在它里面添加两个段落内容 .. p .. lorem ..

然后再把 Loader 放进来 .. 可以用一个 div 元素,再加上 ui 还有 loader 这两个类 .. 默认这个加载器会被隐藏起来 ... 让它显示出来的话,可以在这个 loader 上添加一个 active .. 你会看到在这部分内容的中间会显示这个 loader ..

或者我们也可以在这部分内容上应用一个 dimmer .. 这个 loader 可以放到这个 dimmer 里面 .. 用一个 div 元素 .. 显示这个 dimmer 也需要用一个 active .. 然后是 dimmer .. 这样我们就可以去掉在 loader 上的这个 active ..

保存 ... 在内容上会显示一个暗色的半透明的背景 .. 这个就是 dimmer .. 在它上面会显示这个 loader .. 在这个 dimmer 上可以再加上一个 inverted ... 这样会用亮色的半透明背景 .. 复制 .. 在 dimmer 上加一个 inverted ..

它会改变 dimmer 的背景颜色 .. 另外在上面显示的 loader 也会自动变成适合在亮色背景上显示的样式 ..

在这个 loader 上也可以添加点文字 ..

复制一份 .. 在 loader 的元素上添加一个 text .. 然后再加上文字内容 .. 加载中 .. 这样会在加载图标的下面显示这个文字 ..

loader 也支持我们使用表示大小的词去改变它的尺寸 .. 可以是 mini .. small ... medium .. 或者 large ..

加载器《 Semantic UI 元素 》

统计

14696
分钟
0
你学会了
0%
完成

社会化网络

关于

微信订阅号

扫描微信二维码关注宁皓网,每天进步一点