使用 HTML、CSS 和 JavaScript 建立功能完整的網頁型手繪素描板應用程式。需求：
1.Canvas 繪圖區：
使用者可以使用滑鼠（桌上型電腦）和觸控輸入（行動裝置/平板電腦）進行繪圖。
在觸控裝置上繪圖時，必須防止頁面捲動和拉動刷新。
繪圖筆觸應為平滑且反鋸齒（無鋸齒邊緣）。
2.工具列（固定在頂部，在小螢幕上可水平捲動）：
包括以下按鈕：
「橡皮擦」
復原
重做
「清除」
「下載」
包括
顏色選擇器 (可使用第三方 JS 函式庫)。
刷子類型選擇器，包含 11 種刷子樣式：
1.普通筆
2.標記
3.螢光筆
4.毛筆
5.虛線
6.噴漆
7.鉛筆（具有紋理效果）
8.螢光筆（具有螢光/光線效果）
9.水彩（半透明混合效果）
10.蠟筆（粗糙質感）
11.筆刷大小選擇器（可調整筆刷寬度）
筆刷在視覺上必須符合其真實的風格，並在渲染時順暢。
3.下載功能：
下載」按鈕必須將繪圖儲存為 PNG 檔案。
檔案格式：drawing-yyyyMMddHHmmss.png（例如，使用目前的日期和時間為 drawing-20250511221530.png）。
下載圖片的寬度和高度必須與目前顯示的畫布比例相符，以確保寬高比一致。
4.回應式和現代化的 UI：
使用極簡和現代的設計。
完全行動友善 (回應式)。
工具列應在小螢幕上自動水平捲動。
在頁面的固定位置或底部加入頁腳。
---
技術說明：
確保觸控事件（如 touchstart、touchmove）可防止預設捲動行為。
使用 requestAnimationFrame 可使繪圖更流暢。
對於筆刷，可在需要時使用 CanvasRenderingContext2D 圖案或像素處理來模擬紋理效果。
使用 CSS Flexbox 或 Grid 來設定佈局樣式，並使用 media queries 來調整反應速度。
已複製
