2016-07-09 9 views
1

偶数か奇数かによって投稿が異なって表示されるTumblrテーマをやってみました。私はこれをまっすぐなHTMLのやり方を知っていますが、私はTumblrコーディングを初めて使う人です。これは私が何を意味するかのようになります。スタイル偶数と奇数Tumblr投稿

Mockup of what I'm looking to accomplish

任意の考え? Tumblrのコード内でこれができるのでしょうか?私は{Block: Post}のものを挿入する方法を知っていますが、Tumblrが投稿を偶数または奇数に分割する方法がわかりません...

+2

私はTumblrテーマのコーディングについては考えていませんが、基本的なCSSアクセスがあれば、[':nth-​​child'](https://www.w3.org/Style/Examples/007 /evenodd.en.html)セレクタ。 JSコードは必要ありません。 –

答えて

1

@Rory McCrossanによると、nth-childはそれを実現する良い方法です。

tr { 
    background: red; 
} 

tr:nth-child(odd) { 
    background: blue; 
} 

https://jsfiddle.net/q710v9h4/

あなたはn番目の子(奇数)または(さえ)n番目の子を行うことができます。 こちらもご覧ください:http://nthmaster.com/

1

Tumblrには、奇数と偶数の投稿専用のブロックがあります。奇数か偶数かに応じて、関連するクラスを投稿に簡単に追加できます。例:

<div class="post {block:Odd}odd{/block:Odd}{block:Even}even{/block:Even}"> 
    ... 
</div> 

これらの奇数および偶数ブロックを使用して、奇数および偶数の特定のCSSをラップすることもできます。