css - Bootstrap 选项卡 : Background image inside tag not streching to 100%

Question

我为 Bootstrap Tab 设置了背景图像，但图像位于中心，没有覆盖整个 Tab。我尝试将 backgroundSize 用作 100%、cover、auto 等，但没有用。我希望粉红色图像覆盖整个选项卡。请帮忙

let tabStyle1 = {
  display: 'inline-block',
  width: 12,
  height: 15,
  backgroundColor: '#FF00FF', // added to check the issue
  backgroundImage: 'url(' + filename + ') ',
  backgroundRepeat: 'no-repeat',
  backgroundPosition: '-0px -10px',
  backgroundSize: '15px 300px'
};
let tab1 = <img src={"./international-emoji/blank.gif"} style={ tabStyle1 }/>
 <Tabs defaultActiveKey={1}>

    <Tab eventKey={1} title={tab1}>
      <ul className="list-panel">
        ...
      </ul>
    </Tab>

Answer 1

当我们在 CSS 文件或样式上附加背景时，我们需要在该标签上提供适当的宽度和高度或所需的宽度和高度。