html - 如何水平居中对齐div内的跨度

标签 html css

我有一个 DIV 和一个 SPAN。我想将 SPAN 在 DIV 内水平居中。

我试图将它放在 headerRibbon div 的中心,但无论我使用什么代码,它都不起作用。

我正在像这样加载上面显示的移动样式表:

<!-- default stylesheets -->
<link rel="stylesheet" type="text/css" href="theStyles/defaultStyle.css" /><link rel="stylesheet" type="text/css" href="theStyles/captionStyle.css" />

<!-- mobile stylesheets
<link rel="stylesheet" type="text/css" href="theStyles/defaultStyle_mobile.css" media="only screen and (max-device-width: 480px) and (min-device-width : 320px)" /><link rel="stylesheet" type="text/css" href="theStyles/captionStyle_mobile.css" media="only screen and (max-device-width: 480px) and (min-device-width : 320px)" />-->

<link rel="stylesheet" media="screen and (max-width: 480px)" href="theStyles/defaultStyle_mobile.css" /><link rel="stylesheet" media="screen and (max-width: 480px)" href="theStyles/captionStyle_mobile.css" />

<!-- if ie version 9 or less -->

<!--[if lte IE 9]>
<link rel="stylesheet" type="text/css" href="theStyles/defaultStyle_ie.css" /><link rel="stylesheet" type="text/css" href="theStyles/captionStyle_ie.css" />
<![endif]-->

div 在页面加载时向下滑动时显示为block:

enter image description here

我该如何解决?

最佳答案

您需要制作 span display: inline-block; 并制作 div text-align: center; 或制作 span display: inline -block;margin: 0 auto;

关于html - 如何水平居中对齐div内的跨度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22158344/

相关文章:

javascript - 躲避射弹的 Canvas 游戏

css - 相同的字体在 Chrome 与 Firefox、IE 和 Safari 中看起来不同

css - 为什么网格间隙会导致没有百分比的溢出?

html - 按空格键向下滚动页面?

jquery - 是否有一些 HTML 完整的页面编辑器(JQuery、Silverlight 等)?

html - 为覆盖元素创建边框作为具有动态宽度和高度的父元素的子元素

html - 试图删除我的 "<ul>"元素的 margin-right

javascript - 如何在javascript中控制元素的滚动条?

html - 带 Angular Material 的 Pinterest 布局

css - Bootstrap xs 排序与 md 排序