CSS에서 모든 클래스를 인라인으로 변환하는 가장 간단한 방법

스타일링에 사용되는 일부 클래스가 있으며 모든 클래스가 블록 모드를 사용하여 표시됩니다. 인라인으로 모두 변환하고 싶습니다. 코드의CSS에서 모든 클래스를 인라인으로 변환하는 가장 간단한 방법

제는 ... 수동으로 인라인 개별적으로 변환하는 각 클래스에가는 대신, 인라인로 모두 변환 :

<div class="contentbody"> 
    <p> 
     Register here! 
    </p> 
    <a href="{% url 'parent_register_step1' %}" 
     class="bbutton textshadowclass boxshadow"> 
     <div class="boxshadowinset green"> 
      Register 
     </div> 
    </a> 
    <p> 
     Forgot your password? 
    </p> 
    <a href="{% url 'parent_forgot_password' %}" 
     class="bbutton textshadowclass boxshadow"> 
     <div class="boxshadowinset green"> 
      Reset Password 
     </div> 
    </a> 
</div>

내가 클래스 bbutton을 변경하려면, textshadowclass, 상자 shadow, boxshadowinset 녹색으로 인라인 .. 가장 간단한 방법은 무엇입니까?

참고 :이 클래스는 페이지의 다른 섹션에서 사용됩니다. 특정 섹션을 인라인으로 만 변경하고 싶습니다. 내가 인라인으로 같은 등록하는 것이 이것을 변환하고에 표시되는 암호를 재설정하려는 enter image description here

: 그것은

날 내가 뭐하는 거지을보다 상세히 설명하게 ... 전체 페이지에 영향을 미치지 않습니다 같은 라인 ...

는

출처

2012-06-21 lakesh

는

만 대신 contentbody 클래스 인 클래스를 선택하려면, 당신은 필요 CSS element>element Selector :

div.contentbody>.bbutton, div.contentbody>.textshadowclass, ... { 
    display: inline; 
}

(당신이 경우 목록에 다른 클래스를 추가

추가 참고 사항 : 이러한 클래스가 영구적으로 인라인되어야하는 경우 각 클래스로 이동하여 각 요소에 인라인 클래스를 추가하는 것이 좋습니다. 이렇게하면 코드를 명확하게 유지할 수 있습니다. 장기적으로는.

편집 :

여러 클래스가 설정되어 요소를 선택합니다 (I 좀 더 공식적인 링크를 찾을 수 없습니다 죄송합니다)를 union selector를 사용

div.contentbody>.boxshadowinset.green { 
    display: inline; 
}

참고 . (빈칸없이) 사이 boxshadowinset 및 green

나는 이것이 현대적인 브라우저에서 지원한다고 생각하지만 IE6에는 문제가있는 것 같습니다. .

출처

2012-06-21 08:10:01 Veger

또는 선택기'*'를 사용하여 모든 요소를 인라인으로 변환하십시오. – acme

hehe ... 요소의 50 % 이상이 인라인되어야하는 경우에도 ... 멋지게 작동 할 수 있습니다. : P – Veger

클래스가 내 html의 다른 섹션에서 사용되었습니다 ... 따라서 나머지 클래스에도 영향을줍니다. . 어떻게 피하기 위해 ... 나는이 클래스가 HTML의이 섹션에 대한 인라인 될 싶습니다 ... – lakesh

한 가지 방법은 ID를 래핑 요소에 적용하는 것입니다.

<div class="contentbody" id="contentbody">

이 그런 다음 CSS에서, 때문에 CSS 요소 계층에 스타일

div#contentbody a, div#contentbody div{ display: inline; }

를 추가, 그들은 모두 인라인 스타일보다는 자신의 스타일을 취할 것입니다.

기본 예는 여기에 있습니다. http://jsfiddle.net/H97c5/2/

출처

2012-06-21 08:15:57

CSS에서 모든 클래스를 인라인으로 변환하는 가장 간단한 방법

답변

관련 문제