如何讓div顏色出現在另一個前面？

我想知道下面的代碼有什麼問題;我想讓內部的div顏色顯示爲外部div顏色的一部分。我用這個百分比輪詢吧：如何讓div顏色出現在另一個前面？

echo '<div style="width:130px; height:20px; background-color:#ecf2f9; overflow:hidden;">'; 

    echo '<div style="width:<?php print $percent1; ?>%; background-color:#ff33cc; position:relative; z-index:3"></div>'; 

    echo '</div>';

或者如果會有另一種解決方案來得到我需要的結果。在此先感謝您的幫助

來源

2015-11-28 M. Nabil

$ percent1的值是多少？ – amir2h

'echo'... <？php ...'你需要看看php如何工作，複製和過去不是答案...... – Blag

這取決於這個選項得到的總票數有多少票。但無論如何，它不是零 –

在你的情況下，它是相對簡單的。只需設置內部div的高度，然後完成;）

DIV沒有默認高度。那就是問題所在。

例子：

echo '<div style="width:130px; background-color:#ecf2f9;">'; 
echo '<div style="width:<?php print $percent1; ?>%; background-color:#ff33cc; height:20px;"></div>'; 
echo '</div>';

你可以看到你的酒吧在這裏一個普通的HTML例子： https://jsfiddle.net/eaz1vbex/

在那旁邊，使用<?php print $percent1; ?>這樣是行不通的，因爲回聲輸出內容而不需要PHP解釋器的進一步解析。如果你想保持上面的代碼風格，你應該將其更改爲繼續遵循之前閱讀：

echo '<div style="width:130px; background-color:#ecf2f9;">'; 
echo '<div style="width:' . $percent1 . '%; background-color:#ff33cc; height:20px;"></div>'; 
echo '</div>';

或者：

echo "<div style='width:130px; background-color:#ecf2f9;'>"; 
echo "<div style='width:$percent1%; background-color:#ff33cc; height:20px;'></div>"; 
echo "</div>";

請爲更好地理解閱讀： http://php.net/manual/en/function.echo.php

提示：

您應該對所有人使用CSS樣式屬性（除了寬度，這是動態的）。不推薦使用樣式標籤，因爲它會使產品生命週期的後期維護和重新設計變得很困難。它也膨脹了輸出。
您可能想要使用某種模板引擎或至少「here document」 - 語法，以便更好地維護標記。

實施例：

echo <<<END 
    <div style="width:130px; background-color:#ecf2f9;"> 
     <div style="width:$percent1%; background-color:#ff33cc; height:20px;"></div> 
    </div> 
END;

實施例與單獨的CSS：

CSS：

.progressBar { width:130px; background-color: #ecf2f9; } 
.progressBar .progress { background-color:#FF33cc; height: 20px; }

PHP：

echo <<<END 
    <div class="progressBar"> 
     <div style="width:$percent1%;" class="progress"></div> 
    </div> 
END;

請參見：https://jsfiddle.net/fchp5aqa/

來源

2015-11-28 12:10:26

我會將高度設置爲100％... – arcs

'echo'<？php print $ percent1; ？>''？ –

謝謝你的幫助。它現在有效。真的很感謝 –

它的工作：我已經設置了height : 20px和你$percent1沒有打印！所以我改變它並修復它。我認爲這足以理解我做了什麼！

echo '<div style="width:130px; height:20px; background-color:red; overflow:hidden;">'; 

echo '<div style="width:'.$percent1.'%; background-color:blue; position:relative; z-index:3; height:20px;"></div>'; 

echo '</div>';

來源

2015-11-28 12:15:03 amir2h

如何讓div顏色出現在另一個前面？

回答

相關問題