選單
×
   ❮     
HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP 如何做 W3.CSS C C++ C# BOOTSTRAP REACT MYSQL JQUERY EXCEL XML DJANGO NUMPY PANDAS NODEJS R TYPESCRIPT ANGULAR GIT POSTGRESQL MONGODB ASP AI GO KOTLIN SASS VUE DSA GEN AI SCIPY AWS CYBERSECURITY DATA SCIENCE
     ❯   

HOW TO

HowTo Home

Menus

圖示欄 選單圖示 手風琴 選項卡 垂直選項卡 選項卡標題 全屏選項卡 懸停選項卡 頂部導航 響應式頂部導航 分割導航 帶圖示的導航欄 搜尋選單 搜尋欄 固定側邊欄 側邊導航 響應式側邊欄 全屏導航 畫布外選單 懸停側邊欄按鈕 帶圖示的側邊欄 水平滾動選單 垂直選單 底部導航 響應式底部導航 底部邊框導航連結 右對齊菜單鏈接 居中菜單鏈接 等寬菜單鏈接 固定選單 滾動時下拉導航欄 滾動時隱藏導航欄 滾動時收縮導航欄 粘性導航欄 圖片上的導航欄 懸停下拉選單 點選下拉選單 級聯下拉選單 頂部導航中的下拉選單 側邊導航中的下拉選單 響應式導航欄下拉選單 子導航選單 向上下拉選單 巨型選單 移動裝置選單 窗簾選單 摺疊側邊欄 摺疊側面板 分頁 麵包屑導航 按鈕組 垂直按鈕組 粘性社交媒體欄 藥丸導航 響應式標題

圖片

幻燈片 幻燈片畫廊 模態影像 燈箱 響應式影像網格 影像網格 影像畫廊 可滾動影像畫廊 選項卡畫廊 影像疊加褪色 影像疊加滑動 影像疊加縮放 影像疊加標題 影像疊加圖示 影像效果 黑白影像 影像文字 影像文字塊 透明影像文字 全頁影像 影像上的表單 英雄影像 模糊背景影像 滾動時更改背景 並排影像 圓角影像 頭像影像 響應式影像 居中影像 縮圖 影像邊框 團隊介紹 粘性影像 翻轉影像 搖晃影像 作品集畫廊 帶過濾的作品集 影像縮放 影像放大鏡 影像比較滑塊 網站圖示

按鈕

警報按鈕 輪廓按鈕 分割按鈕 動畫按鈕 淡入淡出按鈕 圖片上的按鈕 社交媒體按鈕 閱讀更多/更少 載入按鈕 下載按鈕 藥丸按鈕 通知按鈕 圖示按鈕 上一頁/下一頁按鈕 導航中的更多按鈕 塊狀按鈕 文字按鈕 圓形按鈕 滾動到頂部按鈕

表單

登入表單 登錄檔單 結賬表單 聯絡表單 社交登入表單 登錄檔單 帶圖示的表單 新聞通訊 堆疊表單 響應式表單 彈出表單 內聯表單 清除輸入欄位 隱藏數字箭頭 將文字複製到剪貼簿 動畫搜尋 搜尋按鈕 全屏搜尋 導航欄中的輸入框 導航欄中的登入表單 自定義複選框/單選按鈕 自定義選擇框 切換開關 檢查複選框 檢測大寫鎖定 按 Enter 鍵觸發按鈕 密碼驗證 切換密碼可見性 多步表單 自動完成 關閉自動完成 關閉拼寫檢查 檔案上傳按鈕 空輸入驗證

Filters

篩選列表 篩選表格 篩選元素 篩選下拉選單 排序列表 排序表格

表格

斑馬條紋表 居中文件 全寬表 巢狀表 並排表 響應式表 對比表

More

