html - 如何在html中行中使用<hr>?

标签 html css

<分区>

我看过很多教程,但没有在任何地方找到解决方案。我在 html 中使用 hr 标签在顶部和底部显示线条,它工作正常。但是当我尝试使用 hr 标签在中心显示线时,它不起作用。我想在中心显示线条,还想在那里显示一些文字。因为我是新手,如果有人帮助我编写一些代码,它很容易学习。

我想展示这样的东西-

------------------------Hello--------------------------

但我希望上面的行是实心形式。

最佳答案

试试这个

UPDATED FIDDLE

HTML

<div>
   <div><hr></div>
   <span> Hello  </span>
   <div><hr></div>
</div>

CSS

div {
  width:300px;
  text-align:center;
  display:table;
}
div > div {
   display:table-cell;
   vertical-align:middle;
}
div > span {
   white-space:nowrap;
}

关于html - 如何在html中行中使用<hr>?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21058673/

上一篇:javascript - .hasClass() 忘记了类分配。为什么?

下一篇:javascript - 在鼠标上使用 jQuery 从左到右背景位置输入幻灯片

相关文章:

java - 如何在 Android 中以自定义布局显示 HTML 页面内容

javascript - 单击时的 Jquery 未获取 textarea 的更新值

javascript - 如何删除不存在或未被任何文档调用的依赖项?

html - 我怎样才能改变这两个 float 按钮的高度

javascript - 使用javascript同步两个div

用于将跨度更改为带有链接的图像的 Javascript 代码停止工作

html - CSS Make div 填充其父元素但不拉伸(stretch)它

javascript - 在 hta 应用程序中使用具有滚动效果的 HTML 和 Javascript 显示当前日期和时间

CSS 导航左侧间隙

javascript - jQuery:动画 Div 在 'Click' 上调整大小