Может ли div иметь несколько классов (Twitter Bootstrap) [duplicate]

73

Может ли тег div иметь два класса?

Я использую twitter bootstrap, и есть два предопределенных класса, которые я хотел бы использовать.

Один из них - это класс active, который я хотел бы использовать в dropdown-toggle в пределах панели навигации.

Каков наилучший способ приблизиться к этому в html, без переопределения css.

9 ответов

122
Лучший ответ

Конечно, у div может быть столько классов, сколько вы хотите (это касается как начальной загрузки, так и HTML в целом):

<div class="active dropdown-toggle"></div>

Просто разделите классы по пробелам.

Также: имейте в виду, что некоторые классы начальной загрузки должны использоваться для одного и того же материала, но в разных случаях (например, классы выравнивания, вы можете захотеть что-то выровнять по левому, правому или по центру, но это должен быть только один из них), и вы не следует использовать их вместе, иначе вы получите неожиданный результат, в основном, то, что произойдет, это то, что класс с наивысшей специфичностью будет применен (или, если они имеют то же самое, то это будет тот, который определил последний на CSS). Так что имейте в виду, что вы должны избегать таких вещей:

<p class="text-center text-left">Some text</p>
8

Абсолютно, divs может иметь более одного класса, а с некоторыми компонентами Bootstrap вам часто нужно иметь несколько классов для того, чтобы они функционировали так, как вы хотите. Применение нескольких классов, конечно, возможно и вне бутстрапа. Все, что вам нужно сделать, это разделить каждый класс на пробел.

Пример ниже:

<label class="checkbox inline">
   <input type="checkbox" id="inlineCheckbox1" value="option1"> 1
</label>
6

отделяйте классы пробелом.

<button class="btn btn-success dropdown-toggle active" data-toggle="dropdown">Success <span class="caret"></span></button>

demo: http://jsfiddle.net/wNfcg/

5

Вы можете добавить столько элементов к элементу, но вы можете добавить только один идентификатор на элемент.

<div id="unique" class="class1 class2 class3 class4"></div>
5

Да, div может принимать столько классов, сколько вам нужно. Используйте пространство для разделения друг от друга.

 <div class="active dropdown-toggle custom-class">Example of multiple classses</div>
5

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

Вы можете применить столько классов к элементу, сколько хотите, просто разделите имена классов с помощью пробела

<div class="active dropdown-toggle"></div>
4

У вас может быть несколько селекторов css class:

Например,

<div class="col-md-4 a-class-name">
</div>

но только один id:

<div id = "btn1 btn">  <!-- this is wrong -->
</div>
4

Div может содержать более одного класса, используя либо bootstrap, либо не

<div class="active dropdown-toggle my-class">Multiple Classes</div>
Для применения нескольких классов просто разделяйте классы по пробелам.

Взгляните на эти ссылки, вы найдете много примеров
http://getbootstrap.com/css/
http://css-tricks.com/un-bloat-css-by-using-multiple-classes/

0

пробел используется для создания нескольких классов:

<div class="One Two Three">

</div>
  • 5
    Это действительно ничего не добавляет к ответам, которые были опубликованы более года назад.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню