2015年3月31日

[教學] PHP & MySQL 學習筆記 第九堂(資料庫建置:搜尋並篩選資料庫的資料後呈現於網頁)

非常抱歉,關於部落格內 PHP 的部分目前已經停止維護,因本人已經很久沒有寫 PHP ,且文章中所使用的 PHP 版本偏舊,希望有心學習 PHP 的朋友們,可以參考 Codecademy 的課程,或近一步嘗試 Laravel 這個 PHP 框架(可透過 laracasts 學習),若有找不到錯的學習資源也歡迎在留言串分享,方便有需要的人能夠有更多學習的管道!
在這一堂課我們會沿用上堂課所使用的資料庫,透過語法來練習怎麼樣篩選資料,並把篩選後資料呈現於網頁上。

結果可以看這裡

[教學] PHP & MySQL 學習筆記 第八堂(資料庫建置:phpMyAdmin資料庫建置並呈現於網頁)

非常抱歉,關於部落格內 PHP 的部分目前已經停止維護,因本人已經很久沒有寫 PHP ,且文章中所使用的 PHP 版本偏舊,希望有心學習 PHP 的朋友們,可以參考 Codecademy 的課程,或近一步嘗試 Laravel 這個 PHP 框架(可透過 laracasts 學習),若有找不到錯的學習資源也歡迎在留言串分享,方便有需要的人能夠有更多學習的管道!
在這一堂課中,我們會開始接觸到資料庫,並且學習透過語法,把需要的資料以網頁的方式加以呈現。

結果可以看這裡

2015年3月29日

[分享] CSS中Padding和Margin的差別

在CSS中,我們常常會用到padding和margin來調整圖片或內文的位置,因為有些時候用margin和padding就能達到同樣的效果,所以會搞不清楚這兩者的差別。

W3Schools找到了一張很容易瞭解這兩者差異的圖:

CSS box-model
圖片來源:W3Schools
簡單來說,margin是調整border外的邊界;padding則是調整border內到內文之間的距離。

2015年3月25日

2015年3月24日

[教學] PHP & MySQL 學習筆記 第七堂(簡易SESSION和COOKIE建置)

非常抱歉,關於部落格內 PHP 的部分目前已經停止維護,因本人已經很久沒有寫 PHP ,且文章中所使用的 PHP 版本偏舊,希望有心學習 PHP 的朋友們,可以參考 Codecademy 的課程,或近一步嘗試 Laravel 這個 PHP 框架(可透過 laracasts 學習),若有找不到錯的學習資源也歡迎在留言串分享,方便有需要的人能夠有更多學習的管道!
在很多地方我們會暫時儲存下網友的資料,例如購物的網站會記錄下你把哪些商品放到購物車當中;有些網站則會紀錄下你已經登入過,因此你不用每次再重新打密碼,這些會需要用到SESSION和COOKIE這兩個變數,這堂課我們會簡單說明SESSION和COOKIE的使用。

先來看看最終的結果:SESSSION COOKIE

2015年3月23日

[教學] PHP & MySQL 學習筆記 第六堂(上傳檔案建置)

非常抱歉,關於部落格內 PHP 的部分目前已經停止維護,因本人已經很久沒有寫 PHP ,且文章中所使用的 PHP 版本偏舊,希望有心學習 PHP 的朋友們,可以參考 Codecademy 的課程,或近一步嘗試 Laravel 這個 PHP 框架(可透過 laracasts 學習),若有找不到錯的學習資源也歡迎在留言串分享,方便有需要的人能夠有更多學習的管道!
在很多地方我們都可以輕易的幫我們的檔案上傳到伺服器(雲端),在今天第六堂課,就要來學習如何建置一個簡單的上傳檔案系統。

先來看看最終成果

2015年3月20日

[教學] 修改google blogger中「繼續閱讀」的css樣式

如同前一篇文章([教學] 修改google blogger標籤雲的css樣式)所提的方法,我們一樣可以在「範本」的「自訂」中選擇「進階」的「新增CSS」來修改blogger繼續閱讀的樣式。

在繼續閱讀的樣式在blogger中的名稱是「.jump_link」,因此只要根據這個來修改裡面的CSS,就可以修改「繼續閱讀」的樣式了。

[教學] 修改google blogger標籤雲的css樣式

最近在逛網頁的時候,發現網站旁邊的標籤雲好像可以修改,於是在網站上搜尋了一下,逛到了一個網站很不錯,提供了許多blogger修改的方式,網站是WFU BLOG,有興趣的大家可以參考看看,以下將介紹可以如何進行標籤雲CSS樣式的修改。

2015年3月18日

[教學] jQuery學習筆記 第五堂(製作最流行的圖片輪撥效果:淡入淡出效果、自動輪撥功能、輪撥停止設定、)


在第五堂課當中,我們要學習製作目前最流行的圖片輪撥方式,不同於以往透過gif的動畫呈現一張又一張的廣告,現在最常見的是在圖片的下方會出現許多的「點點」,讓你可以去選你想要看的圖片,當你不選的時候,則會自動輪轉。

這堂課中,我們會學習到許多不同的語法,像是:淡入淡出fade、位置移動position、指標修改cursor、屬性修改attr、時區設立setInterval、取消時區clearInterval、滑鼠進入mouseover、滑鼠移出mouseout。

製作出來的結果就像這樣子。

2015年3月17日

2015年3月16日

[教學] PHP & MySQL 學習筆記 第五堂(瀏覽人數計數器製作)

