你可以只对被包装的文本，即第二行和后续行应用CSS吗？

我想只在被包装的文本上放置一个margin-left，即第一行后面的文本：

This is text with no margin left
     this text has margin left

例点击查看输入和标签是1 div，文本包装在第二行，这就是我想要的但是有可能只在第二行包裹的文本上留下一个边距 jsfiddle我的问题的例子

已邀请:

4 个回复

鲁釜头

是的，有点 - 我建议结合padding-left和text-indent： HTML

<div class="test">
    <label for="2question1">
        <input type="checkbox" id="2question1" name="2question" title="Merknaam 1" /> Very long text which is wrapped on the next line
    </label><br>

    <label for="2question2">
        <input type="checkbox" id="2question2" name="2question" title="Merknaam 2" /> Merknaam 2
    </label><br>

    <label for="2question3">
        <input type="checkbox" id="2question3" name="2question" title="Merknaam 3" /> Merknaam 3
    </label><br>

    <label for="2question4">
        <input type="checkbox" id="2question4" name="2question" title="Merknaam 4" /> Merknaam 4
    </label><br>
</div>

CSS

.test {
    width:200px;
}

.test label {
    display: block;
    padding-left: 1em;
    text-indent: -1em;
}

text-indent仅适用于块级元素中的第一行文本，因此它应该达到您想要的效果。见http://jsfiddle.net/pauldwaite/qUvvv/

逝媳蘑贩茄

不，但你可以将CSS应用到第一行，这样你就可以改变你的想法以达到同样的效果。像这样的东西：

.mytext {margin-left:-5em;}
.mytext:first-line {margin-left:0;}

这是一个JSFiddle的工作示例：http：//jsfiddle.net/4ckxJ/3/ 有关:first-line伪类的更多信息，请参阅http://www.quirksmode.org/css/firstline.html。

辅奈

您可以将要包裹的行包裹在span中并应用：

display: block;
margin-left: 12px;

给它display: block将使它换行到一个新行，并且边距将其推向右边。

烫珊

根据您更新的示例，这是一个fork JSFiddle 浮动输入，然后制作标签显示块，使其浮在它旁边 - 用填充和边距创建的间距，overflow:hidden使文本“不包裹” - 然后你也可能想从你的HTML中删除br

要回复问题请先登录或注册

你可以只对被包装的文本，即第二行和后续行应用CSS吗？

4 个回复

发起人

textwrapping

问题状态

你可以只对被包装的文本，即第二行和后续行应用CSS吗？

与内容相关的链接

4 个回复

发起人

textwrapping

问题状态