CSS

PHP

• 9 Useful PHP Functions and Features You Need to Know

CSS

• Tips to Code Better CSS in your Projects

Html5

• A ROCK-SOLID DEFAULT FOR HTML5 AWESOME( Html5 模板)
• The Official Guide to HTML5 Boilerplate
• Create a Sticky Note Effect in 5 Easy Steps with CSS3 and HTML5

Git:

• git-server-的兩三事
• Pro Git - Table of Contents 簡體中文版
• Git 初學筆記 - 實作測試 | Tsung’s Blog

Javascript:

• Learning JavaScript and DOM with Console
• 淺談 JavaScript 編程語言的編碼規範
• Creating photo gallery using jQuery and VisualLightBox
• Importing multiple RSS feeds – using newsWidget (jQuery)
• Evolution of Script Loading
• Global eval. What are the options?

FreeBSD:

Update: 補上 OSDC 紀錄影片 2011.06.26 今年很高興可以北上參加 OSDC 2011 (Open Source Developers Conference)，由於之前都在南部唸書及工作，沒有機會北上參加聚會，現在人在新竹，終於有機會可以參加了，雖然早上六點就要起床趕電車了，不過到現場聽課感覺就是不同，也可以認識很多新朋友，底下來紀錄上課筆記

微軟與 jQuery 社群的親密接觸

講者: Eric Shangkuan (Microsoft) Slide: 微軟與 jQuery 社群的親密接觸 這是 OSDC 第一場演講，早上九點就開始了，雖然人不多，但是蠻多人還是為了講者而來，首先介紹什麼是 jQuery，以及 jQuery 一些基本用法，像是 CSS selector，如何在 Windows Visual Studio 上面開發 jQuery 及撰寫 plugin 整合進去 ASP.Net，最後介紹三個不錯用的 jQuery Plugin: Templeate, Datalink, Globalzation。

• Templeate: 這搭配 Facebook api 可以直接做個人頁面，請參考這裡
• Globalzation: 前端多國語系實做
• Datalink: 可以快速處理 form，利用 object 跟 jQuery 搭配

如果要研究上述三個 jQuery Plugin 可以參考底下: jQuery Datalink: https://github.com/jquery/jquery-datalink jQuery Templeate: https://github.com/jquery/jquery-tmpl jQuery Globalzation: https://github.com/jquery/jquery-global

HandlerSocket - A NoSQL plugin for MySQL

講者: Jui-Nan Lin (PIXNET) Slide: HandlerSocket - A NoSQL plugin for MySQL 會後有部份聽眾提出了一些問題，PIXNET 也已經回報給 MySQL 請他們修復這些問題，可以參考 gslin 大神回覆的這篇: MySQL HandlerSocket 的情況…，不過 NoSQL 有個缺點就是沒有帳號密碼，這部份蠻好解覺的，因為 DB 都直接放在後面，前面加上防火牆就好了。

繼前一篇所寫的『jQuery 偵測瀏覽器版本, 作業系統(OS detection)』，當我們遇到手機上網使用者，可以透過 javascript 來判斷目前使用者瀏覽器以及 OS，iPad user agent 如下:

Mozilla/5.0 (iPad; U; CPU OS 3_2 like Mac OS X; en-us) AppleWebKit/531.21.10 (KHTML, like Gecko) Version/4.0.4 Mobile/7B334b Safari/531.21.10 我們必須分析上面字串來判斷是否用手機上網，手機網頁跟PC網頁大小一定有所不同，透過底下兩個方法來改變瀏覽器的畫面

• 自動導向手機網頁
• 動態改變 CSS 兩個方法都不錯，如果決定使用前者，建議在 Server side 那邊做判斷，底下先列出 javascript, PHP, .htaccess 判斷檢查

The JavaScript

var isiPad = navigator.userAgent.match(/iPad/i) != null;

The PHP

$isiPad = (bool) strpos($_SERVER['HTTP_USER_AGENT'],'iPad');

The .htaccess

RewriteCond %{HTTP_USER_AGENT} ^.*iPad.*$
RewriteRule ^(.*)$ http://ipad.yourdomain.com [R=301]

