QListWidget中item用qss指定正常状态下padding无效的问题

下面想利用padding来使得item的内容和左边产生一点间距

#m_leftList{
outline:none;
font-size:17px;
}
#m_leftList::item{
height:45px;
outline:none;
color:white;
padding-left:10px;/*指定左边距*/
}

#m_leftList::item:hover,
#m_leftList::item:selected{
background-color:#d23337;/*鼠标滑过或者被选择变红*/
}

可item在正常状态下这个效果并没有生效,不知道是不是qss的bug

这个指定的padding只有在鼠标划过或者item被选择时生效了

如下:

解决方案,通过指定边框border的宽度来替代padding,然后指定边框的颜色为透明

border属性在item正常状态下是会生效的

如下:

#m_leftList{
outline:none;
font-size:17px;
}
#m_leftList::item{
height:45px;
outline:none;
color:white;
border-left:10px solid transparent;/*透明的边框来模拟padding*/
}

#m_leftList::item:hover,
#m_leftList::item:selected{
background-color:#d23337;
}

可以看到,这个空隙在各个状态都有了

--------------------------------------------------------------------

如何指定图片和文本的间距

文本开头增加空格 

----------------------------------------------------------------------

最新结果:

需要指定border后,padding才会生效,不想要border可以将border设为none ,否则padding不生效,但是border一定要写

#m_leftList{
outline:none;
font-size:17px;
}
#m_leftList::item{
height:45px;
outline:none;
color:white;
border:none;/*一定要先指定border,哪怕不用*/
padding:2px 10px;/*然后padding才会生效*/
margin:2px 0px;
}
#m_leftList::item:hover,
#m_leftList::item:selected{
background-color:#d23337;
}

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值