交替註釋使用奇數和偶數類的顏色

我有新的WordPress 2.7的評論循環，我知道你可以簡單地添加.odd和。即便你的CSS得到交替批註顏色，我已經做了：

.odd { background: #ccc; color: #000; } 
.even { background: #bbb; color: #000; }

然而，我有兩種不同的背景 - 淺色和深色 - 用戶可以從選項面板中選擇，因此我需要兩種不同的奇數和偶數版本，因此每種顏色都可以有不同的顏色，如上面的背景顏色在淺色背景下看起來不錯，但對於黑色背景看起來不太好

但是在2.7註釋循環中，奇數和e ven類實際上並不存在於代碼中。如果他們成功了，我已經做了這樣的事情：

$background = get_option('mytheme_background'); 
if ($background== "option1") { echo '<div class="odd-dark">'; } 
if ($background== "option1") { echo '<div class="even-dark">'; } 
if ($background== "option2") { echo '<div class="odd-light">'; } 
if ($background== "option2") { echo '<div class="even-light">'; }

與.odd

所以和在。即便代碼實際上並不在那裏，我怎麼能去有兩個不同.odd和。即便版本CSS？

來源

2012-10-29 Emily Harris

向body-element添加一個類：''。你只需要一次就可以做到這一點，並且可以輕鬆控制顏色方案。 – hakre

以下是關於CSS的提示。您可以將多個類附加到同一個元素。只需使用空格分隔列表。例如，你可以定義一個奇怪的，甚至是明亮的和黑暗的類，然後使用class =「odd light」，class =「even dark」等等。這可以使更簡潔和更靈活的CSS和適用於所有當前瀏覽器。另外，最新的瀏覽器都支持第n個孩子用於設計奇數行和偶數行，而沒有明確地將它們標記爲類。 – GordonM

PHP：

$background = get_option('mytheme_background'); 
// no more - between class names to use specializations of odd/even in CSS 
if ($background== "option1") { echo '<div class="odd dark">'; } 
if ($background== "option1") { echo '<div class="even dark">'; } 
if ($background== "option2") { echo '<div class="odd light">'; } 
if ($background== "option2") { echo '<div class="even light">'; }

和CSS：

/* now specialize 2 variants for each type odd/even * dark/light */ 
.odd.light { background: #ccc; color: #000; } 
.even.light { background: #bbb; color: #000; } 
.odd.dark { background: #ccc; color: #000; } 
.even.dark { background: #bbb; color: #000; }

試試這個。

來源

2012-10-29 18:51:02 CodeAngry

在comments.php中我應該放置那個php代碼？我試着把它放在「if（have_comments（））：」但它不起作用，所以我認爲這是代碼錯誤的地方。 –

@EmilyHarris我以爲你只是需要它的工作權...因爲它有工作錯誤，然後它變得正確。這很複雜。你需要研究一下WordPress。對於一個簡單的評論結構來說很容易，但是如果你有評論的話，這是一個不同的魚羣。考慮去wordpress.stackexchange.com，在你的comments.php中粘貼一些代碼並讓他們看看它。我聞到一個初學者，即使我告訴你如何去做，我不知道你會得到它......如果沒有你的主題的評論代碼，這是非常困難的。 – CodeAngry

您可以結合使用CSS類：

echo '<div class="even option1">'; 
echo '<div class="even option2">'; 
echo '<div class="odd option1">'; 
echo '<div class="odd option2">';

在CSS文件中，指定：

.option1.even { background-color: #bbb; color: black; } 
.option1.odd { background-color: #ccc; color: black; } 
.option2.even { background-color: #222; color: snow; } 
.option2.odd { background-color: #444; color: white; }

或者，你可以申請一個CSS類option1您body元素。如果你以其他方式來標記許多內容與class="option1 …"這是特別有用：

<body class="option1"> 
    <div class="even">…</div> 
</body>

在CSS：

body.option1 .even { /* … */ }

等。請注意，option1和.even之間有一個空格。

來源

2012-10-29 18:58:29 Lumen

'雪白'...真的:)獵人在哪裏？ – CodeAngry

@Claudrian他以黑色爲代表;-) – Lumen

交替註釋使用奇數和偶數類的顏色

回答

相關問題