全屏影片 模態框 刪除模態框 時間線 滾動指示器 進度條 技能條 範圍滑塊 顏色選擇器 電子郵件欄位 工具提示 懸停顯示元素 彈出視窗 可摺疊 日曆 HTML 包含 待辦事項列表 載入器 徽章 星級評分 使用者評分 疊加效果 聯絡晶片 卡片 翻轉卡片 個人資料卡片 產品卡片 警報 呼叫 筆記 標籤 絲帶 標籤雲 圓圈 樣式 HR 優惠券 列表組 帶徽章的列表組 無專案符號的列表 響應式文字 鏤空文字 發光文字 固定頁尾 粘性元素 相等高度 清除浮動 響應式浮動 訊息提示 全屏視窗 滾動繪圖 平滑滾動 漸變背景滾動 粘性標題 滾動時縮小標題 定價表 視差滾動 寬高比 響應式 iframe 切換喜歡/不喜歡 切換隱藏/顯示 切換暗模式 切換文字 切換類 新增類 刪除類 更改類 活動類 樹狀檢視 刪除小數 刪除屬性 離線檢測 查詢隱藏元素 重定向網頁 格式化數字 懸停縮放 翻轉框 垂直居中 DIV 中的居中按鈕 居中列表 懸停過渡 箭頭 形狀 下載連結 全高元素 瀏覽器視窗 自定義捲軸 隱藏捲軸 顯示/強制顯示捲軸 裝置外觀 Contenteditable 邊框 佔位符顏色 停用文字區域調整大小 停用文字選擇 文字選擇顏色 專案符號顏色 垂直線 分隔符 文字分隔符 動畫圖示 倒計時器 打字機 即將上線頁面 聊天訊息 彈出聊天視窗 分屏 客戶評價 部分計數器 名言幻燈片 可關閉列表項 典型的裝置斷點 可拖動的 HTML 元素 JS 媒體查詢 語法高亮 JS 動畫 JS 字串長度 JS 指數運算 JS 預設引數 JS 隨機數 JS 對數字陣列排序 JS 展開運算子 JS 滾動到檢視 獲取當前日期 獲取當前 URL 獲取當前螢幕尺寸 獲取 iframe 元素

網站

建立免費網站 製作網站 製作靜態網站 託管靜態網站 製作網站(W3.CSS) 製作網站(BS3) 製作網站(BS4) 製作網站(BS5) 建立和檢視網站 建立 Link Tree 網站 建立作品集 建立簡歷 製作餐廳網站 製作商務網站 製作 WebBook 居中網站 聯絡部分 關於頁面 大標題 示例網站

Grid

2 列布局 3 列布局 4 列布局 展開式網格 列表網格檢視 混合列布局 列卡片 鋸齒佈局 部落格佈局

Google

Google Charts Google Fonts Google Font 配對 Google 設定分析

Converters

轉換重量 轉換溫度 轉換長度 轉換速度

部落格

獲得開發人員工作 成為前端開發人員 聘請開發人員

如何 - 建立免費網站


使用 W3Schools Spaces 構建和託管您的網站。

只需點選幾下即可開始建立您的免費網站。

您需要的一切都在瀏覽器中。

它易於使用 - 試試吧!

立即開始 »

使用 W3Schools Spaces 建立您的第一個網站

W3Schools Spaces 是一個您可以構建和試驗程式碼並託管自己網站的個人空間。

使用 W3Schools Spaces,您可以構建 HTML、CSS 和 JavaScript。

直接在瀏覽器中編輯程式碼。

上傳和託管您的檔案和影像。

今天就開始發展您的線上影響力吧!


為什麼選擇 W3Schools Spaces 構建?

Spaces 由 Web 開發人員為 Web 開發人員建立。

  1. 介面簡潔易用。
  2. 直接在瀏覽器中託管和編輯您的檔案。
  3. 免費模板。

入門是免費的,您無需輸入信用卡資訊。


編輯和預覽程式碼

編輯器易於使用 - 這有助於您專注於最重要的事情。

透過不同的預覽選項檢查您網站的響應能力。

即時預覽您網站上的更改!


隨時隨地構建

將您的檔案和影像託管在雲中。

透過建立資料夾結構來保持有序。

您需要的一切都在瀏覽器中。


