Html 在 div 中移动文本而不移动 div

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/6241400/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-29 08:56:24  来源:igfitidea点击:

Moving text around in a div without moving the div

csstexthtmlalignment

提问by robwolff3

I have a div, inside the div is a background image that looks like a button and I have text in the div saying "Home". By default the text is snapped to the top and does not look right. How could I move the text around in the div without moving the div?

我有一个 div,div 里面是一个背景图像,看起来像一个按钮,我在 div 中有文字说“主页”。默认情况下,文本对齐到顶部并且看起来不正确。如何在不移动 div 的情况下在 div 中移动文本?

css file: http://pastebin.com/xrAFMVDd

css 文件:http: //pastebin.com/xrAFMVDd

html file: http://pastebin.com/b5Fubte0

html 文件:http: //pastebin.com/b5Fubte0

回答by Jeff

One way of doing this is to wrap your text in a <p>tag and use CSS attributes topand leftwith position: relativeto specify the position of the text relative to the top left of the div.

一种方法是将文本包裹在<p>标签中并使用 CSS 属性topleftwithposition: relative指定文本相对于 div 左上角的位置。

See an example here: http://jsfiddle.net/zvMKH/

在此处查看示例:http: //jsfiddle.net/zvMKH/

回答by robwolff3

I fixed it by changing the line-heightunder #button1 li a. Worked like a charm! Thanks to everybody that contributed! I really appreciate it!

我通过更改line-heightunder 来修复它#button1 li a。像魅力一样工作!感谢所有做出贡献的人!对此,我真的非常感激!