2016-02-23 2 views
0

У меня есть много таблиц, и вместо того, чтобы всегда давать класс %table.table.table-hover.table-condensed.table-responsive.table-bordered, я могу как-то установить его как %table, который возьмет все остальные опции из application.css.scss?rails bootstrap css оптимизация

Я попытался

.table { 
    .table-responsive; 
    .table-bordered; 
} 

, но он показывает неправильно.

Любые идеи?

+0

Как вы включаете Bootstrap в приложение Rails? Через [официальный] (https://github.com/twbs/bootstrap-sass) камень или какие-то другие средства? –

ответ

1

@extend похоже на решение вашей проблемы. Добавьте следующие строки в: СКС

table { 
    @extend .table, .table-hover, .table-condensed, .table-responsive, .table-bordered 
} 

Будьте осторожны, хотя: @extend сложно и не добавляет свойства из .table, .table-парении, и т.д. для вашего определения «таблицы», но скорее добавляет содержимое блока ко всем местам вашего скомпилированного css, где упоминается любой из других классов.

+0

Отлично работает, спасибо! & можете ли вы сказать мне, как переместить класс кнопки в scss? В настоящее время у меня есть '% td = link_to 'Show', product, class: 'btn btn-mini btn-success glyphicon glyphicon-search''. Я попытался поставить 'class: 'button1'' & scss' @extend .btn, .btn-mini, btn-success, .glyphicon, .glyphicon-search', но это не сработало. Мб что-то с пробелами? –

+0

Вы используете Bootstrap 2? Я пробовал с эквивалентом Bootstrap 3 '.button1 {@extend .btn, .btn-xs, .btn-success, .glyphicon, .glyphicon-search}', он отлично работает. ** Редактируйте ** вы забыли точку до btn-success, я не вижу никакой другой проблемы. –

+0

Работает так! '.btn-mini' не работает, поэтому я обошелся без него –