croppio 一站滿足圖片編輯、影片剪裁與音訊切割的免費網路工具

croppio 一站滿足圖片編輯、影片剪裁與音訊切割的免費網路工具

影音媒體包括圖片、影片與音訊基本三項,而這三項也發展出各自需求不同的周邊工具,以圖片來說像是壓縮、裁剪、轉格式等,影片則提供剪裁及格式轉換功能,音訊部分像是手機鈴聲製作、轉格式等,這些都是常見的工具,很可惜,多數的免費工具都只能滿足單項,而 croppio 這個網路免費工具,則是將這三項通通集合起來,圖片支援 png、 jpg / jpeg、gif,音訊支援 mp3、m4a(AAC)、m4r(iPhone鈴聲)、flac(無損)、WAV(未壓縮)影片則支援 mp4,使用方式就更簡單了,只要將上述檔案格式上傳網站,就能自動判斷可供操作的功能,免去找尋各項媒體工具,一站就幫你搞定。

CSS Button Designer 輕鬆製作網頁使用的按鈕樣式

CSS Button Designer 輕鬆製作網頁使用的按鈕樣式

想要在網頁上對「Button - 按鈕」進行樣式調整,通常會使用背景圖片或是使用 CSS 來調整按鈕的外觀,若要加上當滑鼠移到按鈕的上方或是離開,也會使用 Javascript 來加上,若對繪製這些圖片、Javascript 都不是很熟悉的話,還是要花一些時間來製作,若是偶而用用,建議可以到 CSS Button Designer 這個免費的按鈕樣式產生器來製作,除了可使用 CSS 改變按鈕樣式,也提供滑鼠移到按鈕的上方或是離開時的 Javascript ,製作完成後,直接複製所產生的 Code 便可應用的網頁裡,相當方便。

Menucool CSS Tooltip Generator 提示訊息框 CSS 語法產生器

Menucool CSS Tooltip Generator 提示訊息框 CSS 語法產生器

「提示訊息框」常上網的人應該都有體驗過,也就是滑鼠指標指到某一物件,會出現提示訊息,告訴用戶該如何操作或其意義,如果想要在自己的網頁中加入這種提示訊息,也不用從頭打造起,可以透過 Menucool 這個網站所製作的 CSS Tooltip Generator 這個 Tooltip 產生器,只要對其提供的參數進行調整,就能輕鬆製作出符合各大主流瀏覽器都適用的提示訊息框。

CSS Tooltip Generator 提示訊息框 CSS 語法產生器

CSS Tooltip Generator 提示訊息框 CSS 語法產生器

瀏覽網頁時,當我們看到帶有 ? 的圖示符號,通常將滑鼠指標指過去就會出現提示框,而其內容是解釋其意義或是提示使用者該如何操作等,而其出現的位置,可能會是在 ? 圖示符號的上、下、左、右。對 CSS 的初學者而言,要產生這樣的提示框並不容易,但我們可以透過一些輔助工具像是 CSS Tooltip Generator 這個免費網站,使用者僅需修改簡單的參數,便可以快速產生自己理想中的提示框,然後複製其產生的 CSS 語法,就可以應用到網頁內,相當方便。

CSS WAND - CSS 動畫免費應用

CSS WAND  - CSS 動畫免費應用

如果網頁要使用一些動畫圖示,例如滑鼠移動按鈕上方,按鈕的形狀會改變或是等待時常見到的 loading 動畫圖示,這些在以往可能需要 JavaScript 或是 gif 圖片來協助實現,而現在你也可以單純利用 CSS 語法就可辦到,CSS WAND 提供 Hover、Loading 類型的 CSS 動畫,只要複製該範例的 CSS 語法,就可以將範例應用到自己的網頁,相當方便。

如何用 CSS 做出滑動開/關切換按鈕?

如何用 CSS 做出滑動開/關切換按鈕?

在 Windows、Android、IOS 或是網頁上經常都可以看到滑動型的開/關切換按鈕,如果自己在網頁上要做出如此效果的按鈕,免用 Javascript 就可以辦到,proto.io 網站提供滑動開/關切換按鈕 CSS 語法產生器,透過介面輸入所需條件,便可產生 CSS 語法,方便你應用在網頁上。

littlesnippets.net 免費取得 CSS、JavaScript 動畫效果程式碼

littlesnippets.net 免費取得 CSS、JavaScript 動畫效果程式碼

