Переменная в файле css?

Question

Я использую рельсы 4

Это часть моего файла CSS:

.parallax-image-2 { 
    background: url('/assets/tuscany.jpg'); 
    background-size: cover; 
    -webkit-background-size: cover; 
    -moz-background-size: cover; 
    -o-background-size: cover; 
    background-size: cover; 
    background-attachment: fixed;/* IE FIX */ 
} 

Как я могу использовать переменную в файле CSS? Это возможно? Как этот

.parallax-image-2 { 
    background: url('/assets/#{@region.name}'); 
    background-size: cover; 
    -webkit-background-size: cover; 
    -moz-background-size: cover; 
    -o-background-size: cover; 
    background-size: cover; 
    background-attachment: fixed;/* IE FIX */ 
} 

спасибо ... REMCO

Answer 1

Rails 3.1+ трубопроводов активов позволяет нам возможность использовать хелперы активов в CSS файлах. Теперь рубиновый анализатор может решить некоторые проблемы, например. путь изображения. Вам просто нужно добавить .css.erb вместо .css в качестве расширения файла стилей.

.my_class { 
    background-image: url(<%= asset_path 'my_image.png' %>); 
} 

.my_class1 { 
    background: url(<%= asset_data_uri 'logo.png' %>) 
} 

Read more о трубопроводе активов.

Answer 2

активы

Суть в том, что если вы не тонирование ваших активов одноранговой (не статический), то самый расширяемый & надежный способ для достижения этой цели является создание различных классов (идентификаторы) для каждого регион

Я ответил на вопрос @Raj, потому что это зависит от использования кода ERB в вашем CSS. В то время как это будет хорошо, если файл загружен одноранговой, он будет не работать, если вы перекомпилировать свои активы (следовательно, загружая их статически)

-

SCSS

Я бы лично использовать SCSS Rails preprocessor:

#app/assets/stylesheets/application.css.scss 
.parallax-image { 
    $regions: tuscany lombardy campania; 
    @each $region in $regions { 
     $i: index($regions, $region); 
     &.#{$i} { 
      background: asset_url('#{$region}.jpg'); 
     } 
    } 
} 

Это позволит вам позвонить:

<% @regions = %w(tuscany lombardy campania) 
<% @regions.each do |region| %> 
    <a href="#your_link" class="parallax-image #{region}"> 
<% end %> 

-

Это лучший способ добиться того, что вы хотите, как это будет работать даже с asset precompilation

Вы должны помнить, что CSS является передний конец, а это означает, что не будет вообще поддаются коду Ruby/Rails. В конце концов, это всего лишь система стилей