Как узнать, какой стиль переопределяет другой стиль?

У меня есть версия HTML/CSS сайта (построенная на Bootstrap), которую я переводил в приложение Rails 3.

Конвейер активов сводит меня с ума.

Из-за файла bootstrap_and_overrides.css.scss , который генерируется камнем, существуют конфликты между тем, как он появляется в моем приложении Rails и только в обычных файлах HTML.

Одна из таких вещей, по-видимому, является переопределением некоторых стилей шрифтов.

Например, предполагается, что 1 h3 должен выглядеть.

HTML style

Вот как этот же h3 отображается в моем приложении Rails.

Rails style

Таким образом, проблема с тем, как отображается страница, находится в этих конкретных стилях .... но я не могу понять, почему этот стиль переопределяется.

Мне бы понравились советы о том, как я могу узнать, почему это делается.

Кроме того, одна вещь, которая прослушивает меня, - это media = all в версии Rails на этом скриншоте. Не уверен, что это может повлиять на эти проблемы.

Изменить 1

As @coreyward pointed out, it may have been the order in which my stylesheets are initialized. In my original HTML/CSS files, the Bootstrap & Font-Awesome related CSS are declared before the main.css. But in Rails, it's the opposite way around.

Учитывая, что мое первоначальное объявление в application.html.erb выглядит следующим образом:

<%= stylesheet_link_tag "application", :media => "all" %>

Как изменить порядок этих действий?

Изменить 2

Я использую этот жучок самонастраивающейся системы , и проблема в том, что он не хотите, чтобы вы использовали директиву //= require , поэтому я не могу просто переупорядочить порядок в файле манифеста CSS. Вернее, я не уверен, как это сделать.

Мысли?

1
nl ja de
Hrmm .... интересный момент ... Я мог бы точно перенести перевод. Но проблема в том, что у меня только 1 таблица стилей - application.css.scss , а затем я включил таблицы стилей Bootstrap. Edit1: Кстати, возможно, вы правы. Я замечаю, что в обычной версии HTML вызывается main.css после таблицы стилей, связанных с загрузкой. В Rails это наоборот. Как исправить это, если только что я сделал: <% = stylesheet_link_tag "application",: media => "all"%> в моем макете?
добавлено автор marcamillion, источник
Правильно ... см. Мой обновленный комментарий. Как указать Bootstrap перед моими стилями в Rails?
добавлено автор marcamillion, источник
@Nic Я обновил вопрос, чтобы понять, почему использование файла манифеста CSS не будет работать с моим текущим самоцветом Bootstrap.
добавлено автор marcamillion, источник
Хорошо ... Я изменил драгоценные камни, и я использую самоцвет Bootstrap, который позволяет мне использовать директивы require . Затем я играл с порядком некоторых стилей, и теперь он работает.
добавлено автор marcamillion, источник
@marcamillion. Вы можете сделать это в файле манифеста CSS. См .: CSS в определенном порядке"> stackoverflow. ком/вопросы/8890929/& hellip;
добавлено автор Nic, источник
Консолидация активов не виновата здесь вообще, но если вы не включаете активы в желаемом порядке, которые могут иметь непреднамеренный эффект. Вероятно, вам следует обновить свои знания о том, как стили каскадируются в каскадных таблицах стилей.
добавлено автор coreyward, источник
Все конвейеры активов заключаются в конкатенации и минимизации. Если вы ставите одинаковые специальные селекторы после других, они будут переопределять любые те же свойства. Вот почему вы включаете Bootstrap, прежде чем определять свои собственные стили.
добавлено автор coreyward, источник
@marcamillion. Вы хотите использовать инструкции @import в Sass вместо директив require , и порядок все еще имеет значение. Как выглядит ваш application.css ? И что такое main.css ?
добавлено автор coreyward, источник

2 ответы

media = all означает только включение экрана и печать. Если вам не нравится, как выглядит сайт, когда кто-то его печатает, вы можете просто сделать media = "screen" . Что касается того, почему некоторые из этих стилей так переоцениваются. Удостоверьтесь, что в вашей платежировании активов вы не включаете scaffold.css с кодом require_tree. . Это обычно получает много людей. Кроме того, вам не нужно включать весь файл bootstrap_and_overrides. Вы могли бы просто = потребовать twitter/bootstrap/bootstrap , если хотите только эту часть. Надеюсь, что ты подберешься.

