可以使用text-indent
属性将第一行文本缩进到左角的任一侧。考虑这个例子:
h1 { text-indent: -200px; margin-left: 200px; }
<h1>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris vehicula molestie imperdiet.</h1>
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Mauris vehicula molestie
imperdiet.
|---------- 200px ----------+------ 100% - 200px ------|
|-------------------------->| left margin
|<--------------------------| negative text indent
反过来有没有诀窍呢?
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Mauris vehicula molestie
imperdiet.
|------ 100% - 200px ------+---------- 200px ----------|
我想要的是文本的第一行(并且只有第一行)延伸超过左边缘200px。也许有一个类似的CSS属性,它在右边缘应用缩进或适用于第二行和后一行文本。
答案 0 :(得分:0)
text-indent可能来自父母。用填充物。
#wrapper {
width: 300px;
text-indent: -200px;
padding-left:200px;
}
h1 {
background: lime;
display:inline;
}
答案 1 :(得分:0)
这是你想要的吗?
h1.other-way-round {
margin-left: 0px;
text-indent:0px
}
第二种方法
h1.other-way-round{
text-indent:0;
position:relative;
width:100%;
left:-200px;
}
答案 2 :(得分:0)
当我解读时你的预期结果是这样的:
Lorem ipsum dolor sit amet, consectetur
adipiscing elit.
Mauris vehicula
molestie imperdiet.
最简单的方法可能是使用Javascript。 您可以检测第二行和过去的行,并使用200px的填充右侧围绕它们换行标记。
您可能需要使用jQuery或simmilar来执行此操作。
很难设置宽度/高度,也不能填充:first-line
伪元素。