仅使用CSS调整其中一个Div的高度

Question

我正在努力实现这种形状。

我当前的CSS给我的形状像。

我唯一坚持的是减少第一个灰色条的高度。所有3个灰色条都有相同的类（.ward），我不能使用任何javascript或内联样式来调整第一个矩形（病房）的高度。如何更新第一病房的高度？

这是我的HTML代码段：

<div id="stem"></div>
<div id="wards">
    <div class="ward"></div>
    <div class="ward"></div>
    <div class="ward"></div>
</div>

Answer 1

如果你添加这个css选择器，如果只适用于第一个病房类。

.ward:first-child{
    height: 6px !important
}

有关第一个子选择器的更多信息 - http://www.w3schools.com/cssref/sel_firstchild.asp

您可以使用的所有选择器的良好列表 - http://www.w3schools.com/cssref/css_selectors.asp

Answer 2

如果我理解你的问题。添加另一个类并不违反内联样式的规则（特别是如果你在一个单独的CSS文件中这样做）。为什么不尝试给第一个＆＃34; ward＆＃34 ;它是自己的CSS类。

如

QListWidgetItem

和

QWidget* newPicture = new QWidget;
yadda yadda yadda (....)
int currentRowWidth = ui->listWidgetZdjeciaModelu->findChild<QWidget*>(objectName)->width(); //gets max width of rzadKontener, which fills the entirety of the row - it equals the QListWidgetItem's width
int newWidth = currentRowWidth + 225; //225 is a fixed width of newPicture 
ui->listWidgetZdjeciaModelu->item(0)->setSizeHint(QSize(newWidth, 200));

ui->listWidgetZdjeciaModelu->findChild<QWidget*>(objectName)->layout()->addWidget(newPicture );

如果你的问题更多的是问题; ＆＃34;我可以改变这个div，使用另外两个使用的这个类。但是，同一类的属性需要与其他两个属性不同。我不相信你可以。

希望这有帮助。