html - CSS:垂直对齐文本?

标签 html css

我正在使用以下 HTML:

<p><a href="http://www.example.com/">&larr; Back</a></p>

创建以下内容:

← Back

问题是,左箭头没有在中间垂直对齐。它似乎在下 3 位。

问题:如何使用 CSS 使左箭头在(字母“B”的)中间垂直对齐?


更新:

我可以垂直调整/对齐这个吗:

  1. 不修改我的 HTML,并且
  2. 不使用图片?

最佳答案

箭头是一个简单的字符,所以它像其他字符一样对齐(它在“中间”,字体的创建者希望它在它所在的位置......也许就是这样小写字符的中间)。也许使用另一种字体看起来不一样,也许不是。如果你有一个固定的字体并且看起来很乱,你可以尝试使用 :first-letter选择器(或将箭头包裹在 span 或其他内容中)以将其向上移动 1 或 2 px (position:relative: top:-2px;)。

另一种解决方案是为此使用图像,就像大多数网站所做的那样(那里有 many free icon sets — 我最喜欢的是 famfamfam)

关于html - CSS:垂直对齐文本?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/3912529/

相关文章:

jquery - 为什么说 $ 未定义?

jquery - 与 CSS 作斗争的艰难时期。无法获得背景图像下方的背景颜色

html - Safari 渲染谷歌字体海量

css - 获取一个 div 来遍历整个页面

jquery - 通过在表格上拖动来提醒选定的单元格计数

html - 带有输入文本标签的 border-radius 属性在 Chrome 浏览器中无法正常工作

android - jQuery Mobile + PhoneGap - 侧面板不会在 $(document).height() 上拉伸(stretch);

html - flexbox 中的图像不会在浏览器调整大小时调整大小

html - 如何将粘性导航栏强制为 "overlay"其内容

html - CSS 不适用于 IE 和 Firefox,但适用于 Chrome