插入div後的CSS縮進段落？

我的目標：除了.firstCharacter之後的所有段落都縮進。插入div後的CSS縮進段落？

我在頁面的某些部分的第一段有一個下拉帽。我已經第一個使用縮進後設置所有的段落標記...

.storyContainer p + p { 
    text-indent: 1.5em; 
    margin-top: 0 
}

我使用我的設置下沉......

.firstcharacter { 
    float: left; 
    font-size: 80px; 
    line-height: 60px; 
    padding-top: 4px; 
    padding-right: 8px; 
    padding-left: 3px; 
    font-family: 'Droid Serif', serif; 
}

我的HTML是這樣的...

<div class="headline">This is a headline!</div> 

<p><span class="firstcharacter">T</span>his text NOT indented because it's first</p> 
<p>This text will be indented because it's second.</p> 
<p>This text will be indented because it's third.</p> 

<div class="someBox">This is some extra box</div> 

<p>I want this to be indented but it won't be because it is first after the box!</p> 
<p>This text will be indented because it's second.</p> 

<div class="headline">This is a headline!</div> 

<p><span class="firstcharacter">T</span>his text NOT indented because it's first</p> 
<p>This text will be indented because it's second.</p> 
<p>This text will be indented because it's third.</p> 

<div class="someBox">This is some extra box</div> 

<p>I want this to be indented but it won't be because it is first after the box!</p> 
<p>This text will be indented because it's second.</p>

任何幫助如何擺脫這個擺脫？

謝謝！

來源

2013-02-15 Layne

堅持下去，認爲你的「目標」是不合時宜的。這聽起來像你真正的意思是'除了第一個兄弟以外的所有段落.firstCharacter' – crush 2013-02-15 19:54:18

老實說，我認爲最可靠的方法是將一個類添加到你想要縮進的'p'中。 – steveax 2013-02-15 20:02:32

http://jsfiddle.net/WRKxQ/

HTML：

<div class="headline">This is a headline!</div> 
<p class="firstcharacter"><span>T</span>his text NOT indented because it's first</p> 
<p>This text will be indented because it's second.</p> 
<p>This text will be indented because it's third.</p> 
<div class="someBox">This is some extra box</div> 
<p>I want this to be indented but it won't be because it is first after the box!</p> 
<p>This text will be indented because it's first.</p> 

<div class="headline">This is a headline!</div> 

<p class="firstcharacter"><span>T</span>his text NOT indented because it's first</p> 
<p>This text will be indented because it's second.</p> 
<p>This text will be indented because it's third.</p> 
<div class="someBox">This is some extra box</div> 
<p>I want this to be indented but it won't be because it is first after the box!</p> 
<p>This text will be indented because it's first.</p>

CSS：

p { 
    text-indent: 1.5em; 
    margin-top: 0 
} 

.firstcharacter { 
    text-indent: 0; 
} 

.firstcharacter span { 
    float: left; 
    font-size: 80px; 
    line-height: 60px; 
    padding-top: 4px; 
    padding-right: 8px; 
    padding-left: 3px; 
    font-family:'Droid Serif', serif; 
}

這應該解決的呢？

我基本上只是把你的css和html稍微改了一下。

樂趣

雅舍

來源

2013-02-15 20:04:30 jascha

爲了您的第一線，你可以使用p::first-line{}縮進它。對於您的第一個字符，您可以使用p::first-letter。對於IE < 9，您只需要使用一個冒號。

要選擇第一個段落之後的所有段落，可以使用nth-child（n）僞類。

來源

2013-02-15 20:12:45 Rob

插入div後的CSS縮進段落？

回答

相關問題