css - rake assets:precompile > Sass::SyntaxError: Invalid CSS after "padding": expected ";"是 ":20px;"

Question

我在运行

rake assets:precompile RAILS_ENV=staging

然后我得到这个错误堆栈:

rake aborted!
Sass::SyntaxError: Invalid CSS after " padding": expected ";", was ":20px;"
(sass):5108
/home/ubuntu/auto_ful/path/ruby/2.3.0/gems/sass-3.5.6/lib/sass/scss/parser.rb:1278:in `expected'
/home/ubuntu/auto_ful/path/ruby/2.3.0/gems/sass-3.5.6/lib/sass/scss/parser.rb:1208:in `expected'
/home/ubuntu/auto_ful/path/ruby/2.3.0/gems/sass-3.5.6/lib/sass/scss/parser.rb:1203:in `tok!'
/home/ubuntu/auto_ful/path/ruby/2.3.0/gems/sass-3.5.6/lib/sass/scss/parser.rb:804:in `block in try_declaration'
/home/ubuntu/auto_ful/path/ruby/2.3.0/gems/sass-3.5.6/lib/sass/scss/parser.rb:1254:in `rethrow'
/home/ubuntu/auto_ful/path/ruby/2.3.0/gems/sass-3.5.6/lib/sass/scss/parser.rb:809:in `try_declaration'
/home/ubuntu/auto_ful/path/ruby/2.3.0/gems/sass-3.5.6/lib/sass/scss/parser.rb:732:in `declaration_or_ruleset'
/home/ubuntu/auto_ful/path/ruby/2.3.0/gems/sass-3.5.6/lib/sass/scss/parser.rb:697:in `block_child'

但后来我试着回溯错误的确切位置:

sass -c app/assets/stylesheets/**.css*

我收到以下错误消息:

Error: Invalid CSS after "#f0f0f0": expected expression (e.g. 1px, bold), was ";"
        on line 18 of app/assets/stylesheets/ajax-bootstrap-select.css

我在 ajax-bootstrap-select.css 中的 CSS 是

.bootstrap-select .status {
  background: #f0f0f0;
  clear: both;
  color: #999;
  font-size: 11px;
  font-style: italic;
  font-weight: 500;
  line-height: 1;
  margin-bottom: -5px;
  padding: 10px 20px;
}

如何解决？

Answer 1

如错误所述，它紧接在您的背景之后:#f0f0f0 行:

https://www.w3schools.com/css/css_background.asp

如果您只想更改背景颜色，请尝试:

.bootstrap-select .status {
  background-color: #f0f0f0;
  clear: both;
  color: #999;
  font-size: 11px;
  font-style: italic;
  font-weight: 500;
  line-height: 1;
  margin-bottom: -5px;
  padding: 10px 20px;
}

你只是在使用背景，这是一次输入各种背景属性的简写:

Background - Shorthand property To shorten the code, it is also possible to specify all the background properties in one single property. This is called a shorthand property.

The shorthand property for background is background:

Example body { background: #ffffff url("img_tree.png") no-repeat right top; }