CSS 코드 조직 기법

옳은 대답은 확실치 않기 때문에 아마도 경계선 문제 일 것입니다.하지만 사람들이 스타일 시트를 구성하는 방법과 일반적인 방법이 궁금 해서요. 나는 그것이 개인적인 스타일로 내려갈 것이라고 확신하지만, 나는 아직도 어떤 사람들이하는 일을 다르게보고 싶다.CSS 코드 조직 기법

글로벌 스타일은 항상 맨 위이고 나머지 스타일은 일반적으로 페이지에 나타나는 순서대로 작성됩니다.

.myClass { 
    [position, display, and float] 
    [margins and padding] 
    [width and height] 
    [background, border, border-style, shadow] 
    [font settings] 
    [animations/transitions] 
}

: 난 항상 다음과 같은 순서로 속성을 나열, 클래스 내에서

#search { 
    float:right; 
    margin-top:20px; 
    width:325px; 
    height:35px; 

    background-image:url(css-ref/main.png); 
    background-repeat:no-repeat; 

    text-align:right; 
    line-height:36px; 
    font-size:13px; 
} 
    #search a:link,#search a:visited,#search a:active { 
     color:#333; 
    } 
    #search a:hover { 
     color:#1770a9; 
    }

나는 부모 클래스에서 모든 하위 스타일, 서브 클래스 및 의사 클래스를 들여 경향

나를 위해, 특정 클래스 내에서 속성을 찾아야 할 때 항상 동일한 순서로 진행되기 때문에 가독성이 향상됩니다.

스타일 시트를 구성하는 방법이 더 좋고/더 널리 채택되어 있습니까? 어떻게 할 수 있니?

출처

2012-12-12 Jon

당신에게 좋으면 모든 것이 중요합니다. 모든 개발자는 일을하는 방법이 다르며 다른 개발자가 이해할 수있게 만들고 자신에게 최적입니다. – Andy

좋은 팁이 있습니다. http://net.tutsplus.com/tutorials/html-css-techniques/30-css -best-practices-for-beginners /. 그러나 Andy가 말했듯이, 가장 좋은 방법은 없습니다. 그것이 당신을 위해 작동한다면, 아마 괜찮아. – JSW189

식별 또는 "중첩"은 일반적인 연습이며 SASS과 같은 CSS 메타 언어의 핵심 기능입니다.

출처

2012-12-12 18:03:55 Anson

덧붙이려면 google은 탭을 사용하지 않고 들여 쓰기를 위해 2 칸, 4 칸을 추천합니다 : http://google-styleguide.googlecode.com/svn/trunk/htmlcssguide.xml – Andy

왜 두 칸입니까? 탭이있는 공백을 압축하는 데 시간이 오래 걸리나요? – Jon

@ 존 추천은 가독성을 줄이고 편집기에서 들여 쓰기 레벨을 제어하는 기능을 없애는 것입니다. – cimmanon

좋은 방법입니다. 참고로 나는 코드를 들여 쓰기에서 추가 가독성을 찾을 수 없습니다. 그러므로 나는 그렇지 않다. http://www.visibilityinherit.com/code/initial-css-settings.php

출처

2012-12-12 18:33:41 Eric

CSS 코드 조직 기법

답변

관련 문제