if(jQuery){
    jQuery("body").addClass("jq");
}

.someClass{
    display:block;
}
.jq .someClass{
    display:none;
}

document.getElementsByTagName("body")[0].setAttribute("class", "js");

今年在 COSCUP 大會上最主流的議題就是 Html5，今天看到一個網站 HTML5 Boilerplate，這網站提一個全新 html 5 模板，自從離開 Dreamweaver 樣板軟體，利用 Pspad 手動撰寫 html，此網站就發揮非常大的用處，提供全新 html，CSS 以及 javascript，支援了底下很多功能：

• 跨瀏覽器 (IE6…)
• 支援多種 html5 Tag
• Compress 和 cache html 檔案
• CSS IE6 , IE7 Hack
• IE6 Png Fix (連這個都幫忙解決了)
• 支援 CDN jQuery，避免在 local 端沒讀取到檔案 你還可以根據自己需要的功能做添加或者是減少，CSS reset、跨瀏覽器 CSS、robots.txt、Apache .htaccess cache 壓縮也有支援，如果不需要的功能，也可以參考看看，對於初學者也是非常好的學習例子。

Windows C#

• C# 比較字串
• MSDN 比較字串
• Request.Form Collection
• Request Query String / Form Parametrs
• ASP.NET QueryString Usage
• Using include files with ASP.NET

html

• [將所有 的內容包到一個

  中][7]

apache

• Fixing mod_rewrite and .htaccess on GoDaddy Hosting

javascript

• jQuery Week Calendar
• Javascript: reference the parent window from a popup
• How to get and set form element values with jQuery
• How to check and uncheck a checkbox with jQuery
• Loop through parameters passed to a Javascript function
• perl-completion.vim now supports simple context completion.
• Get URL parameters & values with jQuery

CSS

先前在國外部落格發現一篇非常好用的教學：Quick Tip: How to Target IE6, IE7, and IE8 Uniquely with 4 Characters，裡面有提供一部教學影片，非常好用，也很實在，底下可以先看影片，看完大概就可以針對 IE, FireFox, Chrome 進行 CSS Hack。 目前網頁製作，要符合多瀏覽器跨平台(IE, Safari, Chrome, FireFox…等)，就必須動到 CSS Hack，雖然 Google 已經宣稱不支援 IE6，但是很多單位，很多學校跟客戶都是使用 IE6 瀏覽器，不只國內這樣，國外大廠也都希望支援 IE 系列，包含 IE6, IE7, IE8，這時候就必須知道如何分別針對各種不同 IE 做設定，底下就來看看實做例子。

在 IE8 還沒出來之前，都是利用 margin: 0 auto; 的方式來解決 div 置中的問題，但是這在 IE8 並沒有發揮作用，無效了，底下在網路上發現兩種解法，分享給大家知道： 1. Width:100% 在最外層 div 加入 Width:100% 的屬性，程式碼如下：

#container {width:100%;}
#centered {width:400px; margin:0 auto;}

2. Text-Align:Center 在 div tag 裡面加入 Text-Align:Center，這樣 IE8 會偵測到此語法，就會服從 margin:0 auto; 之屬性，不過這樣內容會被全部至中，如果您有需要將其 div 內容往左邊對齊，那就必須在加上語法 Text-Align:left，底下是範例程式碼：

#container {text-align:center;}
#centered {width:400px; margin:0 auto;text-align:left;}

#wrap {
  margin: 0px auto; /* firefox */
  *margin: 0px auto; /* ie7 */
  _margin: 0px auto; /* ie6 */
  height:100px; 
  width:860px;
  border:5px solid red;    
}

Centering a Div in IE8 Using margin:auto 【CSS 語法教學】區塊置中的三種寫法

update 2009.05.07: IE7 之後開始支援 CSS 2.0，因此可以開始使用 hover 之前發表一篇用 jQuery 解決 IE 不支援 :hover css，今天在看 和多 寫的網站 Registrano html 原始碼，發現利用 CSS 也可以辦到啦，底下就是 Registrano css 原始碼： html 部份：

  

    

      test1
    
        
    
    

      test2