我在Reaction项目中使用MUI的Slider组件,如下所示:
<Slider
id={name}
aria-label="Restricted values"
defaultValue={defaultValue}
getAriaValueText={valuetext}
step={step}
value={value}
valueLabelDisplay={valueLabelDisplay}
marks={options}
onChange={onChange}
onClick={triggerValidation || null}
min={min}
max={max}
disabled={disabled}
/>
现在它是html,第一个marksLabel值如下所示:
<span aria-hidden="true" data-index="0" class="MuiSlider-markLabel-jynbEM hiERdh MuiSlider-markLabel MuiSlider-markLabelActive" style="left: 0%;">400</span>
我想要将左侧:0%更改为3%,或者给这个markLabel的第一个也是最后一个实例设置左边距和右边距.
我试过这个:
.MuiSlider-markLabel {
color: #a3b2cc;
&:first-child {
left: 3% !important;
margin-left: 20px;
}
}
但这并不管用.我遗漏了什么?