自動產生CSS圓角語法網站

http://border-radius.com/
就是這個網址!
操作非常簡單，就是分別在四個角輸入要的角度，code會自動產生在中間的區塊，下方的三個選擇也可以分別選擇要不要-webkit 或是-moz的前置詞。

Dw 5.5 開啟媒體查詢(Media Queries)

使用dreamweaver cs5.5開啟媒體查詢....，
直接選擇Multiscreen或者是旁邊的倒三角形選擇要看的種類。

媒體查詢簡單來說就是可以看到在不同螢幕顯示的結果
如下分別是手機.平板,下方是PC

甚至可以自訂觀看大小，在媒體查詢裡面也可以點按超連結，所有的介面顯示也會跟著同步還真的蠻方面的~! 

使用dreamweaver5.5 開啟jQuery Mobile

Dreamweaver5.5與之前的版本就差在於多了行動裝置的設計與開發。(cs6都出來了...)

5.5的誕生並不是為了修正之前的錯誤而改版，而是多了很多關於行動裝置開發的工具，還有javascript程式庫.jquery等等.CSS可以設定圓角.陰影，支援HTML5.內嵌自字形。

最重要的是可以藉由5.5開發jquery mobile，它會自動幫你匯入javascript與css架構。

假如要學習使用5.5來開發手機網頁，又不想要看程式碼，可能會有點吃力，因為手機網頁已經不同於我們一般在PC看的網頁，這點是所有網頁設計師都會有點困惑的地方，要記住，不是只設計給PC的人看，所謂行動裝置的設計，不只是指手機，還有平板，牽涉的功能很多，已經不是過去用div切一下就可以解決的問題。 你有css是否符合螢幕的問題.你也有檔案大小的問題。

怎麼使用dw5.5開啟jquery Mobile頁面 :1.請先去adobe下載試用版。但是是英文版。http://www.adobe.com/tw/downloads/

2.開啟後會有一個歡迎介面，這個介面可以選擇你要開啟舊檔，還是開新頁面，由於jquery是範本，所以我們必須點選中間那一欄下面的more....

3.按下more之後，請點選"page from sample"-->"Mobile starters"-->"jquery Mobile (CDN)"

這裡的jquery Mobile (CDN)是指從CDN載入jQuery Mobile程式庫 。(CDN就是content distribution nerwork，內容傳遞網路) 請google。

這裡的這三個 CDN.local phonegap 的差別在最後面介紹 。