非常抱歉,關於部落格內 PHP 的部分目前已經停止維護,因本人已經很久沒有寫 PHP ,且文章中所使用的 PHP 版本偏舊,希望有心學習 PHP 的朋友們,可以參考 Codecademy 的課程,或近一步嘗試 Laravel 這個 PHP 框架(可透過 laracasts 學習),若有找不到錯的學習資源也歡迎在留言串分享,方便有需要的人能夠有更多學習的管道!
第五堂課,我們要來練習製作一個計數器,可以記錄網站有多少人來瀏覽過。


可以玩玩看這次的成果喔:

2015年3月15日

[教學] PHP & MySQL 學習筆記 第四堂(表單製作;回圈建立;訂單、問卷的製作與儲存)

非常抱歉,關於部落格內 PHP 的部分目前已經停止維護,因本人已經很久沒有寫 PHP ,且文章中所使用的 PHP 版本偏舊,希望有心學習 PHP 的朋友們,可以參考 Codecademy 的課程,或近一步嘗試 Laravel 這個 PHP 框架(可透過 laracasts 學習),若有找不到錯的學習資源也歡迎在留言串分享,方便有需要的人能夠有更多學習的管道!
第四堂課,我們要來練習製作一個貨品的訂購表單,什麼是訂購表單呢?也就是透過網路就可以下單,選擇你要購買的物品、出貨地點和數量;另外表單也可以用來製作問卷。
可以玩玩看這次的成果喔:

2015年3月9日

[教學] jQuery學習筆記 第四堂(hover語法:滑鼠移過表格時,該列產生不同格式色彩或字體)


在閱讀網頁表格的時候,如果表格太多,瀏覽網頁的人常會無法對齊,不知道自己現在看的是哪一列,這時候,有一個作法是把奇數列和偶數列用不同的底色呈現,就像我們在上一堂課所教的,可參考:jQuery學習筆記 第二堂

另一種辦法是我們這裡要用的,我們想要讓滑鼠移到某一列的時候(完成結果),那一列的底色就會變色,讓我們看看要怎麼做吧!

2015年3月8日

[教學] jQuery學習筆記 第二堂(表格建立、表格中套色,奇偶列不同色)



第二堂課中,主要的學習表格的建立,將每一表格套用同樣底色或是根據奇偶數列有不同的底色,這堂課中,我們會學習利用HTML、CSS和jQuery的不同方式來達到這樣的效果。

結果就像這樣:結果一結果二

2015年3月7日

[筆記] jQuery學習筆記 第一堂(軟體安裝、文字格式修改)


最近從零開始,報名了台大計中的網頁設計課程,在這們的課中主要是學習jQuery的應用,但因為我們都還沒有任何網頁設計的底子,因此會先學習一些基本的HTML和CSS。

第一堂課中,主要的目標就是要安裝程式開發的基本軟體,另外學習基本的HTML和CSS語法。

完成的成果就像這樣子

2015年3月6日

[教學] PHP & MySQL 學習筆記 第三堂(抽卡遊戲製作)

非常抱歉,關於部落格內 PHP 的部分目前已經停止維護,因本人已經很久沒有寫 PHP ,且文章中所使用的 PHP 版本偏舊,希望有心學習 PHP 的朋友們,可以參考 Codecademy 的課程,或近一步嘗試 Laravel 這個 PHP 框架(可透過 laracasts 學習),若有找不到錯的學習資源也歡迎在留言串分享,方便有需要的人能夠有更多學習的管道!
第三堂課,延續前一堂課所使用的圖片,主要目標是要寫一個抽卡遊戲,電腦會從5張卡中隨機選一張牌,我們也選一張,如果選中一樣的就算贏了(怎麼聽起來有點無聊!?)


為了要達到這個目標,我們有兩個主要的學習目標:
1.在同一個網址呈現兩個不同的畫面
2.使用if函數,讓電腦判斷兩張圖片是否相同

[教學] PHP & MySQL 學習筆記 第二堂(圖片插入,隨機函數使用)

非常抱歉,關於部落格內 PHP 的部分目前已經停止維護,因本人已經很久沒有寫 PHP ,且文章中所使用的 PHP 版本偏舊,希望有心學習 PHP 的朋友們,可以參考 Codecademy 的課程,或近一步嘗試 Laravel 這個 PHP 框架(可透過 laracasts 學習),若有找不到錯的學習資源也歡迎在留言串分享,方便有需要的人能夠有更多學習的管道!
第二堂課的主要目標是要寫學會插入圖片,並且可以讓圖片在每一次登入網站時隨機選擇一張呈現。

為了要完成這個遊戲,我們有幾個不同的學習目標
1.在網頁中插入圖片
2.使用隨機函數,讓圖片可以隨機呈現

完成的成果就像這樣

2015年3月4日

[教學] PHP & MySQL 學習筆記 第一堂(軟體安裝、時間輸出)

非常抱歉,關於部落格內 PHP 的部分目前已經停止維護,因本人已經很久沒有寫 PHP ,且文章中所使用的 PHP 版本偏舊,希望有心學習 PHP 的朋友們,可以參考 Codecademy 的課程,或近一步嘗試 Laravel 這個 PHP 框架(可透過 laracasts 學習),若有找不到錯的學習資源也歡迎在留言串分享,方便有需要的人能夠有更多學習的管道!

第一堂課主要有幾個學習目標

1.在自己的電腦安裝模擬的伺服器
2.學習一些基本的函數語法,包含輸出文字,輸出時間

完成的結果就像這樣