Blueprint(CSS框架)

本詞條是多義詞,共2個義項
更多義項 ▼ 收起列表 ▲

Blueprint是由於 HTML是一種標準,並且所描述的是結構而非樣式,因此 Blueprint 框架是完全作為 CSS 實現的。

基本介紹

  • 中文名:Blueprint
  • 作用:模擬列印頁的外觀
  • 類別:程式
  • 框架:完全作為 CSS 實現
簡介,樣式例子,

簡介

在設計網頁時要以 Blueprint 為指導,然後再設計或生成 HTML,以便將 Blueprint CSS 樣式套用於 HTML 元素。實際上,由於 Blueprint 提供了強大的 CSS,因此可以在 HTML中設計網頁,而不必使用圖像設計程式來模擬最終頁面,比如說 photoshop。從一定意義上說,Blueprint 提供了真正的所見即所得的(WYSIWYG)網頁設計,因為原型將使用與最終站點相同的代碼。
此外,由於 Blueprint 的主要作用是模擬列印頁的外觀,因此使用 Blueprint 進行互動式的設計的感覺更像是在使用 QuarkXPress 或 AdobeInDesign。Blueprint 樣式基於像素和一個 18 像素的基線格線。藉助設計天賦和努力,可以創建具有專業外觀的頁面。

樣式例子

Blueprint 的默認格線是 950 像素寬,分為 24 個由 10 像素分隔線隔開的 30 像素寬的列:[(24 列 * 30 像素/列) + (23 分隔線 * 10 像素/分隔線) = 950 像素]。如果偏好或者需要更寬或更窄的格線或不同的列寬,Blueprint 提供了一個 Ruby 工具用於將 Blueprint 重新生成到需要的規範中。Ruby 工具還創建了一個格線圖像,可以在 Photoshop中引用,並且壓縮了最終的CSS以減小檔案大小,從而縮短了傳輸時間和頻寬。
Blueprint
通常,不應該編輯 Blueprint CSS 檔案。而是應該在一個單獨的檔案定義自己的樣式,並根據需要覆蓋 Blueprint 代碼。這是最後一個檔案 css/custom.css 的作用,這個檔案是作為代碼的一部分創建和維護的。

相關詞條

熱門詞條

聯絡我們