4.按下create後就可以看到這個畫面，會產生一個頁面，然後有一些原生的內容，這個畫面總共有四個div(#page~#page4)，每個div都有屬於自己的header跟content還有footer，這其中的關係跟瀏覽出來的結果有什麼關聯，多多嘗試就知道了。
會發現雖然都寫在同一頁，但是實際瀏覽出來的結果卻是分別獨立開來的頁面。

5.接下來請試著去修改頁面的資訊

6.然後我們來瀏覽一下實際狀況是如何，請切換成live view

7.切換後可以看到整個頁面的結果，為什麼可以看到顏色跟css樣式，那是因為產生這個jquery頁面的時候就已經匯入javascript跟css樣式檔了。可以試著點按裡面的連結，在按back回上一頁，只是會有點卡卡的，因為是使用dw的liveview ，如果事實即丟到瀏覽器觀看，應該是不會卡卡的。

8. 怎麼開新jquery檔案就先介紹到這裡，存起來吧，點選file->save as 

9.存檔的時候請放在一個自己知道的資料夾，或是開新資料夾來放資料。檔名取index.html

10. 存好之後你會發現只有一個index.html，是不是怪怪的呢？那些匯入的css跟javascript在哪了?這個問題非常簡單，看了一下index.html的原始碼，你會發現這些匯入的css或是js 都是匯入自http://的連結。

為什麼匯入來自網路的原始碼跟樣板
這是因為在前面我們開新檔案的時候選擇了CDN
CDN就是匯入來自網路所提供的檔案，優點是減少頻寬，降低負擔。
但是要哪天這個網路所提供的檔案停用或者無法上網時，那就會看不到js跟css匯入的效果。

所以如果再存檔的時候你希望連js跟css也一併存在本機的話(這也是我覺得比較保險的作法)，就要選擇第二個 jQuery Mobile(local) (就是本機)的選項，如此一來在存檔的時候就會詢問你是否一併儲存這些相關的檔案到跟目錄。
個人比較建議這種方法，因為比較保險。

先介紹到這裡..。

好用的程式碼編輯工具-notepad++

官方網站連結 : http://notepad-plus-plus.org/

notepad++是自從我開始學php的時候才見識到的編輯器，用了之後覺得真得蠻好用的。
使用其他的語言來開發感覺如何我是不太清楚，但是就以php及html來說，notepad++我倒是覺得很順手。

對我來說它就像是一個...恩 非常高級的筆記本，而且還可以FTP。

網頁這個東西呢，人生第一次碰的時候是國小五年級，那時候電腦老師就教我們用
frontpage來做網站，我還記得老師是怎麼解釋烘培雞的。但是這麼久遠學的東西誰會記得呢?
後來大學通識課，大約前年的時候，學到Dreamweaver，(其實高三的時候就有看了一下工具書，不過看不懂就是了)，但是想想那時候學Dreamweaver根本不太會去管程式碼的部分，畢竟dw的好處就是方便美工人員去排div不是嗎?

好不容易現在進階到想要學PHP了，開始用notepad++去編輯，才發現他的好，再回去看dreamweaver所產生的程式碼，真的不是很習慣，不習慣的是他的排版，還有程式碼產生的地方

但是dw還是有它的好，邊學用key程式碼的方式跟邊學用dw連資料庫做繫結的方式兩面夾攻，我覺得效果蠻好的，一方面是程式碼有時候很抽象，你根本不知道自己在打甚麼，跟機器人依樣一直坐在電腦前，捫心自問剛學的時候真的知道網址後面為甚麼要有?然後=什麼參數又&什麼參數的嗎?

dw的好處就是有個設定的介面，用中文的邏輯引導你，這時再來對照程式碼的地方，有時候才會恍然大悟，"原來這行是這個意思....."。 總有開竅的一天。 

win7 IE擋住下拉選單的顯示(二)

下拉選單在ie無法顯示的問題最近實在很困擾我。

我一直在思考到底是甚麼樣的設定影響了他呢......。

這樣就算了，重點是，發現某些外掛也是無法正常顯示....(題外話)

所以? 要怎麼樣才能符合所有瀏覽器都可以看到下拉選單?!
我在網路上找到一篇文章 :

[CSS教學] - 純CSS二、三階層動態選單按鈕 (完美支援各版本瀏覽器)

，可以作為參考，雖然我目前還沒有機會試一下。

不過也是一線希望~

套用/更換blogger版面

一直以來我都很想換掉本來內建的版面

其實也不是不好，只是看得有點膩了，而且常有種說不出的感覺所以今天下午就研究了一下。


上網google找到了一個提供blogger範本的網站  http://btemplates.com/


這個網站蠻不錯的，可以依照欄位的數量去篩選.風格篩選.色系篩選 

選定喜歡的先下載下來，一個網站分別是一個rar檔

當rar檔打開解壓後會有該網站名的資料夾跟__MACOSX資料夾 (有的範本沒有)

如果是windows系統的就不用看__MACOSX這個資料夾了

而資料夾名為網站名的資料夾打開後有很多檔案，只需要使用附檔名是.xml檔的就可以了

另外也會有教你怎麼設定的html檔 ，也可以參考

比較困難的應該是怎麼套用吧!?(對我來說xd) 

如果不會套用可以先看網站的教學 :

 http://btemplates.com/faqs/#questionhow-to-install-a-blogger-template 

這個教學蠻簡明好懂。

比方說你必須先在範本設定按下右上角的 還原/備份 

這裡的還原與備份並不是只有還原跟備份兩種功能而已..

再來在上載剛剛所下載的.xml檔案，上傳成功版換就換掉了。

但是，該範本所需要設定的相關超連結，必須自己開啟xml修改，比方說email的超連結

或者是你的facebook連結，這些都是必須在xml就先設定好(notepad++ or 筆記本 or dreamweaver等等)再上傳的，


屬於這方面的設定，無法利用blogger現有的介面去調整。

(若有需要可以先備份原本的xml檔 ，以防萬一~) 

blogger這個功能倒是挺上手又安全的。

練習的PHP網站-填答問題用的測驗網站

http://winsystem.zymichost.com/

剛好遇上期中考所以就來弄一個答題的小網站，
這次的練習有點趕，所以css跟一些免費icon的部分都是來自網路templeates
純粹套圖跟結合php進去，很簡單的網站，很純粹的只有計算分數跟寫入填寫人的資料跟時間紀錄而已，為了讓php&mysql都放上網站，所以申請了zymic免費空間..學一下怎麼使用免費的mysql資料庫.，在link_db.php的地方實在有點複雜..... 

不過填答的input欄位都是鎖死的，這部分並沒有用程式去跑，這照理說應該是要這樣。
可能需要時間好好改良一下。
最後填答完按下送出後會出現兩張table，左側為記錄$_POST來的每個答案，右側為正解。
另外此頁結果的頁面為result.php 在填答問題的那一頁分別使用
form action="result?參數="
再用
if ($_GET[參數=?]) 去判斷使用者所填答的考卷是那一份，
分別做不同的計算 再將成績與資料寫進資料庫。 






result.php 部分"

if(isset($_GET['score1'])) //如果來自問卷一
{
$name=$_POST['m_name'];
$date = $_POST['date'];
$score1= 0; //問卷一分數由0開始計算
$q1 = $_POST['q1']; //存取填答人所填答的資料
$q2 = $_POST['q2'];
…
if($q1=="product") //判斷每題的答案
{
$score1+=2; //一題答對就加兩分
}
if($q2=="pricing")
{
$score1+=2;
}
$sql = "INSERT INTO user(M_NAME,M_DATE,M_SCORE1) VALUES ('$name','$date','$score1')";
$result = mysql_query($sql);
}
else if(isset($_GET['score2'])) //如果來自問卷二
{
$name=$_POST['m_name'];
$date = $_POST['date'];
$score2= 0; //問卷二分數由0開始計算
$q1 = $_POST['q1']; //以下做法都相同於上面
$q2 = $_POST['q2'];
…
}

我下載的freeicon來自這個網站: http://www.freeiconsweb.com/
CSS範本 : http://www.freecsstemplates.org

複雜的DOM檔案樹

DOM (document object model)物件檔案模型
是一種介面的定義，當一個.html檔被以瀏覽器開啟的時候，瀏覽器就會去解析該檔案的DOM
.由於瀏覽器可以處理html跟XML的DOM，所以也有人稱DOM檔案樹為html檔案樹或者XML檔案樹。
如果要用瀏覽器來檢視該html的檔案樹，可以使用firefox，工具-->DOM檢視器
每個DOM必須要有一個document的根節。
每個元素在DOM裡面就是一個節點。

另外 DOM也有分版本的
從level 1 --> level2 --> level3 
越後面的版本所支援的當然就比較多
但每個瀏覽器所支援的東西各不相同，所以網頁設計師跟程式設計師才要一直符合各個瀏覽器的執行結果去做調整。目前大部分的瀏覽器可以支援到level2。

先談談level1有甚麼好了，level1只有core DOM 跟DOM html (完全看不出來差在哪裡xdd)
看書本上的寫法，core DOM (核心DOM)好像非常重要，既然叫core，表示他是核心啊~!
也是W3C制定的規範。

我個人覺得對於DOM與Node的存取沒這麼簡單，看起來好複雜...
屬性名稱都很像
光是跟node有關的就一堆
還要一直反反覆覆的key一些getelement....
參考 :  http://school.stackdoc.com/xmldom/dom_htmldocument.html

win7 IE擋住下拉選單的顯示

若要先看到下拉選單

• 點選IE 工具-->相容性檢視 。重新整理後可以先看到下拉選單

可以看看這個網址的說明:
http://www.iefans.net/ieliulanqi-xiala-cadan/

• 或者按下上方選單有個撕開的紙張mark :

最近被下拉選單搞得有點煩
先是js長條圖檔到js下拉選單 後來改用css下拉選單解決問題
現在是flash擋到js下拉選單，但是不管是設定flash還是下拉選單的z-index都沒啥用
反而點一下相容性檢視就可以了 = = 
不過這並不是解決下拉選單顯示的長久之計....
看來還是要想想辦法啊...

Visio2010學習誌(二) -如何開啟開發人員頁籤

先選取檔案-->選項(倒數第二個項目)

再選取左邊項目的"進階" 右邊看到"一般"，打勾"在開發人員模式執行"。

Visio2010學習誌(一) 初體驗

Visio這套軟體呢，是大概約前年修網頁設計的課有點耳聞到的，那時候只知道這是一個做圖表的軟體，但是學校並沒有這套軟體，後來也沒有刻意去學(因為光是學dw就沒什麼時間了xddd ->不過我想這是藉口==”)

後來最近這陣子突然感覺VISIO是不是真的蠻好用的?! 

對於visio的評價我所聽到的都是有好有差，有的人認為PPT也能做出這樣的效果，有的人認為圖表不需要一定要用visio，就算是我現在目前打工的地方也沒有刻意規定企劃要使用visio，但是還是有人用。總之，選擇對自己最有效率的方式，不管使用甚麼軟體都一樣。效果達到即可。

雖然我打工的地方沒用visio，但是我還是想學一下，畢竟學習不是只為了工作跟興趣，而是為了找更更好的工作跟充實自己的一種方式。所以對於visio我也好奇了一陣子，總算是騰出一點時間來摸索一下; 很慶幸的是還好學校圖書館有進最新的visio的書，時間實在抓得太準了xd。

現在的心得是 :

• 接下來會發的visio學習誌應該都是練習的範例而已，這篇算是前言吧。XD
• Visio的介面跟其他office介面很像，所以，很好上手….
• 圖表的繪製跟PPT也蠻像的，就拖進去畫面，打上想要文字，操作一樣。
• 圖形跟圖形之間的連結也類似於PPT
• 但是，比PPT擁有更多內建的圖形，工具書說是範本.或樣板。也就是不管你要畫甚麼圖，都有類似的內建圖形可以用，這點比PPT多太多了。
• 還有可以建立好幾個頁面(圖面)，建立超連結，因為有些圖不是在同一個畫面就可以達到某種效果，比方說網站架構的示範。

什麼是BOM呢

之前只有看過什麼是DOM
但是我今天看一本書竟然有介紹到BOM....
所謂BOM就是browser Object Model - 中文叫做瀏覽器物件模型。
windows物件就是瀏覽器最頂層的一個物件。
windows衍生出其他的物件，常見的為location(地址管理), history,document等等 
也因為windows跟這些其他的物件實現與瀏覽器的互動，所以也有人稱之為BOM。

詳見--掌握html5和RIA應用-張亞飛著。裡面寫的知識蠻多的，但是對我而言某部分有點深了xd

javascript按下按鈕後超連結

<input type="button" value="到首頁" onClick="javascript:window.open('index.php','_self')">
<input type="button" value="連絡我們" onClick="javascript:window.open('contact.php','_self')">

表單 - radio 性別選擇

<input type="radio" name="sex" value="男" checked="男">男
<input type="radio" name="sex" value="女">女

PHP 計算日期相差天數 超過幾天就顯示什麼東西

今天工讀的其中一項任務就是某公司希望只是要在30天以內上傳的資料都要有特別的顯示方式，所謂的特別的顯示方式 ，比如說，只要是在這個期間內的上傳資料都可以用特別的顏色表示，或是加上一閃一閃的NEW字體等等~。


可能是一大早還沒睡醒吧 還要先處理這個新增的功能項目，頭腦簡單的就以為可以以某日期形式欄位 - 當天日期 ($today = date("Y-m-d"))，後來覺得好像事情沒這麼簡單，就google了一下 。
我參考的網址是:
http://www.zzsky.cn/build/content/1536.htm?jdfwkey=7zwqm2
這個網只提供了兩種做法，都蠻好用的。
這個網址其中一種方式是我想要的樣子。
如: 

$today =  date("Y-m-d");  //取得今天日期 $create_time =  $record [ ' 設定時間(或是建立日期)的欄位 ' ] ; $d1 = strtotime ( $ today ) ; $d2 = strtotime (  $create_time 2 ); $Days=round(($d2-$d1)/3600/24); //echo "今天與某筆資料的建立日期相差".$Days."天"; 也就是說 這裡的$Days的值，已經計算出相差的天數了。

//如果上傳影片的日期還在一個月以內 ，就顯示什麼

 if($Days > (-31) )

{

       顯示的東西

      

 }

參考:  strtotime 時間處理: http://www.gocar.idv.tw/phpbb3/viewtopic.php?f=9&t=33

寫給我自己參考的mysql範例

GROUP  BY句子 : 
$query =
 " SELECT  SCHOOL_ITEM , IDENTITY , COUNT( * ) as TOTAL_COUNT FROM student
 where
(SET_TIME between '" . $_POST['form_year'] . "-" . $_POST['form_month'] . "-" . $_POST['form_day'] . "' and '" . $_POST['end_year'] . "-" . $_POST['end_month'] . "-" . $_POST['end_day'] . "')
GROUP BY SCHOOL_ITEM 
ORDER BY SCHOOL_ITEM " ;


LIKE  : 
LIKE '%".$keywords."%'

PHP $_POST接收有迴圈的下拉選單值

錯誤往往在單引號語雙引號之間..... 
我以為我做一個下拉選單的值可以很快，結果弄了很久 = = ，果然別小看看似簡單的事。

事情是這樣的，我原本做了一個以年月日為選項的select下拉選單
，而且，裡面的值，是迴圈。
例如1~12月份的下拉選單 :

<select name="form_month" id="form_month">                         <?php                         for($m=1; $m<= 12 ;$m++)                         {                                 echo '<option value="$m">'.$m.'</option>';                         }                         ?> </select>月

然後這個表單送出去的頁面，必須要以$_POST["form_month"] 來接收，
卻接收到$m月 這樣的結果
$m月!
$m月!
$m月!
$m月!
$m月!
完全沒有1~12其中一個數子耶!
後來在網路爬文看到有人是這樣取
 echo '<option value=$m>'.$m.'</option>';
當然...這樣做我還是錯，因為忘記加了單雙引號以及連接符號。
最後要正確顯示月份必須是這麼寫:

<select name="form_month" id="form_month">                         <?php                         for($m=1; $m<= 12 ;$m++)                         {                                 echo '<option value=" '. $m .' ">'.$m.'</option>';                         }                         ?> </select>月

 如此一來如果選了6月 就會正常的接收到 6月 的6這個值。

PHP 購物車的邏輯

當選好商品按下放入購物車 或者 我要購買之後的頁面

接收需要的$_POST 或是 $_GET 或是$_COOKIE

1. 如果購物車原本就沒有東西 --> 把使用者選取的商品加入購物車

2. 如果購物車原本已經有東西 --> 那就要先取得原本在車子裡的資料
                                                 -->判斷選取的商品是不是有在購物車裡面
                                                          --> 如果有在車裡，那就該像商品增加數量
                                                          --> 沒有在車裡的商品，就將資料寫近購物車
然後儲存購物車的資訊 

某圖瘋狂靠左上角可隨視窗大小改變