온라인 CSS DRYer (중복 제거)

Question

DRY = "직접 반복하지 말 것".

나는 더 복잡한 디자인을 만드는 데 사용하는 기본 CSS 프레임 워크를 사용합니다. 프로토 타이핑의 가장 빠른 방법은 끝에 서서 원하는 결과를 얻기 위해 CSS를 빌드하는 것입니다 (기본 CSS에서 기존 CSS 속성을 편집하는 것이 아니라).

그러나 끝나면 클래스 이름과 속성이 많이 반복됩니다.

내 CSS 파일을 스캔하여 중복성과 중복성을 제거하는 형태로 지능적으로 리메이크하는 온라인 (또는 오프라인) 도구를 찾고 있습니다. 예를 들어

, 이들 두 줄은 CSS 파일에 존재하는 경우 :

//FROM THE BASE CSS 
.header{ 
    font-weight:bold; 
    font-size:1.5em; 
    background:red; 
    margin:0 auto; 
    padding:20px 
    } 

//FROM THE ADDED CSS 
.header{ 
    font-weight:normal; 
    font-size:1.25em; 
    background:blue; 
    padding-bottom:0; 
    margin-top:-20px 
    } 

(이전에 우선로 캐스케이드 하위 항목을주는) 원하는 결과의 첫 번째 인스턴스를 제거하는 것 .header 지침 및과 같이 하나의 .header 지시에 모두 .header 인스턴스에서 규칙을 병합 :

.header{ 
    font-weight:normal; 
    font-size:1.25em; 
    background:blue; 
    margin:-20px auto 0 auto; 
    padding:20px 20px 0 20px 
    } 

는 응용 프로그램이 존재 하는가?

Answer 1

개인적으로 개인적으로 나는 CSSTidy을 사용합니다. 그것은 많은 일을하지만, 가능하다면 선택기를 병합하고 올바르게 연쇄 결합 (중복 속성 제거)합니다. 대개 원본 파일 크기가 약 30 % 감소합니다. 이는 축소 된 경우에도 JavaScript minifiers와는 달리 읽기가 비교적 쉽습니다.

Answer 2

여기에 두 가지이다 나는 알아두면 편리이 함께 할 수있는 도구가 있습니다 :

1. CSSTrashman
2. deadweight