Programing

div에 여러 클래스가있을 수 있습니까 (Twitter Bootstrap)

lottogame 2020. 10. 12. 07:06
반응형

div에 여러 클래스가있을 수 있습니까 (Twitter Bootstrap)


이 질문에 이미 답변이 있습니다.

div 태그에 두 개의 클래스가있을 수 있습니까?

트위터 부트 스트랩을 사용하고 있으며 사용하고 싶은 사전 정의 된 클래스가 두 개 있습니다.

하나는 탐색 모음 내 active에서 사용하려는 클래스입니다 dropdown-toggle.

CSS를 재정의하지 않고 html에서 이에 접근하는 가장 좋은 방법은 무엇입니까?


물론, div는 원하는만큼의 클래스를 가질 수 있습니다 (일반적으로 부트 스트랩과 HTML에 관한 것입니다).

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

클래스를 공백으로 분리하십시오.

또한 : 일부 부트 스트랩 클래스는 동일한 작업에 사용되어야하지만 다른 경우 (예 : 정렬 클래스 , 왼쪽, 오른쪽 또는 가운데 정렬을 원할 수 있지만 그중 하나만 있어야 함 ) 함께 사용해서는 안됩니다. 그렇지 않으면 예상치 못한 결과를 얻을 수 있습니다. 기본적으로 가장 높은 특이성가진 클래스가 적용되는 클래스 가 될 것입니다 (또는 동일한 클래스가있는 경우 마지막에 정의 된 클래스가됩니다). CSS에서). 따라서 다음과 같은 작업은 피해야합니다.

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

물론, div는 둘 이상의 클래스를 가질 수 있으며 일부 Bootstrap 구성 요소를 사용하면 원하는대로 작동하려면 여러 클래스가 필요할 수 있습니다. 물론 여러 클래스를 적용하는 것은 부트 스트랩 외부에서도 가능합니다. 각 클래스를 공백으로 구분하기 만하면됩니다.

아래 예 :

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

클래스를 공백으로 구분하십시오.

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

데모 : http://jsfiddle.net/wNfcg/


부트 스트랩에 대해 구체적으로 질문하는지, 즉이 두 클래스를 함께 사용할 수 있는지 아니면 일반적으로 묻는 것인지 잘 모르겠습니다.

원하는만큼의 클래스를 요소에 적용 할 수 있습니다. 클래스 이름은 공백으로 구분하면됩니다.

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

예, div는 필요한만큼 수업을받을 수 있습니다. 공간을 사용하여 서로 분리하십시오.

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

요소에 클래스를 추가 할 수 있지만 요소 당 하나의 ID 만 추가 할 수 있습니다.

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

div는 부트 스트랩을 사용하거나 사용하지 않고 둘 이상의 클래스를 보유 할 수 있습니다.

<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/


여러 CSS class선택기를 가질 수 있습니다 .

예 :

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

그러나 단 하나 id:

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

공백은 여러 클래스를 만드는 데 사용됩니다.

<div class = "One Two Three">

</ div>

참고 URL : https://stackoverflow.com/questions/14884523/can-a-div-have-multiple-classes-twitter-bootstrap

반응형