Blueprint CSS 压缩脚本，如何使用？

发布于 2024-07-30 03:16:49 字数 149 浏览 2 评论 0原文

有人讨论了蓝图 css 的压缩器脚本，您可以在其中更改像素总数，或包含花式类型等，但我从未弄清楚如何使用它。我只能使用 Blueprint 的普通版本，在这种情况下，我的网站只有 900 px 宽，所以我根本无法使用 Blueprint，除非我将其重新制作为 900 px 格式。

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

深爱不及久伴 2024-08-06 03:16:49

Compass 使您能够将 Blueprint、YUI 或 960 GS 与 Sass 一起使用。它还支持自定义蓝图布局。请观看截屏以更好地了解 Compass 是什么。

回复收藏 0 原文

五里雾 2024-08-06 03:16:49

好吧，我明白了。我想更改 Grid.css 以反映我的网站宽度 850 像素而不是 950 像素，并包含花式类型插件。您可以通过像上面一样输入 ruby lib/compress.rb 并传递变量来从命令行输出自定义 css 文件。但是，如果您想包含插件，则必须使用新设置创建一个 YAML 文件。 Josh Clayton 很好地包含了一个示例配置 YAML 文件，因此我将其从：更改

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 MySite

Okay, I figured it out. I wanted to change Grid.css to reflect my site width of 850px instead of 950px, as well as include the fancy type plugin. You can output custom css files from the command line by typing ruby lib/compress.rb like above, and passing it variables. however, if you want to include plugins, you have to create a YAML file with the new settings. Josh Clayton was nice enough to include a sample config YAML file, so I jsut changed that from:

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

to something much simpler, this:

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

And then I run compress.rb -p MySite

回复收藏 0 原文

~没有更多了~