分割线即原生html中的<hr>标签。不过semantic-ui中将<hr>美化了一下下。

1、基础分割线

　　需要注意的是分割线只能使用div标签和p标签，不能使用span标签。

<div class="ui divider"></div>

<p class="ui divider"></p>

　　

2、定义水平线

　　经常看到水平线的中间有文字，其实可以使用下面代码实现，但是要注意class中加horizontal，并且要在水平线中间显示的文字写在中间即可。

<div class="ui horizontal divider">or</div>

<p class="ui horizontal divider">center</p>

<div class="ui horizontal divider">end</div>

3、定义竖线

<div class="ui vertical divider">or</div>

　　

semantic-ui 分割线的更多相关文章

  1. Semantic UI – 完全语义化的前端界面开发框架

    Semantic UI 是一个 UI 库,使前端开发更简单,更容易学习.Semantic UI 介绍了许多界面元素.在大多数情况下,只有你需要的元素建立一个自定义的构建可能是最好的. UI 组件分为四 ...

  2. Semantic UI 中文参考手册

    一个拥有友好词汇表的前端框架,完全语义化的前端界面开发框架,为一组开发人员之间共享UI元素配备了规格.使用的词汇(类和ID)相比其它替代品更加简洁,从而降低了学习曲线.有许多HTML元素,UI元素和场 ...

  3. 修改 Semantic UI 的默认字体

    Semantic UI 默认使用的是谷歌提供的字体,并且是直接使用了谷歌的官方链接.由于大家都知道的原因,谷歌网站在国内访问速度很差,甚至根本无法访问,还有就是可能会在离线环境下使用 Semantic ...

  4. 160908、前端开发框架Semantic UI

    简介 网页开发中,CSS控制网页样式.作为测试开发工程师,我个人不太擅长手写CSS.样式微调.兼容浏览器等工作,所以我选择使用成熟的前端框架,可以快速开发出样式美观的网站,也解决了大部分浏览器兼容问题 ...

  5. 目前几款基于html5的前端框架：如Bootstrap、Foundation、Semantic UI 、Amaze UI

    Bootstrap是由Twitter在2011年8月推出的开源WEB前端框架,集合CSS 和HTML,使用了最新的浏览器技术,为快速WEB开发提供了一套前端工具包,包括布局.网格.表格.按钮.表单.导 ...

  6. Semantic UI基础使用教程

    自己今后要使用Semantic UI进行项目开发了,一步步的记录下来,供大家参考,也让自己去简单的学习一下,有空了就会更新一点东西,大家有什么问题可以相互交流一下,文采不是很好,希望大家要多多见谅,这 ...

  7. Semantic UI中的验证控件的事件的使用

    1.Semantic UI中的验证控件,功能挺不错的,中文官网的文档写的都比较详细了,我再这里就不再进行重复了,主要是想说一下它的事件的使用方法,这个可能有部分朋友刚开始接触的时候不太了解 注意看这几 ...

  8. semantic UI first web

    官方文档:https://semantic-ui.com/introduction/getting-started.html semantic  UI: SemanticUI是一款语义化设计的前端开源 ...

  9. webpack 解决 semantic ui 中 google fonts 引用的问题

    semantic ui css 的第一行引用了 google web font api,由于不可告人而又众所周知的原因,这条链接在国内无法访问: @import url('https://fonts. ...

  10. semantic ui框架学习笔记一

    面包屑导航 面包屑导航经常用于多个栏目下的内容管理,是web页面里比较常用的组合.例如: <div class="ui breadcrumb"> <a class ...

随机推荐

  1. 译文——The habits of highly successful people

    1.Morning Routine (早上列行公事) Probably the most common habit ultra-successful people have is they can t ...

  2. 《Java大学教程》—第5章 数组

    5.6 增强的for循环:访问整个数组,读取数组元素,不基于数据下列5.7 数组方法:最大值.求和.成员访问.查找 1.答:P92存储固定个数相同数据类型的一组元素. 2.答:P92所有存储在一个特定 ...

  3. JSP内置九个对象Request请求对象

    jsp内置对象是什么呢? 例如Java语言使用一个对象之前需要实例化(也就是所说的new一个对象),创建对象这个过程有点麻烦,所以在jsp中提供了一些内置对象,用来实现很多jsp应用.在使用内置对象时 ...

  4. 【ZJOI2017】仙人掌

    [ZJOI2017]仙人掌 参考博客:https://www.cnblogs.com/wfj2048/p/6636028.html 我们先求出\(dfs\)树(就是\(dfs\)一遍),然后问题就变成 ...

  5. Scrapy 框架 使用 selenium 爬取动态加载内容

    使用 selenium 爬取动态加载内容 开启中间件 DOWNLOADER_MIDDLEWARES = { 'wangyiPro.middlewares.WangyiproDownloaderMidd ...

  6. Django 中的 日志处理

    日志处理: 上线后必须使用 便于以后的 维护 管理 根据日志 处理 BUG 在 项目中 定义一个 存放日志的 文件夹 log 存放所有 等级 的 日志 配置: 将下面的日志的 配置 写入 django ...

  7. C#多线程の遇见长耗时操作以及多任务（简明记要）

    4.0用         Task.Factory.StartNew(()=>{});4.0以下用  ThreadPool.QueueUserWorkItem(()=>{})4.0以上用 ...

  8. CUDA Fortran for Scientists and Engineers第二版翻译

          下午听朋友说,NV把<CUDA Fortran for Scientists and Engineers>的出版权卖给了国内某出版商.第一反应是我们三翻译的岂不是白翻译了.第二 ...

  9. Spring将Bean导入IOC容器

    @Import 注解可以普通类导入到 IoC容器中. 想要让一个普通类接受 Spring 容器管理,有以下方法 使用 @Bean 注解 使用 @Controller @Service @Reposit ...

  10. [matlab] 15.罚函数降维

    求非线性规划 min f(x)= x(1)^2 + x(2)^2 + 8 s.t. { x(1)^2-x(2)>=0 , -x(1) - x(2)^2 +2 = 0, x(1)>=0 ,x ...