免費模板

瀏覽並使用我們的響應式網站模板。

修改、儲存、共享並將其用於您的專案。

模板由W3.CSS 提供支援



開始需要了解什麼?

HTML、CSS 和 JavaScript 是構建網站的基礎語言。

  1. 使用 HTML 建立結構。 您需要學習的第一件事是 HTML,它是建立網頁的標準標記語言。
  2. 學習 HTML »
  3. 使用 CSS 設定樣式。 下一步是學習 CSS,用漂亮的顏色、字型等設定網頁的佈局。
  4. 學習 CSS »
  5. 使用 JavaScript 使其具有互動性。 在學習了 HTML 和 CSS 之後,您應該學習 JavaScript 來為您的使用者建立動態和互動式的網頁。
  6. 學習 JavaScript »

如果您不知道如何編碼,請不要擔心。最重要的是儘早動手。學習編碼的最佳方法是進行實踐。今天就開始構建一些東西吧!


讓我們在幾個步驟內開始

您是否已有 W3Schools 賬戶?如果是,請跳過第一步。


第一步:註冊賬戶

為了能夠使用 Spaces,您需要註冊並獲取您的賬戶。

讓我們為您設定好!

轉到W3Schools 個人資料 - 點選“註冊”並輸入您的電子郵件和密碼,然後點選“免費註冊”按鈕。

請務必在您的電子郵件中驗證您的賬戶。如果您在收件箱中找不到驗證電子郵件,請檢查垃圾郵件資料夾。

在我們的文章中獲取有關如何註冊的更多資訊 - 如何註冊


第二步:從模板或 HTML 骨架開始

轉到W3Schools Spaces

選擇其中一個選項,然後點選“繼續”按鈕。

不要太擔心這個決定。您可以隨時重置您的 Space 並重新開始。


第三步:給您的空間命名

透過給您的 Space 起一個令人驚歎的名字來個性化它。

名稱中不能使用特殊字元,例如 (#, ! 或 :)。唯一的例外是連字元 ( - )

名稱將成為您與他人分享以檢視您的網站的連結。例如:yourname.w3spaces.com


第四步:進入您的空間

太棒了!您已成功進入儀表板。

在儀表板中,您可以概覽您的空間和使用情況。

透過單擊空間行內的某個位置,或單擊行內右側的三點按鈕,來進入您的空間及其檔案概覽

免費計劃只能擁有一個空間。但是,您可以隨時升級以獲取更多空間。


第五步:編輯程式碼或上傳檔案

這就是魔法發生的地方!

開始編輯程式碼上傳檔案

  • 透過點選要編輯的檔案旁邊的“筆形圖示”來編輯程式碼。
  • 透過點選“新建檔案”按鈕來建立新檔案。
  • 透過點選“上傳檔案”按鈕來上傳檔案。

第六步:釋出您的網站並與他人分享

這是您開始建立線上影響力的起點。

學習、測試、構建並讓您的空間上線。

建立您的網站並與他人分享。

注意:您的空間名稱加上 .w3spaces.com 副檔名就是您的可共享連結。在此文章中瞭解有關如何分享您的空間的更多資訊:如何分享我的空間?


W3Schools Spaces

W3Schools Spaces

使用 W3Schools Spaces 構建您自己的網站。

免費開始



×

聯絡銷售

如果您想將 W3Schools 服務用於教育機構、團隊或企業,請傳送電子郵件給我們
sales@w3schools.com

報告錯誤

如果您想報告錯誤,或想提出建議,請傳送電子郵件給我們
help@w3schools.com

W3Schools 經過最佳化,旨在方便學習和培訓。示例可能經過簡化,以提高閱讀和學習體驗。教程、參考資料和示例會不斷審查,以避免錯誤,但我們無法保證所有內容的完全正確性。使用 W3Schools 即表示您已閱讀並接受我們的使用條款Cookie 和隱私政策

版權所有 1999-2024 Refsnes Data。保留所有權利。W3Schools 由 W3.CSS 提供支援