Как переопределить все CSS для определенного элемента?

У меня есть кнопка, которая из класса начальной загрузки; Я хочу добавить свой CSS к кнопке; но кажется, что заполнение бутстрапа переопределяет мой CSS! Как я могу переопределить CSS Bootstrap в этом случае!Как переопределить все CSS для определенного элемента?

Также я хотел бы упомянуть, что я мог бы переопределить загрузочный CSS, поставив CSS inline! Но это не то, что мне делать! Есть ли лучший способ, которым я могу иметь свой CSS в моем отдельном файле и переопределить CSS bootstrap в этом cas (padding, ...)

Если вам нужно больше пояснений, пожалуйста, дайте мне знать!

PS: Я не хочу менять дополнение CSS для класса btn!

ADDED: myCSS:

.delete_btn{ 
    width: 50px; 
font-size: 8px; 
height: 20px; 
position: relative; 
top: -7px; 
text-align: center; 
padding: 0px 10px 10px 10px; 

}

моя кнопка:

<button id='images[i]['url']' class='btn btn-danger btn-xs delete_btn' >Delete</button>

Благодарности,

источник

2013-11-18 Anonymous

Пожалуйста, покажите ваш код. Вероятно, проблема заключается в специфичности, т. Е. Что один селектор более специфичен, чем другой, и поэтому его переопределяет. – lonesomeday

Вы можете использовать '! Important', но если он не переопределяет загрузочный CSS-код по умолчанию, ваш тег не является достаточно конкретным. Вы включаете CSS после загрузки? –

Вы можете принять некоторые меры, чтобы переопределить стиль:

One убедитесь, что ваш CSS загружается после начальной загрузки.
Два раза напишите свой класс в конце файла.
Три вы можете сделать более конкретный ваш селектор с идентификатором, как id="button" или потомка селекторы как
```
#container .myButtonClass { 
     padding:0px; 
} 
```

Вы можете проверить больше о приоритете определений CSS here и here

источник

2013-11-18 15:05:12 DaniP

-1

Используйте 'важный' в вашем CSS.

Например: Вы хотите, чтобы ваш размера набивки не самонастройки указанного размера, то

.yourClass{ 

    padding:10px !important; 

}

Или

#parentElement .yourClass{ 
padding:10px; 

}

источник

2013-11-18 15:00:36

Практически никогда не рекомендуется использовать '! Important'. Его использование обычно показывает код, нуждающийся в рефакторинге. – lonesomeday

Но это одно из решений для вышеуказанного вопроса, используя простой CSS, а не Java Script. –

Да, в некотором смысле. Но лучшим решением было бы реорганизовать CSS таким образом, что '! Important' не является необходимым. Это * * * решение, но оно, вероятно, не является оптимальным. – lonesomeday

-1

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

источник

2013-11-18 15:02:50 codeepic

См. Мой отредактированный вопрос! –

Вы видите, где вы используете '.delete_btn' в вашем css? Для того, чтобы ваши стили переопределяли стиль начальной загрузки, вам нужно использовать id (специфичность идентификатора 100 против класса 10) для нацеливания на элемент кнопки. Кроме того, ваш идентификатор не должен выглядеть так: 'images [i] ['url']' -> скобки и кавычки не разрешены в идентификаторах. Используйте 'id =" danko_button_override "' или что-то в этом роде, а затем используйте '# danko_button_override' селектор в вашем css, и вы должны быть хорошими. – codeepic

Как переопределить все CSS для определенного элемента?

ответ

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