Как переопределить по умолчанию CSS правило стиля Bootstrap

enter image description here Я следующий стиль по умолчанию применяется к моей форме этикетки:Как переопределить по умолчанию CSS правило стиля Bootstrap

@media (min-width: 1200px) 
    .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12 { 
    float: left; 
    }

Так как я могу переопределить его путем не делает {поплавок: нет;}? Если я напишу новый класс, все равно он не забирает его.

Я попробовал: в custom.css:

@media (min-width: 1200px){.form-label-float{float:none;}}

Это не сработало!

HTML:

порядок CSS:

<link rel="stylesheet" type="text/css" href="../css/bootstrap.min.css"/> 
<link rel="stylesheet/less" type="text/css" href="../css/bootswatch.less"/> 
<link rel="stylesheet/less" type="text/css" href="../css/variables.less"/> 
<link rel="stylesheet" type="text/css" href="../css/custom.css"/> 

<div id="passCode"></div> 
    <form class="form-horizontal"> 
<fieldset> 
    <legend style="color:#145FAC">Please Fill in the Online Form</legend> 
    <div class="form-group"> 
     <label for="inputEmail" class="col-lg-2 control-label">Name</label> 
     <div class="col-lg-10"> 
      <input type="text" class="form-control formWidth" id="inputName" placeholder="Nam" /> 
     </div>...</div> 
</fieldset> 
    </form>

источник

2015-06-02 Smitha

вы можете показать HTML, который вы хотите применить это? – AmmarCSE

См. Мой обновленный ответ – AmmarCSE

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

https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity

enter image description here

источник

2015-06-02 06:47:56

Я добавил важный, это не сработало. Все метки перемещены вправо от поля ввода текста формы, хотя оно применяется. – Smitha

Можете ли вы проверить стиль, применяемый к элементу в devTools (хром)? Этот стиль активен или переопределен чем-то другим? –

style float: none активен. – Smitha

Вот некоторые рекомендации, чтобы следовать:

Всегда загружайте custom.css или style.css после базового CSS файл (не реагирует).
Избегайте использования ! Важно если возможно. Это может переопределить некоторые важные стили из базы.
Всегда загружайте самозагрузки-responsive.css после custom.css если вы не хотите потерять медиазапросы .. - должны следовать
Предпочитают изменения требуемых свойств (не все) ...

Если вы загрузите свой собственный файл css перед файлом bootstrap.css, он переопределит ваш собственный стиль.

Я надеюсь, что вы получили ответ на сейчас ..

Мы в нашей организации следовать этим рекомендациям для достижения наилучшей настройки ..

источник

2015-06-02 07:09:08

Если float:none активны, но элемент показывает вправо или влево сторона вы используете display:block или display:table. Я думаю, эта ссылка может помочь вам переписать default bootstrap css https://bootstrapbay.com/blog/customize-bootstrap/

источник

2015-06-02 07:19:05 rana7cse

Попробуйте использовать более высокую специфичность. Для вашего HTML-кода вы можете сделать:

select col-lg-2, select col-lg-10{ 
    float:none; 
}

Это переопределит стили бутстрапа, поскольку имеет более высокую специфичность.

См Overriding styles without !important

источник

2015-06-02 07:40:53 AmmarCSE

Спасибо! Поскольку вы все правильно ответили, я сначала выбирал – Smitha

Как переопределить по умолчанию CSS правило стиля Bootstrap

ответ

Смежные вопросы