JPEG 是一種破壞性圖像格式，藉由破壞性壓縮，在視覺可接受的前提下縮小圖檔大小，減少傳輸圖檔所需要的流量，是網路上非常普及的圖片格式，我們知道，JPEG 其實有兩種渲染方式，這個僅在圖檔載入時候會有不一 […]

不少情況下網站都會使用到 HTML Image Map 影像地圖，但 HTML 原生的影像地圖功能缺乏非常多必要的功能，舉例來說就無法套用 CSS 建立特效，一般來說我們都會希望游標移至選擇區時出現特定特效，而不是只有指標變化，除此之外，隨 […]

「Free Online Image Map Generator」是一個可以自動生成 HTML Image Map 影像地圖原始碼的線上工具 ⚙，由於自行尋找圖片上的座標再填入原始碼中相當耗時，為了解省時間，這個工具提供圖像化的介面，只要動動滑鼠將圖上 […]

「JavaScript」有一串原始碼可以讓原本不可編輯的網頁變成可以編輯，這樣您就可以隨時利用各個網站的版型測試文字擺放與字體，非常實用！ ▲原始碼，將其全選後拉入書籤列就可以製作「一顆按鈕讓您可以編輯任何網站」！ ▲利用本文介紹的功能編輯 Google 首頁。

■ 軟體檔案 ■ 軟體名稱 Pingendo 軟體類別 網頁設計 軟體性質 免費軟體 官方網站 https://pingendo.com/ 軟體下載 請到官方網站下載！ 支援系統 Windows、macOS、Linux 支援語言 英文 「Pingendo」是一款視覺化網頁設計軟 […]

■ 軟體檔案 ■ 軟體名稱 Sublime Text 軟體類別 文字編輯 軟體性質 免費軟體 官方網站 https://www.sublimetext.com/ 軟體下載 請到官方網站下載！ 支援系統 Windows、macOS、Linux 支援語言 正體中文（需安裝擴充）、 […]

我在五年前就已經接觸這個 CSS 屬性，所以在這幾年間都有不斷使用這個屬性，更多的圓角可以讓網頁看起來不那麼尖銳，許多的按鈕、方塊都可以套用上圓角，看起來更讚！「border-radius」屬於 CSS3，後面可以 […]

HTML 有一個標籤相當常使用，那就是 <table>，我們真的常常需要在網站上放置表格呈現資料，有時候會想將表格內的儲存格(<th>,<td>)合併，HTML 就有提供兩個屬性，分別可以以 […]

這次來學習 JavaScript（簡稱：JS），首先來學最基本的函數「alert()」，這個函數最主要的功能就是跳出提示視窗，裡面的訊息可以利用「\n」這個 Escape 逸出字元換行，像我能在提示訊息打出第二行前面的斜線，也是依靠 Escap […]

您正在學習網頁前端嗎？或者您是喜歡且擅長寫網頁前端的人？「CodePen」可以當作網頁前端的展示平台，並且能當作線上 HTML、CSS 與 JS 撰寫工具，大部分且必要的功能都是完全免費的，站長非常推薦這個網站！😁 「CodePen」編輯畫面將 HTML […]

過去站長寫網頁版面時常常會遇到一個問題，那就是 CSS3 屬性 padding (內距) 和 border (邊框) 的大小會影響這個元素的大小，也就是其 width (寬度) 和 height (高度)，造成同樣的寬高下，因為不同的內距與邊框造成兩個或多個元素大小完全不同， […]

「Brackets」是 Adobe Systems 開發的一個以 HTML、CSS 及 JavaScript 編寫的 HTML 編輯器。 「Documents Toolbar」是一款 Brackets 擴充功能，主要是讓 Brackets 介 […]

「Brackets」是 Adobe Systems 開發的一個以 HTML、CSS 及 JavaScript 編寫的 HTML 編輯器。 佈景主題是 Brackets 一項可個人化軟體介面與原始碼顏色標記風格的功能，透過「擴充功能 […]

「Brackets」是 Adobe Systems 開發的一個以 HTML、CSS 及 JavaScript 編寫的 HTML 編輯器。 即時預覽功能可以快速查看網頁編寫的成果，只要點 Brackets「檔案」→「即時預覽」，或者按下右側閃 […]

「Brackets」是 Adobe Systems 開發的一個以 HTML、CSS 及 JavaScript 編寫的 HTML 編輯器。 這次要介紹的是非常知名的擴充功能 […]