1
добавлено
Yeh У меня нет scaffold.css в моей папке stylesheets. Это сбило меня с толку в прошлом, так что я давно избавился от него. Проблема связана с порядком в файле манифеста. Проблема также в том, что конкретный жук, который я использую (bootstrap-sass), не похож на директивы //= require .
добавлено автор marcamillion, источник
обновил вопрос.
добавлено автор marcamillion, источник

Я переключил камни из bootstrap-sass в twitter-bootstrap-rails , что позволило мне указать порядок директив require .

После игры с правильным порядком директив я наконец нашел тот, который, кажется, исправил мои проблемы.

0
добавлено
Верстка сайтов HTML/CSS/JS/PHP
Верстка сайтов HTML/CSS/JS/PHP
3 439 участник(ов)

Правила группы: напишите !rules в чате. Группа Вк: vk.com/web_structure Freelancer: @web_fl Веб Дизайн: @dev_design Маркетолог: @topmarkening Автор: @M_Boroda

CSS — русскоговорящее сообщество
CSS — русскоговорящее сообщество
1 502 участник(ов)

Сообщество любителей CSS Возникли проблемы с CSS? – пиши сюда, обсудим и предложим самое лучшее решение Работа: @css_ru_jobs Правила: https://teletype.in/@css_ru/r1EWtQ2w7 Приходите в наши чаты @javascript_ru и @frontend_ru Флуд: @css_flood

pro.ruby
pro.ruby
1 181 участник(ов)

Язык программирования Ruby Additional docs: https://rubyreferences.github.io/rubyref/ Invite: https://telegram.me/joinchat/Be4rsT2NuB3CyJaF26j1kA Кто хочет компилировать: @crystal_ru (его синтаксис основан на Ruby) Участник @proDOT

Ruby, Rails, Hanami | dry-rb
Ruby, Rails, Hanami | dry-rb
1 180 участник(ов)

https://telegram.me/rubyjob - Ruby Job По вопросам - @eugene_shved

Чат — Типичный Верстальщик
Чат — Типичный Верстальщик
1 080 участник(ов)

Основной канал: @tpverstak Обратная связь: @annblok Все ссылки на соц.сети проекта: http://taplink.cc/tpverstak ПРАВИЛА ЧАТА — https://teletype.in/@annblok/BygPgC3E7

Ruby School .us
Ruby School .us
1 045 участник(ов)

Чат-болталка для учеников руби-школы и не только. Правила: https://telegra.ph/Pravila-chata-Rubi-shkoly-03-13

Random Ruby Chat
Random Ruby Chat
589 участник(ов)

Правила публикации вакансий: https://t.me/codenamecrud/60865

Rubyata
Rubyata
333 участник(ов)

Коммюнити Ruby и Ruby On Rails Флуд не приветствуются. Вакансии можно публиковать только и ТОЛЬКО по пятницам с хештегом #вакансия.

Ruby Talks
Ruby Talks
236 участник(ов)

Национальная Флеймотека

RubyRush
RubyRush
189 участник(ов)

rubyrush.ru программирование для самых новичков

Веб-Технологи: UI/UX, Вёрстка, Фронтенд
Веб-Технологи: UI/UX, Вёрстка, Фронтенд
167 участник(ов)

Всё про веб-дизайн и вёрстку. А также: HTML, CSS, флекс и бутстрапы, шаблонизаторы, препроцессоры, методологии, аглифаеры, улучшаторы и обфускаторы. Обсуждаем темы юзабилити, устраиваем А/В тесты лендингов, и проводим аудит.

DTP :: @DTPublish
DTP :: @DTPublish
147 участник(ов)

Обсуждаемые темы: полиграфия, препресс, верстка, дизайн, иллюстрации, скрипты, плагины. Канал - @DTPublishing

Rails Chat
Rails Chat
87 участник(ов)

You are welcome to discuss Ruby On Rails development process and other stuff

css_jobs
css_jobs
26 участник(ов)

Чат для вопросов по css и html: @css_ru Флуд: @css_flood Канал с вакансиями и резюме: @css_jobs_feed

css_флуд
css_флуд
10 участник(ов)