用jQuery解決IE CSS Hover無法正常顯示的方法:
解法一:
if( window.BrowserDetect.browser == "Explorer" )
{
$('.Button').unbind('mouseenter mouseleave').bind('mouseenter mouseleave', function() {
$(this).toggleClass('Button-hover');
});
}
解法二:
$(".Button").hover(function() {
$(this).css("background-color","#FFE100");
},function(){
$(this).css('background-color','#C4C4C4');
});
2013年10月31日 星期四
2013年10月30日 星期三
jsTree 功能, Demo 程式碼測試
jsTree Home: http://www.jstree.com/
// Judge the tree folder is opened or collapsed
// 1) select the tree container using jQuery and call '.jstree("is_open","#tree_list_ID")'
$("#xml_o").jstree("is_open" , "#1");
// To toggle the tree folder open or collapse
// 1) select the tree container using jQuery and call '.jstree("toggle_node","#tree_list_ID")'
$("#xml_o").jstree("toggle_node","#html_1");
// To select the tree list
// 1) select the tree container using jQuery and call '.jstree("select_node","#tree_list_ID")'
$("#xml_o").jstree("select_node","#1" )
// To deselect the tree list
// 1) select the tree container using jQuery and call '.jstree("deselect_node","#tree_list_ID")'
$("#xml_o").jstree("deselect_node","#1" );
// To rename the tree list
// 1) select the tree list first
// 2) select the tree container using jQuery and call '.jstree("rename")'
$("#xml_o").jstree("rename");
// To delete the tree list
// 1) select the tree list first
// 2) select the tree container using jQuery and call .jstree("remove")
$("#xml_o").jstree("remove");
// To refresh the tree
// 1) select the tree container using jQuery and call .jstree("refresh")
$("#xml_o").jstree("refresh" );
// To collapse all tree
// 1) select the tree container using jQuery and call .jstree("close_all")
$("#xml_s_matrix_1").jstree("close_all");
// To open all tree
// 1) select the tree container using jQuery and call .jstree("open_all")
$("#xml_s_matrix_1").jstree("open_all");
// To refresh node of the tree
// 1) select the tree container using jQuery and call .jstree("refresh","#node")
$("#xml_s_matrix_1").jstree("refresh","#8");
// To get *json
// 1) select the tree container using jQuery and call .jstree("get_json")
$("#xml_o").jstree("get_json" );
// This function returns an array of tree nodes converted back to JSON.
// 1) select the tree container using jQuery and call .jstree("get_json","node")
$("#xml_s_matrix_1").jstree("get_json","#1");
//Returns the title of a node.
// 1) select the tree container using jQuery and call .jstree("set_text","node")
$("#xml_s_matrix_1").jstree("get_text","#8"); get name
//Sets the title of a node.
// 1) select the tree container using jQuery and call .jstree("set_text","node", "text")
$("#xml_s_matrix_1").jstree("set_text","#8","123");
//Creates the DOM structure necessary for a new node.
$("#xml_s_matrix_1").jstree("create_node", "#8", "1234");
parent_id position
// Judge the tree folder is opened or collapsed
// 1) select the tree container using jQuery and call '.jstree("is_open","#tree_list_ID")'
$("#xml_o").jstree("is_open" , "#1");
// To toggle the tree folder open or collapse
// 1) select the tree container using jQuery and call '.jstree("toggle_node","#tree_list_ID")'
$("#xml_o").jstree("toggle_node","#html_1");
// To select the tree list
// 1) select the tree container using jQuery and call '.jstree("select_node","#tree_list_ID")'
$("#xml_o").jstree("select_node","#1" )
// To deselect the tree list
// 1) select the tree container using jQuery and call '.jstree("deselect_node","#tree_list_ID")'
$("#xml_o").jstree("deselect_node","#1" );
// To rename the tree list
// 1) select the tree list first
// 2) select the tree container using jQuery and call '.jstree("rename")'
$("#xml_o").jstree("rename");
// To delete the tree list
// 1) select the tree list first
// 2) select the tree container using jQuery and call .jstree("remove")
$("#xml_o").jstree("remove");
// To refresh the tree
// 1) select the tree container using jQuery and call .jstree("refresh")
$("#xml_o").jstree("refresh" );
// To collapse all tree
// 1) select the tree container using jQuery and call .jstree("close_all")
$("#xml_s_matrix_1").jstree("close_all");
// To open all tree
// 1) select the tree container using jQuery and call .jstree("open_all")
$("#xml_s_matrix_1").jstree("open_all");
// To refresh node of the tree
// 1) select the tree container using jQuery and call .jstree("refresh","#node")
$("#xml_s_matrix_1").jstree("refresh","#8");
// To get *json
// 1) select the tree container using jQuery and call .jstree("get_json")
$("#xml_o").jstree("get_json" );
// This function returns an array of tree nodes converted back to JSON.
// 1) select the tree container using jQuery and call .jstree("get_json","node")
$("#xml_s_matrix_1").jstree("get_json","#1");
//Returns the title of a node.
// 1) select the tree container using jQuery and call .jstree("set_text","node")
$("#xml_s_matrix_1").jstree("get_text","#8"); get name
//Sets the title of a node.
// 1) select the tree container using jQuery and call .jstree("set_text","node", "text")
$("#xml_s_matrix_1").jstree("set_text","#8","123");
//Creates the DOM structure necessary for a new node.
$("#xml_s_matrix_1").jstree("create_node", "#8", "1234");
parent_id position
(*) JSON: JavaScript Object Notation.
JSON is syntax for storing and
exchanging text information. Much like XML.
JSON is smaller than XML, and faster
and easier to parse.
2013年10月29日 星期二
網路相關名詞介紹
什麼是NAT (Network Address Translation) ?
NAT 技術可讓本地的傳輸控制協定 (TCP/IP) 電腦及設備，分響共同的網際網路通訊協定 (IP) 位址，將網路間的IP 位址互相傳議, 但是不互相影響。
在計算機網絡中，網絡地址轉換，也叫做網絡掩蔽或者IP掩蔽，是一種在IP封包通過路由器或防火牆時重寫源IP地址或/和目的IP地址的技術。這種技術被普遍使用在有多台主機但只通過一個公有IP地址訪問因特網的私有網絡中。根據規範，路由器是不能這樣工作的，但它的確是一個方便並得到了廣泛應用的技術。當然，NAT也讓主機之間的通信變得複雜，導致通信效率的降低。
●NAT(Network Address Transform)是什麼??
NAT 是網路位址轉譯器( Network Address Transfer) ，主要是用來簡化及保存IP位址，它可以讓原本無法上網，而且無法使用內部IP位址的主機可以成功的連接Internet，而且它也就是將要傳送出去的封包進行 IP
轉換的動作，使用NAT可以大大減少IP位址的需求，因為基本上整個內部網路都可憑藉NAT上的一個外部IP來連接Internet。
●NAT是解決什麼的?
解決了IPv4地址短缺的問題
為一種減少對IP需求的機制。若接取設備（如，Router）有支援NAT，則可作到多台主機使用一組IP，即IP
sharing。這樣可以減少對IP位址的需求。
NAT除了帶來方便和代價之外，對全雙工連接支持的缺少在一些情況下可以看作是一個有好處的特徵而不是一個限制。在一定程度上，NAT依賴於本地網路上的一臺機器來初始化和路由器另一邊的主機的任何連接，它可以阻止外部網路上的主機的惡意活動。這樣就可以阻止網路蠕蟲病毒來提高本地系統的可靠性，阻擋惡意瀏覽來提高本地系統的私密性。很多具有NAT功能的防火牆都是使用這種功能來提供核心保護的。
●NAT的特性是什麼?
目前存在兩種地址轉換方式。一種式經常被簡記為"NAT"的網路地址轉換(有時也叫做「網路地址埠轉換」，記做NAPT)，這種方式支持埠的映射並允許多台主機共享一個公用IP地址。另一種也可以稱作NAT或「基本NAT」，「靜態NAT",但在技術上更簡單一點，僅支持地址轉換，不支持埠映射，這就需要對每一個當前連接都要對應一個IP地址。寬頻(broadband)路由器通常使用這種方式來允許一臺指定的電腦去接收所有的外部連接，甚至當路由器本身只有一個可用外部IP時也如此，這台路由器有時也被標記為DMZ主機。
支持埠轉換的NAT又可以分為兩類：源地址轉換和目的地址轉換NAT 。前一種情形下發起連接的電腦的IP地址將會被重寫，後一種情況下被連接電腦的IP地址將被重寫。實際上，以上兩種方式通常會一起使用以支持雙向通信。
●NAT要如何設定?
一般要架設NAT，主機必須要有2張網路卡，並且把整個區網分成2個網段，分別為內網及外網(就是把真IP及假IP分開)，或是一般ADSL的ATUR、IP分享器、路由器都是.
什麼是 DNS (Domain Name System) ?
在連線要求時, 我們通常都是使用主機網域名稱例如:
http://www.netvigator.com,/ http://www.microsoft.com/ 等.
但由於電腦只認得 IP, 因此必須透過DNS 以將網域名稱轉換成對應的 IP 位址,
才能順利的連線.
什麼是 DHCP (Dynamic Host Configuration Protocol) ?
DHCP 的主要功能是讓一部機器能夠透過自己的 Ethernet Address 廣播,
向 DHCP Server 取得有關 ip, netmask, default gateway, dns 等設定.
只須要將 DHCP Server 設定好,
就可以讓 client machine 透過 DHCP protocol 自動取得 IP 相關的設定,
而不需要去每一部機器上辛苦地做 IP, netmask, default gateway, dns 等設定.
什麼是PPP (Point to Point Protocol) ?
點對點連線協定是大部份ISP用來提供連線服務給使用者,
所使用到的連線方式, 使用者可以透過這個協定在電話線上或ISDN線上傳輸網路資訊.
而PPPoE 亦由PPP 所衍生出來.
什麼是FTP (File Transfer Protocol) ?
檔案傳輸協定是分享檔案用的協定, 也是在 TCP/IP 環境中最常用的協定.
它可讓使用者由遠端登入到網路上的另一台電腦, 然後瀏覽、下傳、和上傳檔案.
FTP 仍然相當普遍的另一個原因, 是因為它是與平台無關的,
幾乎市場上的每種作業系統都有它的 FTP 伺服器和用戶端程式.
什麼是 TCP/IP (Transmission Control Protocol/Internet Protocol) ?
TCP/IP 是指用於網路上的一種最常用的標準傳輸協定.
雖然網路上每台主機所使用的作業平台不盡相同, 傳輸協定的名稱亦是相異,
不過彼此之間卻可經由此種標準傳輸協定來達到不同作業平台間對話或資訊的交流.
而TCP/IP 本身主要包含了兩個協定即是
IP (Internet Protocol) 及TCP (Transmission Control Protocol).
同時 TCP/IP 本身亦是由一多個網際網路上的通訊協定組和而成,
也就是說, TCP/IP是以IP網際網路協定與TCP傳輸控制協定為基礎,
訂出來的一組Internet上的通訊協定.
什麼是IP Address (Internet Protocol Address) ?
作為識別網絡上主機的唯一位址.
而IP Address 由四組8位元 (0 ~ 255) 的數字組合而成, 共32位元,
每組數字間在以小數點符號隔開, 如: 202.85.141.132、202.67.240.88 等.
而IP Address 的範圍為( 0 ~ 255‧0 ~ 255‧0 ~ 255‧ 0 ~ 255 ).
什麼是 Server ?
Server 就是指能夠處理某些外部程式, 儲存檔案資料, 並就用戶端所提出的要求,
傳送檔案資料等, 例如 HTTP Server, FTP Server, NNTP Server 等等.
什麼是 Protocol ?
作為電腦與電腦之間電腦進行資訊交流時互相溝通的一種語言,
而此種語言也就是Protocol 常用 Protocol 包括 TCP/IP , IPX/SPX , NetBEUI..等等
什麼是 SMTP (Simple Mail Transfer Protocol) ? ?
E-mail Server 之間用以發送電子郵件的Protocol ,
電子郵件程式也在使用者端使用 SMTP 來發送郵件給伺服器,
但一般使用 POP 來接收郵件.
什麼是 PPPoE (Point-to-Point Protocol Over Ethernet) ?
PPPoE 全名是 Point-to-Point Protocol Over Ethernet (RFC 2516),
是目前全球寬頻服務商最常用的傳輸方式之一.
這種技術是由Redback Networks Inc, RouterWare Inc 及
UUNET Technologies Inc 建基於PPP (Point-to-Point) 及 Ethernet 去發展.
PPPoE 的最大好處是使 ISP 能夠利用本身已有的設備去提供寬頻服務
(包括 XDSL, Cable 及 Wireless),對ISP 來說可以減少很多成本.
而 RASPPPoE, NTS EnterNet 及 WinPoET等，
PPPoE上網軟件均可用於任何PPPoE寬頻之上.
什麼是 Gateway ?
Gateway 用以作為兩個不相容網路彼此間連線的連接點或交換點,
像 LAN 就需要藉由通訊閘來與 WAN 作連線.
其主要工作是將本地所用的通訊協定透過通訊閘來轉換成彼端所能辨識的通訊協定.
什麼是子網路遮罩?
子網路是因網路技術的電子限制、工作環境與以區分（或應用原件的功能區分）、或因連結遠端高速線路的需求等理由，而將大型邏輯網路分割為數個小型實際網路的一種程序。
所形成的網路更易整合及管理，透過閘道及路由器將各個小型子網路相互連結，但有可能數個因功能而切割的子網路，實際仍連結在相同的一個網路之中。
子網路遮罩的設定是永以決定網路位址何時結束，主機位址何時開始。
深入了解: http://www.netadmin.com.tw/article_content.aspx?sn=1102080004
參考資料: http://www.cksh.tp.edu.tw/~ckshcnca/net1.htm
NAT 技術可讓本地的傳輸控制協定 (TCP/IP) 電腦及設備，分響共同的網際網路通訊協定 (IP) 位址，將網路間的IP 位址互相傳議, 但是不互相影響。
在計算機網絡中，網絡地址轉換，也叫做網絡掩蔽或者IP掩蔽，是一種在IP封包通過路由器或防火牆時重寫源IP地址或/和目的IP地址的技術。這種技術被普遍使用在有多台主機但只通過一個公有IP地址訪問因特網的私有網絡中。根據規範，路由器是不能這樣工作的，但它的確是一個方便並得到了廣泛應用的技術。當然，NAT也讓主機之間的通信變得複雜，導致通信效率的降低。
●NAT(Network Address Transform)是什麼??
NAT 是網路位址轉譯器( Network Address Transfer) ，主要是用來簡化及保存IP位址，它可以讓原本無法上網，而且無法使用內部IP位址的主機可以成功的連接Internet，而且它也就是將要傳送出去的封包進行 IP
轉換的動作，使用NAT可以大大減少IP位址的需求，因為基本上整個內部網路都可憑藉NAT上的一個外部IP來連接Internet。
●NAT是解決什麼的?
解決了IPv4地址短缺的問題
為一種減少對IP需求的機制。若接取設備（如，Router）有支援NAT，則可作到多台主機使用一組IP，即IP
sharing。這樣可以減少對IP位址的需求。
NAT除了帶來方便和代價之外，對全雙工連接支持的缺少在一些情況下可以看作是一個有好處的特徵而不是一個限制。在一定程度上，NAT依賴於本地網路上的一臺機器來初始化和路由器另一邊的主機的任何連接，它可以阻止外部網路上的主機的惡意活動。這樣就可以阻止網路蠕蟲病毒來提高本地系統的可靠性，阻擋惡意瀏覽來提高本地系統的私密性。很多具有NAT功能的防火牆都是使用這種功能來提供核心保護的。
●NAT的特性是什麼?
目前存在兩種地址轉換方式。一種式經常被簡記為"NAT"的網路地址轉換(有時也叫做「網路地址埠轉換」，記做NAPT)，這種方式支持埠的映射並允許多台主機共享一個公用IP地址。另一種也可以稱作NAT或「基本NAT」，「靜態NAT",但在技術上更簡單一點，僅支持地址轉換，不支持埠映射，這就需要對每一個當前連接都要對應一個IP地址。寬頻(broadband)路由器通常使用這種方式來允許一臺指定的電腦去接收所有的外部連接，甚至當路由器本身只有一個可用外部IP時也如此，這台路由器有時也被標記為DMZ主機。
支持埠轉換的NAT又可以分為兩類：源地址轉換和目的地址轉換NAT 。前一種情形下發起連接的電腦的IP地址將會被重寫，後一種情況下被連接電腦的IP地址將被重寫。實際上，以上兩種方式通常會一起使用以支持雙向通信。
●NAT要如何設定?
一般要架設NAT，主機必須要有2張網路卡，並且把整個區網分成2個網段，分別為內網及外網(就是把真IP及假IP分開)，或是一般ADSL的ATUR、IP分享器、路由器都是.
什麼是 DNS (Domain Name System) ?
在連線要求時, 我們通常都是使用主機網域名稱例如:
http://www.netvigator.com,/ http://www.microsoft.com/ 等.
但由於電腦只認得 IP, 因此必須透過DNS 以將網域名稱轉換成對應的 IP 位址,
才能順利的連線.
什麼是 DHCP (Dynamic Host Configuration Protocol) ?
DHCP 的主要功能是讓一部機器能夠透過自己的 Ethernet Address 廣播,
向 DHCP Server 取得有關 ip, netmask, default gateway, dns 等設定.
只須要將 DHCP Server 設定好,
就可以讓 client machine 透過 DHCP protocol 自動取得 IP 相關的設定,
而不需要去每一部機器上辛苦地做 IP, netmask, default gateway, dns 等設定.
什麼是PPP (Point to Point Protocol) ?
點對點連線協定是大部份ISP用來提供連線服務給使用者,
所使用到的連線方式, 使用者可以透過這個協定在電話線上或ISDN線上傳輸網路資訊.
而PPPoE 亦由PPP 所衍生出來.
什麼是FTP (File Transfer Protocol) ?
檔案傳輸協定是分享檔案用的協定, 也是在 TCP/IP 環境中最常用的協定.
它可讓使用者由遠端登入到網路上的另一台電腦, 然後瀏覽、下傳、和上傳檔案.
FTP 仍然相當普遍的另一個原因, 是因為它是與平台無關的,
幾乎市場上的每種作業系統都有它的 FTP 伺服器和用戶端程式.
什麼是 TCP/IP (Transmission Control Protocol/Internet Protocol) ?
TCP/IP 是指用於網路上的一種最常用的標準傳輸協定.
雖然網路上每台主機所使用的作業平台不盡相同, 傳輸協定的名稱亦是相異,
不過彼此之間卻可經由此種標準傳輸協定來達到不同作業平台間對話或資訊的交流.
而TCP/IP 本身主要包含了兩個協定即是
IP (Internet Protocol) 及TCP (Transmission Control Protocol).
同時 TCP/IP 本身亦是由一多個網際網路上的通訊協定組和而成,
也就是說, TCP/IP是以IP網際網路協定與TCP傳輸控制協定為基礎,
訂出來的一組Internet上的通訊協定.
什麼是IP Address (Internet Protocol Address) ?
作為識別網絡上主機的唯一位址.
而IP Address 由四組8位元 (0 ~ 255) 的數字組合而成, 共32位元,
每組數字間在以小數點符號隔開, 如: 202.85.141.132、202.67.240.88 等.
而IP Address 的範圍為( 0 ~ 255‧0 ~ 255‧0 ~ 255‧ 0 ~ 255 ).
什麼是 Server ?
Server 就是指能夠處理某些外部程式, 儲存檔案資料, 並就用戶端所提出的要求,
傳送檔案資料等, 例如 HTTP Server, FTP Server, NNTP Server 等等.
什麼是 Protocol ?
作為電腦與電腦之間電腦進行資訊交流時互相溝通的一種語言,
而此種語言也就是Protocol 常用 Protocol 包括 TCP/IP , IPX/SPX , NetBEUI..等等
什麼是 SMTP (Simple Mail Transfer Protocol) ? ?
E-mail Server 之間用以發送電子郵件的Protocol ,
電子郵件程式也在使用者端使用 SMTP 來發送郵件給伺服器,
但一般使用 POP 來接收郵件.
什麼是 PPPoE (Point-to-Point Protocol Over Ethernet) ?
PPPoE 全名是 Point-to-Point Protocol Over Ethernet (RFC 2516),
是目前全球寬頻服務商最常用的傳輸方式之一.
這種技術是由Redback Networks Inc, RouterWare Inc 及
UUNET Technologies Inc 建基於PPP (Point-to-Point) 及 Ethernet 去發展.
PPPoE 的最大好處是使 ISP 能夠利用本身已有的設備去提供寬頻服務
(包括 XDSL, Cable 及 Wireless),對ISP 來說可以減少很多成本.
而 RASPPPoE, NTS EnterNet 及 WinPoET等，
PPPoE上網軟件均可用於任何PPPoE寬頻之上.
什麼是 Gateway ?
Gateway 用以作為兩個不相容網路彼此間連線的連接點或交換點,
像 LAN 就需要藉由通訊閘來與 WAN 作連線.
其主要工作是將本地所用的通訊協定透過通訊閘來轉換成彼端所能辨識的通訊協定.
什麼是子網路遮罩?
子網路是因網路技術的電子限制、工作環境與以區分（或應用原件的功能區分）、或因連結遠端高速線路的需求等理由，而將大型邏輯網路分割為數個小型實際網路的一種程序。
所形成的網路更易整合及管理，透過閘道及路由器將各個小型子網路相互連結，但有可能數個因功能而切割的子網路，實際仍連結在相同的一個網路之中。
子網路遮罩的設定是永以決定網路位址何時結束，主機位址何時開始。
深入了解: http://www.netadmin.com.tw/article_content.aspx?sn=1102080004
參考資料: http://www.cksh.tp.edu.tw/~ckshcnca/net1.htm
何謂 PHP? CGI? ASP? (上)
PHP: 動態網頁的Server端語言，內含於網頁中，可當作HTTP網站程式產生動態的網頁內容。
ASP: 動態網頁的Server端語言，內含於網頁中，使用VBScript 、 JScript等簡單易懂的腳本語言，結合HTML代碼，即可快速地完成網站的應用程序。
CGI: 一種重要的互聯網技術，它獨立於網頁之外，瀏覽器會和 Web 主機上的 Http server 建立一個連線，接著 Http server啟動一個 CGI 程式, 然後將 CGI 程式所產生的內容當成HTML 傳回給使用者瀏覽器。
一般網頁設計的架構分三大層: 內容層、程式邏輯層、展示層。 PHP ASP CGI扮演程式邏輯層的角色。
JavaScript: 內含於網頁中，程式在在USER端、由瀏覽器解譯執行，所以有定義稱它為"半動態網路程式"。透過 JavaScript 可以做到回應使用者的需求事件，而不用任何的網路來回傳輸資料，所以當一位使用者輸入一項資料時，它不用經過傳給伺服端處理，再傳回來的過程，而直接可以被客戶端的應用程式所處理。
問題: JavaScript、ASP/PHP、CGI都是追求互動性動態網頁語言，在網頁設計之中應該如何解釋他們之間的關係、觀念應該如何加強?
參考網站:
http://www.w3school.com.cn/js/index.asp
http://www.guan8.net/Java/1180581.html
http://www.jx828.com/mb/biancheng/ASP/asp_23197.html
ASP: 動態網頁的Server端語言，內含於網頁中，使用VBScript 、 JScript等簡單易懂的腳本語言，結合HTML代碼，即可快速地完成網站的應用程序。
CGI: 一種重要的互聯網技術，它獨立於網頁之外，瀏覽器會和 Web 主機上的 Http server 建立一個連線，接著 Http server啟動一個 CGI 程式, 然後將 CGI 程式所產生的內容當成HTML 傳回給使用者瀏覽器。
一般網頁設計的架構分三大層: 內容層、程式邏輯層、展示層。 PHP ASP CGI扮演程式邏輯層的角色。
JavaScript: 內含於網頁中，程式在在USER端、由瀏覽器解譯執行，所以有定義稱它為"半動態網路程式"。透過 JavaScript 可以做到回應使用者的需求事件，而不用任何的網路來回傳輸資料，所以當一位使用者輸入一項資料時，它不用經過傳給伺服端處理，再傳回來的過程，而直接可以被客戶端的應用程式所處理。
問題: JavaScript、ASP/PHP、CGI都是追求互動性動態網頁語言，在網頁設計之中應該如何解釋他們之間的關係、觀念應該如何加強?
參考網站:
http://www.w3school.com.cn/js/index.asp
http://www.guan8.net/Java/1180581.html
http://www.jx828.com/mb/biancheng/ASP/asp_23197.html
何謂 PHP? CGI? ASP? (下)
前台: 為呈現給網路使用者看到的網站畫面。在網路上所瀏覽的任何一個網頁畫面，都稱為網站的「前台」，包含所有的文字、圖片及動畫效果等，前台的設計就是由網頁設計師所負責的部分。
後台: 後台是用來修改前台的資料內容，而後台的操作介面設計就是由網頁工程師所負責的部分，包含修改公司簡介的介紹文字、上傳相本照片、更換商品圖片、管理會員資料或查看客戶訂單等。所以後台又稱為「內容管理系統 (Content Management System)」，是專門為客戶方便管理網站內容所設計。
資料庫(Database): 一個可以存放大量資料集合的地方，比較正式的定義是-資料庫是由一群相關資料的集合體。資料以不重複的方式來儲存許多有用的資訊，讓使用者可以方便及有效管理所需要的資訊。
伺服器(Server): 通常有兩種解釋，一個為管理資源並為使用者提供服務的電腦軟體，通常分為檔案伺服器（能使使用者在其它電腦存取檔案），資料庫伺服器和應用程式伺服器。而伺服器作為硬體來說，通常是指那些具有較高計算能力，能夠提供給多個使用者使用的電腦。
客戶端(Client): 提供服務的一方我們稱爲伺服器，而接受服務的另一方我們稱作客戶端（Client）。
靜態網頁: 使用HTML(超文本標記語言)，不包含網頁程式(如ASP、PHP、ASP.Net…等)及資料庫的純文字及圖片網頁。
動態網頁: 有包含網頁程式及資料庫的網頁。動態網頁可以透過程式語言結合資料庫的方式，設計出可與網友進行互動的功能，例如：購物車、會員機制、留言板、討論區、投票區、訊息發佈、商品發佈…等，所以有用到資料庫與瀏覽者互動的網頁的叫動態網頁。
結論:
在服務器端運行的程序、網頁、組件，屬於動態網頁，它們會隨不同客戶、不同時間，返回不同的網頁，例如ASP、PHP、JSP、ASP.net、CGI等。
運行於客戶端的程序、網頁、插件、組件，屬於靜態網頁，例如html頁、Flash、JavaScript、VBScript等等，它們是永遠不變的。
參考網站:
http://www.bondlink.com.tw/webdesign/knowledge-show.asp?id=180
http://we.wedo.com.tw/website_design_article-87.htm
http://www.guan8.net/Java/216237.html
後台: 後台是用來修改前台的資料內容，而後台的操作介面設計就是由網頁工程師所負責的部分，包含修改公司簡介的介紹文字、上傳相本照片、更換商品圖片、管理會員資料或查看客戶訂單等。所以後台又稱為「內容管理系統 (Content Management System)」，是專門為客戶方便管理網站內容所設計。
資料庫(Database): 一個可以存放大量資料集合的地方，比較正式的定義是-資料庫是由一群相關資料的集合體。資料以不重複的方式來儲存許多有用的資訊，讓使用者可以方便及有效管理所需要的資訊。
伺服器(Server): 通常有兩種解釋，一個為管理資源並為使用者提供服務的電腦軟體，通常分為檔案伺服器（能使使用者在其它電腦存取檔案），資料庫伺服器和應用程式伺服器。而伺服器作為硬體來說，通常是指那些具有較高計算能力，能夠提供給多個使用者使用的電腦。
客戶端(Client): 提供服務的一方我們稱爲伺服器，而接受服務的另一方我們稱作客戶端（Client）。
靜態網頁: 使用HTML(超文本標記語言)，不包含網頁程式(如ASP、PHP、ASP.Net…等)及資料庫的純文字及圖片網頁。
動態網頁: 有包含網頁程式及資料庫的網頁。動態網頁可以透過程式語言結合資料庫的方式，設計出可與網友進行互動的功能，例如：購物車、會員機制、留言板、討論區、投票區、訊息發佈、商品發佈…等，所以有用到資料庫與瀏覽者互動的網頁的叫動態網頁。
結論:
在服務器端運行的程序、網頁、組件，屬於動態網頁，它們會隨不同客戶、不同時間，返回不同的網頁，例如ASP、PHP、JSP、ASP.net、CGI等。
運行於客戶端的程序、網頁、插件、組件，屬於靜態網頁，例如html頁、Flash、JavaScript、VBScript等等，它們是永遠不變的。
參考網站:
http://www.bondlink.com.tw/webdesign/knowledge-show.asp?id=180
http://we.wedo.com.tw/website_design_article-87.htm
http://www.guan8.net/Java/216237.html
網頁設計範本: Joomla / XOOPS, 優缺點?
Joomla 優點: 元件也非常多使用起來非常簡單， 有些商業佈景有超水準的表現，後台簡潔美觀，適合對界面美觀性要求高的個人、一般中小企業、公司行號來架站。缺點: 對中文的支持不是很好。
XOOPS優點: XOOPS 權限設置方面比較好，能夠對不同用戶組分配不同的使用或管理權限。缺點: 對設計美化重視不足，Xoops在全球來說，已經不太被重視。
其他選擇-Drupal
Drupal 優點: 強大的權限系統，模組多可以架出任何網站。缺點: 學習曲線高、資源需求高、操作介面不直覺。
參考網站:
http://www.joomla.org/
http://blog.cmsart.net/compare-joomla-drupal-wordpress/web-design/
http://www.slideshare.net/bhm/cms-drupal-8302599
http://the008.net/node/357
XOOPS優點: XOOPS 權限設置方面比較好，能夠對不同用戶組分配不同的使用或管理權限。缺點: 對設計美化重視不足，Xoops在全球來說，已經不太被重視。
其他選擇-Drupal
Drupal 優點: 強大的權限系統，模組多可以架出任何網站。缺點: 學習曲線高、資源需求高、操作介面不直覺。
參考網站:
http://www.joomla.org/
http://blog.cmsart.net/compare-joomla-drupal-wordpress/web-design/
http://www.slideshare.net/bhm/cms-drupal-8302599
http://the008.net/node/357
網頁元件CSS定位DIV
網頁元件CSS定位DIV, 座標可能有 "相對"/ "絕對", 可能在不同browser會有不同呈現結果. 以 Firefox / Chrome / IE 做測試
心得:
Absolute(絕對)與Relative(相對)的差別在於定位原始點，定位原始點在不同瀏覽器中與內容的相對位置有些不同，
差別的的原因在div無設定長寬(默認)之下，個瀏覽器默認的div容器高度不太一樣，造成顯示上看起來不一樣。
解決方式: 父元素區塊設定長寬。
參考網站: http://blog.blueshop.com.tw/dplayerd/archive/2008/10/09/57324.aspx
心得:
Absolute(絕對)與Relative(相對)的差別在於定位原始點，定位原始點在不同瀏覽器中與內容的相對位置有些不同，
差別的的原因在div無設定長寬(默認)之下，個瀏覽器默認的div容器高度不太一樣，造成顯示上看起來不一樣。
解決方式: 父元素區塊設定長寬。
參考網站: http://blog.blueshop.com.tw/dplayerd/archive/2008/10/09/57324.aspx
訂閱：
意見 (Atom)