Question

我正在尝试将背景图像设置为bootstrap中的row列，但由于某种原因它无法正常工作，index.html文件和图像位于根目录中，我搜索了很多谷歌，但我没有找到解决方案，请帮助，并提前感谢

index.html代码

<div class="row main_row">
        <div class="col-md-2 left_menu">
            <form role="form">
              <div class="form-group">
                <label for="email">Employee ID:</label>
                <input type="email" class="form-control" id="email">
              </div>
              <div class="form-group">
                <label for="pwd">Password:</label>
                <input type="password" class="form-control" id="pwd">
              </div>
              <div class="checkbox">
                <label><input type="checkbox"> Remember me</label>
              </div>
              <button type="submit" class="btn btn-primary">Submit</button>
            </form>
        </div>
        <div class="col-md-10 right_menu">
         123
        </div>
    </div>

css代码：

.right_menu{
    background: url('background_image1.jpg') no-repeat;
   -webkit-background-size: 100% auto;
   -moz-background-size: 100% auto;
   -o-background-size: 100% auto;
    background-size: 100% auto;
}

我做错了什么？

Answer 1

您的图片路径应该与您的.css文件相关。因此，例如，如果您的CSS文件位于文件夹/css/styles.css中且您的图片位于根文件夹（/background_image1.jpg）中，则应将后台网址设置为：

background: url('../background_image1.jpg') no-repeat;

如何在bootstrap中将背景图像设置为行列？

1 个答案: