[web] 網頁圖片 CSS Sprites、DataURI、Web Font 簡單比較及工具

CSS Sprites, DataURI 和 Icon-fonts 這三者都可以用於網頁小圖示上。
這三者都可以用於減少網頁上的request，使網頁變快一些。
下列式分析

CSS Sprites
概述:就是把所有的小圖示變成一張大圖，再利用CSS定位方式去找到該圖片並顯示
優點:圖片可彩色
缺點:大小固定，重新作大圖很麻煩，維護不易
瀏覽器: IE8+
工具網站: http://csssprites.com/


DataURI
概述:將圖片已base64作編碼，網站便會將他解譯成圖片
優點:圖片可彩色，不需再建立連線拉圖片
缺點:IE8+ (IE8有限制32KB大小)
工具網站: http://www.base64-image.de/


Web Font
概述:字型本身就是圖案，所以利用字型檔(ttf/woff/eot)將圖片放置在對應的文字內
優點:因轉成文字，所以可以對圖片下CSS(但CSS仍受該CSS是否支援瀏覽器影響)
缺點:單色
工具網站: http://icomoon.io/app/#/select





這個網誌中的熱門文章

[java]BIG5 字集判斷

前言，不是每個系統都支援UTF-8 UTF8的系統但要把資料拋入BIG5的系統內，如何讓使用者一看就知道字會有問題。 可以使用下面這段程式碼去判斷 請注意，這裡不另外處理補完計畫的字是否正常顯示 程式構想:http://blog.darkthread.net/blogs/darkthreadtw/archive/2007/04/21/733.aspx 原本是想說用字碼去判斷，但怪怪的 SOURSE: http://zh.wikipedia.org/wiki/%E5%A4%A7%E4%BA%94%E7%A2%BC //BIG5有定義的字 String testString = "峰"; //BIG5沒定義的UTF-8字集 //String testString = "峯"; //罕用字(3Byte呈現一個字UTF8字碼217E5) //String testString = "𡟥"; //BIUG5 自訂字FA40等自定義字集 //String testString = "";     String[] stringArray = testString.split("");     for (int i = 1; i < stringArray.length; i++) {       System.out.println(stringArray[i]);       //使用BIG5編碼再用UTF-8還原若有錯誤會顯示問號       String str = new String(stringArray[i].getBytes("BIG5"), "UTF-8");       if(str.equals("?")){         System.out.println(stringArray[i] + "非BIG5字集");       }     }
閱讀完整內容

[java]半型轉全型

半型轉全形沒有現成的code可用，所以要自己寫 有更好版本請提供!!! code: static public String toBigChat(String input) { String q1[] = {"A", "B", "C", "D", "-", "1", "2", "#", "[?]"}; String q2[] = {"Ａ", "Ｂ", "Ｃ", "Ｄ", "－", "１", "２", "＃", "？"}; for (int i = 0; i < 9; i++) { input = input.replaceAll(q1[i], q2[i]); } return input; } q1為需要取代的字串 q2為轉換後的字串 q1與q2必須互相對應 比對的方是我是用比較簡單的兩個陣列 當然你想用json去包一對一的關係也可以 主要的核心在replaceall 其中要注意的是replaceall支援正則表達式 所以在下特殊的字例如^、?、*這些對正則表達式有意含的特殊符號時必須使用[]包起來，才不至於錯誤 另外\在java內要記得是\\ 取代\要下 str.replaceAll("\\\\", "a"); 才會正確。
閱讀完整內容

[javascript]當月第一天、當月最後一天

 //取當日  var startdate = new Date(); //設定日期為第一天 startdate.setDate(1); //取當日  var enddate = new Date(); //將月份移至下個月份  enddate.setMonth(enddate.getMonth()+1); //設定為下個月份的第一天  enddate.setDate(1);  //將日期-1為當月的最後一天 enddate.setDate(enddate.getDate()-1);
閱讀完整內容