Html 我可以按像素在 div 内使用文本对齐吗?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/20951397/
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
Can i use text-align inside div by pixel?
提问by laaposto
Is there any way that i can align the text inside a div
but without using text-align
. I dont want to align it to a specific position(center,left etc) but i want to align it where ever i want by pixel.For example between the values center and left. Also i dont want to use another element inside div
.
有什么方法可以让我在 a 中对齐文本div
但不使用text-align
. 我不想将它对齐到特定位置(中心,左等),但我想通过像素将它对齐到我想要的任何位置。例如在值中心和左边之间。我也不想在里面使用另一个元素div
。
I am looking something like that:
我看起来像这样:
HTML
HTML
<div id="div">TEXT</div>
CSS
CSS
#div{
text-align:220px;
}
Any ideas?
有任何想法吗?
采纳答案by Mr. Alien
If you use margin
or padding
to align the text, they will increase the size of your element as well, if you are aware of the CSS box model behavior, so if you are aligning them using padding
or margin
make sure you use the below
如果您使用margin
或padding
对齐文本,它们也会增加元素的大小,如果您了解 CSS 框模型行为,那么如果您使用padding
或margin
确保使用以下对齐它们
div {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
Though above will count the margin
outside but will consider the padding
and border
inside the element.
虽然上面会计算margin
外部但会考虑元素padding
和border
内部。
Also, if you are looking to align only a single word, than better use text-indent
property which will indent your text to a specific px
you define.
此外,如果您只想对齐一个单词,那么最好使用text-indent
属性将文本缩进到px
您定义的特定位置。
But this will just indent 1st line so if you have a single word than this will suffice your needs, but if you want to align multiple elements, than the best thing to do here is to use span
for each word and than indent it using padding
但这只会缩进第一行,因此如果您有一个单词,这将满足您的需求,但是如果您想对齐多个元素,那么最好的做法是span
对每个单词使用而不是使用缩进padding
回答by enguerranws
Are you looking for text-indent
?
你在找text-indent
吗?
#div{
text-indent: 220px;
}
回答by NoobEditor
No you can not, text-align
gives a general behavior for the text to alignas opposed to px
which is a measuring unit, also, logically speaking....220px
wont tell browser, which side of screen 220px is referring to....
i'll suggest using <p>
or <span>
instead
不,你不能,text-align
给出文本对齐的一般行为,而不是 px
哪个是测量单位,而且,从逻辑上讲......220px
不会告诉浏览器,屏幕的哪一侧 220px 指的是......
我会建议使用<p>
或<span>
代替
#div > span, #div > p{
/*some margin or padding like
margin-left : 220px;
padding-left : 220px;
*/
}
EDIT
编辑
To avoid a tag
inside div
, use :
为了避免tag
内部div
,请使用:
div#cont {
width:300px;
height:400px;
padding-left:150px; /*left-right-top-bottom-depend on ur choice*/
border:1px solid #000;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}