web-dev-qa-db-fra.com

Une div peut-elle avoir plusieurs classes (Twitter Bootstrap)

Une balise div peut-elle avoir deux classes?

J'utilise Twitter bootstrap, et j'aimerais utiliser deux classes prédéfinies.

L'une est une classe active que j'aimerais utiliser sur un dropdown-toggle dans une barre de navigation.

Quelle est la meilleure façon d’aborder ceci dans le HTML, sans passer outre le css.

htmlcsstwitter-bootstrap
76
FluxEngine

Bien sûr, un div peut avoir autant de classes que vous le souhaitez (ceci concerne à la fois bootstrap et HTML en général):

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

Séparez simplement les classes par l’espace.

Aussi: Gardez à l'esprit que certaines classes bootstrap sont supposées être utilisées pour le même matériel mais dans des cas différents (par exemple - classes d’alignement , vous voudrez peut-être quelque chose d’aligné à gauche, à droite ou centre, mais il doit être un seul d'entre eux) et vous ne devriez pas les utiliser ensemble, sinon vous obtiendriez un résultat inattendu. En gros, ce qui va arriver, c'est que la classe avec le plus haut spécificité sera celui appliqué (ou s'ils ont les mêmes alors ce sera celui défini en dernier sur le CSS). Alors gardez à l'esprit que vous devriez éviter de faire des choses comme celle-ci:

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

Absolument, les divs peuvent avoir plusieurs classes et avec certains composants Bootstrap, vous aurez souvent besoin de plusieurs classes pour fonctionner comme vous le souhaitez. L'application de plusieurs classes de cours est également possible en dehors de bootstrap. Tout ce que vous avez à faire est de séparer chaque classe avec un espace.

Exemple ci-dessous:

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

séparer les classes par un espace.

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

démo: http://jsfiddle.net/wNfcg/

6
Eric Goncalves

Vous pouvez ajouter autant de classes à un élément, mais vous ne pouvez ajouter qu'un seul identifiant par élément.

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

Oui, div peut prendre autant de cours que nécessaire. Utilisez l'espace pour séparer les uns des autres.

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

Je ne suis pas sûr si vous vous posez une question précise sur le bootstrap, c’est-à-dire si ces deux classes peuvent être utilisées ensemble ou si vous ne posez que la question en général?

Vous pouvez appliquer autant de classes que vous le souhaitez à un élément. Il vous suffit de séparer les noms de classes par un espace.

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

Vous pouvez avoir plusieurs sélecteurs css class:

Par exemple:

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

mais un seul id:

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

Un div peut contenir plus d'une classe en utilisant bootstrap ou non

<div class="active dropdown-toggle my-class">Multiple Classes</div>
Pour appliquer plusieurs classes, séparez-les simplement par espace.

Jetez un oeil à ces liens, vous trouverez de nombreux exemples
http://getbootstrap.com/css/
http://css-tricks.com/un-bloat-css-by-using-multiple-classes/

4
Rezaul

l'espace est utilisé pour créer plusieurs classes:

 <div class = "Un Deux Trois"> 
 
 </ div>
0
for