Blueprint CSS 압축기 스크립트, 어떻게 사용합니까?

Question

청사진 CSS에 대한이 압축기 스크립트에 대한 이야기가 있습니다. 여기에서 총 픽셀 수를 변경하거나 공상 유형 등을 포함 할 수 있지만 사용 방법을 결코 알지 못했습니다. 내가 사용할 수있는 모든 것은 청사진의 바닐라 버전이며이 경우 사이트는 너비가 900 픽셀 밖에되지 않으므로 900px 형식으로 다시 제작할 때까지 청사진을 전혀 사용하지 않아도됩니다.

Answer 1

Compass을 사용하면 Sass와 함께 Blueprint, YUI 또는 960 GS를 사용할 수 있습니다. 또한 사용자 지정 청사진 레이아웃을 지원합니다. Compass가 무엇인지 더 잘 이해하려면 screencast을 확인하십시오.

Answer 2

좋아요, 알아 냈습니다. grid.css를 950px 대신 850px의 내 사이트 너비와 멋진 유형 플러그인을 포함하도록 변경하려고했습니다. 위와 같이 ruby ​​lib/compress.rb를 입력하고 변수를 전달하여 커맨드 라인에서 커스텀 CSS 파일을 출력 할 수 있습니다. 그러나 플러그인을 포함하려면 새 설정으로 YAML 파일을 만들어야합니다. 조쉬 클레이튼은 샘플 구성 YAML 파일을 포함하기에 충분히 좋은, 그래서 그 변경 jsut :

project1: 
    path: /path/to/my/project/stylesheets 
    namespace: custom-namespace-1- 
    custom_css: 
    ie.css: 
     - custom-ie.css 
    print.css: 
     - docs.css 
     - my-print-styles.css 
    screen.css: 
     - subfolder-of-stylesheets/sub_css.css 
    custom_layout: 
    column_count: 12 
    column_width: 70 
    gutter_width: 10 
    plugins: 
    - fancy-type 
    - buttons 
project2: 
    path: /path/to/different/stylesheets 
    namespace: different-namespace- 
    custom_css: 
    screen.css: 
     - custom_screen.css 
    semantic_classes: 
    "#footer, #header": ".span-24, div.span-24" 
    "#content": ".span-17, div.span-17, div.colborder" 
    "#extra-content": ".span-6, div.span-6" 
    "div#navigation": "div.span_24, .span-24" 
    "div.section, div.entry, .feeds": ".span-6 div.span-6" 
project3: 
    path: /path/to/another/projects/styles 

훨씬 간단 뭔가,이 :

MySite: 
    path: /Applications/MAMP/htdocs/MySite/ 
    custom_layout: 
    column_count: 12 
    column_width: 60 
    gutter_width: 10 
    plugins: 
    - fancy-type 
    - buttons 

그리고 나는 compress.rb -p를 실행 내 사이트