如何在不更改div的顏色的情況下更改此信息面板的顏色？

在此頁面上，您將在左側的側面板中看到一個博客文章，其中包含縮略圖，標記集和其他信息：http://www.elegantthemes.com/preview/TheStyle/2010/10/morbi-rutrum-interdum-justo/。如何在不更改div的顏色的情況下更改此信息面板的顏色？

我想要做的是在這個白色的div上創建一個黑色的矩形，這個黑色的矩形從白色div的左上角延伸到文本底部的左側。

起初，我試着簡單地創建一個像素寬的雙色圖像，並使用repeat-y來從上到下擴展「仿兩列」佈局。然而，這個div動態調整大小，所以在很多情況下，帖子中的黑色文本最終會跑到這個側邊欄中。

然後我試着以相同的方式使用相同的圖像，但給白色div一個「位置：絕對」的特質。這導致右側的側邊欄溢出到帖子內容上。

我想創建這個黑色的矩形來佔據發佈內容左側的任何空格。

我繼承了很多CSS，我不知道如何改變。任何建議將不勝感激。 `

我會在這裏添加style.CSS文件，如果我可以找到某種方式這樣做。這是我第一次在網站上。

來源

2011-06-28 user811491

你可能會展示你想要的圖片嗎？ –

很難破譯你想要做什麼，但看這有助於：

.post-content.info-panel { 
    background-color: black; 
    padding: 4px; 
    width: 28%; 
}

來源

2011-06-28 20:39:31 tybro0103

基本上，我試圖把infopanel放到一個與白色div相同高度的黑色列中，在帖子內容的左邊。 – user811491

展望CSS，它說，你說的一切都是自己的專區內：

<div class="info-panel">

就這樣說，你只需要對你的CSS進行更改即可。你會做這樣的事情：

.info-panel { 
    background-color: #000; 
}

但要記住的是，它看起來不錯，你應該用填充和利潤的信息面板和內容類別後發揮好。

我只是使它看起來更好，通過包括以下保持相同的總寬度：

.post-content { 
    background: url("images/entry-bottom-bg.png") repeat-x scroll left bottom transparent; 
    padding: 0 4% 30px 1%; 
} 

.info-panel { 
    background: none repeat scroll 0 0 #000000; 
    float: left; 
    margin-right: 1%; 
    padding: 2% 0 2% 2%; 
    width: 29%; 
}

最後兩個代碼的CSS代碼片段都只是一些建議。我會做什麼，如果我的解決方案爲您。不代表你有，所以請不要這樣對待它。它只是讓該地區看起來很糟糕。

來源

2011-06-28 20:41:49 bdrelling

如何在不更改div的顏色的情況下更改此信息面板的顏色？

回答

相關問題