寫網頁時難免會有需要一些動畫效果,例如當滑鼠指標在按鈕、圖片、功能表上或離開時,或是希望做出具有專業水準個人檔案、新聞、產品卡時,如果是初學者想要從無到有,可能需要花費較長時間,要是可以參考別人已做出的效果,取得其程式碼再來修改成自己想要的效果,這樣才能事半功倍。littlesnippets 這個網站提供按鈕、圖片、Logo、News Card、Menu、Profile Card ....等各式各樣的 CSS + JQuery 效果,且每個都有效果展示,更提供 HTML、CSS、JQuery 完整的範例程式碼,用戶只需取得這些程式碼,稍加修改,就可以在自己網頁呈現,相當方便。

angryTools CSS Animation Kit 純 CSS 語法動態特效產生器

angryTools CSS Animation Kit 純 CSS 語法動態特效產生器

寫網頁時,當需要應用一些特效,例如標題文字會閃動、旋轉等,以吸引讀者的注意,很多人都會考慮使用 JavaScript 來實現,如果要透過 CSS 來呈現,對 CSS 語法不熟悉,則變成是一個困擾,即便寫出,還要考慮各大瀏覽器的支援程度。angryTools 網站提供 CSS Animation Kit 產生的文字特效,支援 Edge、Chrome 主要瀏覽器,選好效果可立即檢視與產生 CSS 語法,複製即可使用,簡單方便。

CSS3 Animation 套用 CSS 3 動畫語法範本,就讓網站輕鬆動起來

CSS3 Animation 套用 CSS 3 動畫語法範本,就讓網站輕鬆動起來

以前想要讓網頁有動畫效果,多數要靠 JaveScript、GIF 或是 Flash,而現在則可以透過 CSS 3,不過想要透過 CSS 3 語法來做動態特效,其學習門檻著實不低。但若只想在網頁放一些較為簡單的特效,可以來參考 CSS3 Animation 這個網站所提供的 CSS 3 動畫語法免費範本,下載後,只要經過簡單的語法加工,就能套用範本,讓自己的網頁輕鬆動起來。

Cut the Rope 超好玩的剪斷繩子遊戲

Cut the Rope 超好玩的剪斷繩子遊戲

Cut the Rope 是一個網頁益智遊戲,簡單又富有力學技巧,是繼憤怒鳥(Angry Birds)後,一個非常適合大、小朋友一起玩的網頁遊戲,遊戲中,何時該剪斷繩子,讓吊掛的氣球可以將周圍的星星擊破又能順利進入青蛙(...估計是青蛙...)的嘴巴裡,遊戲時,別忘了開聲音,遊戲中的配樂還滿好聽的,Cut the Rope 同時可在 iPhone、iPad 及 Android 與網頁瀏覽器來玩,適用的瀏覽器為微軟 IE 9,不過我用 Google Chrome 也能沒甚麼問題,有興趣的朋友趕快來玩!

CyberSyndrome 線上搜尋最即時的 Proxy 列表及 Proxy 相關工具

CyberSyndrome 線上搜尋最即時的 Proxy 列表及 Proxy 相關工具

有些網站所提供的服務會僅限於當地或某些地區可以使用或是有限制連出區域或網域名稱的地區,通常最簡單的解決方式就是使用 Proxy Server (若對 Proxy 伺服器,還不是很清楚作用的話,建議可到 維基百科 閱讀 「代理伺服器」的相關資訊),透過對瀏覽器設定「Proxy 伺服器」就可以解決大多數的上述情況,然而 Proxy Server 從何而來,那些還是有用的 Proxy Server,有沒有相關工具可以協助,要找當地的 Proxy Server ...等,這些問題基本上都可以在 CyberSyndrome 這個免費的日本網站上得到最佳的協助。

Da Button Factory 線上網頁按鈕產生器

Da Button Factory 線上網頁按鈕產生器

Da Button Factory 是一個可以在線上製作網頁按鈕的免費產生器,所產生的網頁按鈕會包含已使用的背景圖片(PNG、GIF、JPEG、ICO)及相對應的 CSS 程式碼可供下載,讓你方便應用在網頁上;Da Button Factory 可讓使用者自訂所要產生網頁按鈕的樣式,亦可參考所提供的網頁按鈕範例再行修改,讓你幾乎不需要有任何美工的技巧,就能輕易做出有水準網頁按鈕。