What is the best way to indent text in a DIV when it wraps?
So I have a DIV that contains some dynamic text. Let's say I know the text and font-size but I don't know the size of the DIV. I'd like the display of the text in the DIV to be intelligent enough to show indentation when text wraps.
Say my original text looked something like this:
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt
Instead, I want it to look like this:
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt
What's the best way to do this if I don't know the size of the DIV a priori? And what's the best way to do it if I do know the size?
Thanks!
如果我明白你的要求，这适用于我：
div {
padding-left: 2em;
text-indent: -2em;
}
W3C says you just have to use text-indent property.
source
.indentedtext
{
text-align:start;
text-indent:5em;
}
Not sure of the cross-browser support, but you could use the first-line pseudo-element:
p {padding:10px;}
p:first-line {padding-left:0px;}
<p>Hello World, I'm Jonathan Sampson</p>
Would be diplayed as
Hello World I'm
Jonathan
Sampson
Other than that, you could give the element left-padding, and then a negative text-indent.
链接地址: http://www.djcxy.com/p/75534.html