Question

我尝试使用渐变LESS Bootstrap mixin的背景图片，但它无法正常工作，我已将所有Bootstrap .less文件导入{{1导入我的style.less的文件（此文件）。每当我执行以下grunt任务运行程序时，都不会编译theme.less文件。我有这段代码：

theme.less

我也尝试过：

@base-url: '../img/backgrounds';

body {
  background: #gradient.directional(#333; #000; 45deg), url('@{base-url}/bus.jpg'), no-repeat center center fixed; /* fallback */
  background-size: cover;
  overflow-x: hidden;
}

在第二个例子中，编译器说我有一个＆＃39;）＆＃39;在第9行第49栏中缺失

Answer 1

我现在得到它，我需要做的就是在“bootstrap / mixins / gradients”文件夹中修改bootstrap gradients mixin文件，我更改了mixin的名称并使用背景图像完成了我自己的名称。像这样：

mymixins.less文件：

  /vehicles:
    post:
      summary: Creates a vehicle
      description: Adds a new vehicle of given type.
      parameters:
        - name: vehicle (what is the purpose of this????)
          in: body
          description: The vehicle to create.
          schema:
            required:
              - type
              - speed
              - color
            properties:
              type:
                type: string
              speed:
                type: interger
              color:
                type: string
              wingspan:
                type: string
              tiresize:
                type: string
      responses:
        204:
          description: Vehicle succesfully created.
        400:
          description: Vehicle couldn't have been created.

我的theme.less文件：

@base-url: '../img/backgrounds';

#gradient1 {
    .directional1(@start-color: rgba(255,255,255, 1); @end-color: rgba(0,0,0,1); @deg: 45deg) {
        background-repeat: repeat-x;
        background: -webkit-linear-gradient(@deg, @start-color, @end-color),url('@{base-url}/bus.jpg'), no-repeat center center fixed;  // Safari 5.1-6, Chrome 10+
        background: -o-linear-gradient(@deg, @start-color, @end-color), url('@{base-url}/bus.jpg'), no-repeat center center fixed; // Opera 12
        background: linear-gradient(@deg, @start-color, @end-color), url('@{base-url}/bus.jpg'), no-repeat center center fixed; // Standard, IE10, Firefox 16+, Opera 12.10+, Safari 7+, Chrome 26+
    }
}

使用背景图像将LESS Bootstrap mixin添加到身体

1 个答案: