12 種css基本版型(無框架式)

12 種css基本版型(無框架式)12 Basic CSS TemplateThe templates include some basic directory structure as well as basic markup and styling. You can preview the templates by clicking one of them below. 1 column 2 columns (left) 2 columns (right) 3 columns...

Read more

用PX還是PT?(二)

用PX(pixer)有很多好處,它方便我們計算。A.螢幕顯示是以px計算的,像螢幕顯示是800*600是以pixer作單位B.網頁所用圖片,也以pixer來計算範例1:假設12px大小字體10行,則為10*12px=120px,可輕鬆計算出其總的高度在整體頁面上是如何大小,然後我們考慮用一個120px高的表格就可剛好包住這10行字,或斷行長度.對齊圖片等等,都可輕鬆計算出來,某些狀況下這有助於規劃網頁。(此處表格僅為舉例,實際上較優良的表格設計請見此文)範例2.:如果網頁預設最佳瀏覽為800*600,用px做為單位,可較容易掌握網頁內容物規劃,例如框架設定大小.欄位表格.何時斷行.可放置幾個欄位...等等。C.HTML代碼所默許的值,也是pixer。在沒有設定單位時,例如:width=100則會默許px為單位,成為width=100px。但是不寫明單位的語法撰寫,並不良好。現今已不合乎w3c所規定國際認可的標準,卻也是國內網頁設計者常見錯誤。px仍有不適用的時候,此時可改用em 或 %這樣的相對單位。附錄˙w3c所規定與字型相關資料(英文)以萬維網標準設計您的網頁(...

Read more

用PX還是PT?(一)

印刷排版裡,PT(point)為「絕對」長度單位(device-dependent),將字體看作一個方塊,以方塊高度來定義其大小,是物理上的單位。而螢幕字型單位PX(pixer)則為「相對」長度單位(device-independent),「相對」則表示此字型會隨使用者瀏覽器大小.系統平台或顯示器所預設的像素密度(dpi 值) ....等因素而改變。簡單說,用途在螢幕上時,盡量使用PX(pixer)列印文件則請使用PT(point)因PX本為螢幕用字型單位。PT則為印刷用字體單位。兩者換算公式 pt ＝ pt ÷72 ×像素密度(dpi /ppi值) ＝ px(四捨五入)範例: 9pt= 9pt ÷72×96(dpi/ppi)= 12px暫時的結論: 將字體設定為9pt與12px在銀幕上顯示是一樣大小像素密度(dpi/ppi值/screen resolution)早期為72 dpi˙現多改以96 dpi計算以上只為簡單原理說明,仍有其他因素影響著pt與px的大小顯示例如:像素密度(dpi 值)則是公式裡需一提因素,此會隨螢幕顯示技術.系統平台預設(dpi /ppi值)...而改變影響。在網頁設計時,該使用PX還是PT並無絕對定見,但PX相較起PT,仍為較被認可的主流單位!除非特殊考量,建議採用相對單位做設計,因瀏覽者不會使用相同螢幕顯示與系統平台瀏覽網頁,相對單位除了PX還有常被使用的em...

Read more

XML For BloggerTemplates

XML 「可擴展標示語言」Extensible Markup Language有很多blogger樣版網站有關XML Templatehttp://peterskyhands.blogspot.com/2007/02/blogger-beta-xml-template.html這裡有些xml面板可下載套用有很多blogger樣版網站Blogger的面版設計採用XML技術,對網頁設計師而言,又多一個回家功課(很早就想學學:p)XML技術將會成為HTML,css,之後該注意的紅人,但XML的規則是比HTML更加嚴格的,在HTML裡也許會被忽略的錯誤,在XML是會造成錯誤甚至無法讀取文件,優點則是透過此技術能發展應用出比HTML更多的功能,Blogger開發小組採用XML技術,個人覺得是很smart的,以目前網路有那麼多blog競爭來說,採用XML技術無疑是一場賭博,但也很難立刻佔領市場,需看設計者有無學習這們「新技術」來跟上這腳步。這個合乎國際W3C標準的技術以往為專業程式人員所使用,接下來要落入XML魔掌的將是做網頁設計的人了...haha...XML若說是新技術,其實也存在一小段時間(由1996年開始,又在1998正式成為W3C標準),如果blogger在面板上採用這新技術,某程度也提升XML在應用上的廣泛性與重要性(對web...

Read more

「超級無腦安裝Blogger外掛功能」

適用對象:電腦文盲療程:共花費12.5秒建議:裝進階的,然後將要使用選項勾一勾方法:請至Josh's Note直接安裝------------------------不適合初學的深入瞭解適用對象:略懂語...

Read more

添加Blogger的背景圖

1.進控制主頁 > 範本 > 修改HTML2.找到body {如下body {background:$bgcolor; margin:0; color:$textcolor; font:x-small Georgia Serif; font-size/* */:/**/small; font-size: /**/small; text-align: center; }修改對象 background:$bgcolor;應用範例 將background:$bgcolor;換成如下任一語法A.重複背景語法語法background:url(http://背景圖位址) repeat;B.背景居中語法background:url(http://背景圖位址) no-repeat top center;C.自動橫向重複，置於上方靠左的背景圖語法background:url(http://背景圖位址) repeat-x top left;D.固定背景不動請在以上背景語法後,加上此語法background-attachment:fixed;D範例應用:重複背景語法+固定背景不動語法background:url(http://背景圖位址) repeat;background-attachment:fixed;背景圖放置對齊位置可以有下列組合運用：top...

Read more

Blogger小工具

Blogger(Beta)最新回應程式產生器Blogger聯播程式產生器方法去該網頁,產生程式碼貼在HTML/JavaScript即可。用途可用與其他blog網站作文章聯播,最新文章。只要支援 javascript,即可使用。阿毛碎碎念~Blogger的Feed已支援JSONJSON(Javascript Object Notation),是附屬在 javascript 下的一組物件描述方法,加上近日風行的Ajax ,javascript 無疑變成十分熱門的語言。JSON ruleJSON 是利用了成對的 {} 來包住各物件(object),用成對的 [] 來包住各陣列(array),用成對的 "" 來包住各字串, 用逗號來區隔各變數,而資料型態有 string, number, array, object, 另外有三個常數, true, false, null, .....。~女人心思有否rule可套用?附錄:CSS 樣式規則(rule) 樣式規則(rule) = 選擇子 {宣告} = Selector { property : value } 選擇子(Selector)：通常為文件中的元素(element)，如html中的body, p, strong等標籤 ，多個選擇子可以逗號隔開。屬性(property)：CSS1...

Read more