網頁設計完全攻略HTML、CSS、JavaScript、Bootstrap、jQuery、Vue.js、RWD｜搭配ChatGPT效率加倍 (1版)

類似書籍推薦給您

簡介 這是一本內容非常齊全的網頁設計書籍，網羅最新技術、最新語法、最多範例，包含下列的【7大主題】和【超過700個範例程式】，全彩印刷，圖解詳盡，觀念正確，讓讀者快速學會網頁設計的關鍵技術！ ．HTML ．CSS ．JavaScript ．Bootstrap ．jQuery ．Vue.js ．響應式網頁設計 (RWD) 除了分篇分章進行語法教學，目前最熱門的【ChatGPT】也是重要主題，我們會介紹如何使用ChatGPT學習網頁設計，包括撰寫網頁程式、解讀網頁程式、加註解、除錯、查詢語法、尋求技術支援、出題練習、解題、與其它程式語言做轉換等。 為了讓讀者體驗如何將各種語法活用到實際的網頁設計，不再陷入只會語法，卻不知如何活用的窘境，我們設計了【三大響應式網頁範例】－【圖庫網站】、【旅遊網站】和【部落格網站】，其中第一個範例是使用HTML和CSS手刻響應式網頁，而第二、三個範例是使用HTML、CSS和Bootstrap開發響應式網頁，這些範例均相當精美，對於設計人員開發網頁、老師設計教學範例、學生製作專題或參加競賽都極具參考價值。 學習重點------------------------------------------------------------ 【第0章－ChatGPT】 在本章中，我們會介紹如何使用ChatGPT學習網頁設計，例如撰寫網頁程式、解讀網頁程式、加註解、除錯、查詢語法、尋求技術支援、出題練習、解題、與其它程式語言做轉換等。 【第1篇－HTML】 HTML可以用來定義網頁的內容，開發各種網頁應用程式。在本篇中，我們會介紹HTML常用的元素，例如文件結構、資料編輯與格式化、嵌入內容、表格、表單等。 【第2篇－CSS】 CSS可以用來定義網頁的外觀，包括編排、顯示、格式化及特殊效果。在本篇中，我們會介紹CSS常用的屬性，例如色彩、字型、文字、清單、Box Model、定位方式、背景、漸層、濾鏡、表格、Flexbox Layout、Grid Layout、變形、轉場、動畫、媒體查詢等。 【第3篇－JavaScript】 JavaScript可以用來定義網頁的行為，在本篇中，我們會介紹JavaScript的基本語法，包括型別、變數、常數、運算子、流程控制、函式、物件等，還會介紹JavaScript在瀏覽器端的應用，也就是如何利用JavaScript讓靜態網頁具有動態效果，包括文件物件模型 (DOM)、瀏覽器物件模型 (BOM)、事件處理等。 【第4篇－網頁前端框架】 除了最核心的HTML、CSS和JavaScript，還有許多應用於JavaScript程式開發的函式庫與框架，在本篇中，我們會介紹下列幾種技術： ．Bootstrap：是很受歡迎的HTML、CSS與JavaScript框架，用來開發響應式 (responsive)、行動優先 (mobile first) 的網頁，使用者無須撰寫CSS或JavaScript程式碼，就可以輕鬆設計出響應式網頁。 ．jQuery：是一個快速、輕巧、功能強大的JavaScript函式庫，透過它所提供的API，可以讓諸如操作HTML文件、選擇HTML元素、處理事件、建立特效、使用Ajax技術等動作變得更簡單。 ．Vue.js：這個JavaScript函式庫，提供API讓Web開發人員進行資料繫結及操作網頁上的元素，解決畫面顯示與資料狀態同步的問題。 此外，我們還會介紹【響應式網頁設計】(RWD，Responsive Web Design)，這是一種網頁設計方式，目的是根據使用者的瀏覽器環境 (例如寬度或方向等)，自動調整網頁的版面配置，以提供最佳的顯示結果，同時設計了【3大響應式網頁範例】－圖庫網站、旅遊網站、部落格網站，讓您不只懂語法，更懂如何運用到實際的網頁設計。 目錄 第00章　網頁設計 x ChatGPT 　　0-1　開始使用 ChatGPT 　　0-2　查詢網頁設計相關的語法 　　0-3　查詢網頁設計相關的技術建議 　　0-4　撰寫網頁程式與除錯 　　0-5　與其它程式語言互相轉換 　　0-6　提供練習測驗與解答 【Part 1　HTML】 第01章　網頁設計基礎 　　1-1　網站建置流程 　　1-2　網頁設計相關的程式語言 　　1-3　HTML 的發展 　　1-4　HTML 文件的編輯工具 　　1-5　HTML 文件的基本結構 　　1-6　撰寫第一份 HTML 文件 第02章　文件結構 　　2-1 HTML 文件的根元素 - html 元素 　　2-2 HTML 文件的標頭 - head 元素 　　2-3 HTML 文件的主體 - body 元素 　　2-4 HTML5 新增的結構元素 第03章　資料編輯與格式化 　　3-1　區塊格式 　　3-2　文字格式 　　3-3　插入或刪除資料 - ins、del 元素 　　3-4　項目符號與編號 - ul、ol、li 元素 　　3-5　定義清單 - dl、dt、dd 元素 　　3-6　超連結 　　3-7　相對 URL 的路徑資訊 base 元素 第04章　嵌入內容 　　4-1　嵌入圖片 - img 元素 　　4-2　嵌入影片 - video 元素 　　4-3　嵌入聲音 - audio 元素 　　4-4　設定媒體資源 - source 元素 　　4-5　嵌入不同的圖片 - picture 元素 　　4-6　嵌入物件 - object 元素 　　4-7　嵌入浮動框架 - iframe 元素 　　4-8　嵌入Script - script、noscript 元素 第05章　表格 　　5-1　 建立表格 - table、tr、th、td 元素 　　5-2　 表格標題 - caption 元素 　　5-3　 表格的表頭、主體與表尾 - thead、tbody、tfoot 元素 　　5-4　 直行式表格 - colgroup、col 元素 第06章　表單 　　6-1　建立表單 - form、input 元素 　　6-2　HTML4.01 提供的輸入類型 　　6-3　HTML5 新增的輸入類型 　　6-4　按鈕 - button 元素 　　6-5　標籤 - label 元素 　　6-6　選項群組 - optgroup 元素 　　6-7　將表單欄位群組起來 - fieldset、legend 元素 【Part 2　CSS】 第07章　CSS 基本語法 　　7-1　CSS 的發展 　　7-2　在 HTML 文件中套用 CSS 　　7-3　CSS 的語法 　　7-4　選擇器的類型 　　7-5　樣式表的串接順序 第08章　色彩、字型、文字與清單 　　8-1　色彩屬性 　　8-2　字型屬性 　　8-3　文字屬性 　　8-4　清單屬性 第09章　Box Model 與定位方式 　　9-1　Box Model 　　9-2　邊界屬性 　　9-3　留白屬性 　　9-4　框線屬性 　　9-5　寬度與高度屬性 　　9-6　定位方式 第10章　背景、漸層、濾鏡與表格 　　10-1 背景屬性 　　10-2 漸層函式 　　10-3 濾鏡屬性 　　10-4 表格屬性 第11章　CSS 版面設計 　　11-1　使用 float 屬性進行版面設計 　　11-2　彈性盒子版面 　　11-3　格線版面 第12章　變形、轉場、動畫與媒體查詢 　　12-1　變形屬性 　　12-2　轉場屬性 　　12-3　動畫屬性 　　12-4　媒體查詢 第13章　響應式網頁設計實例―圖庫網站 　　13-1　開發適用於不同裝置的網頁 　　13-2　響應式網頁設計原則 　　13-3　手刻響應式網頁（圖庫網站） 　　13-4　手刻導覽按鈕（漢堡選單） 　　13-5　重置 CSS 【Part 3　JavaScript】 第14章　JavaScript 基本語法 　　14-1　撰寫第一個 JavaScript 程式 　　14-2　JavaScript 程式碼撰寫慣例 　　14-3　型別 　　14-4　變數 　　14-5　常數 　　14-6　運算子 　　14-7　流程控制 　　14-8　函式 　　14-9　變數的有效範圍 第15章　JavaScript 內建物件 　　12-1　認識物件 　　12-2　使用物件 　　12-3　內建物件 第16章　文件物件模型 (DOM) 　　16-1　認識 DOM 　　16-2　取得元素節點 　　16-3　走訪節點 　　16-4　取得 / 設定元素的屬性值與文字內容 　　16-5　新增 / 取代 / 移除節點 　　16-6　存取表單元素 　　16-7　操作 CSS 樣式表 第17章　瀏覽器物件模型 (BOM) 　　17-1　認識 BOM 　　17-2　Window 物件 　　17-3　Location 物件 　　17-4　Navigator 物件 　　17-5　History 物件 　　17-6　Screen 物件 　　17-7　Document 物件 第18章　事件處理 　　18-1　事件驅動模式 　　18-2　事件的類型 　　18-3　定義事件處理程式 / 事件監聽程式 　　18-4　移除事件處理程式 / 事件監聽程式 　　18-5　Event 物件 　　18-6　事件處理範例 【Part 4　網頁前端框架】 第19章　Bootstrap 網格系統 　　19-1　撰寫 Bootstrap 網頁 　　19-2　使用 Bootstrap 網格系統 第20章　Bootstrap 樣式 　　20-1　內容樣式 　　20-2　公用類別 　　20-3　按鈕 　　20-4　表單 第21章　Bootstrap 元件 　　21-1 關閉按鈕 (Close button) 　　21-2 警報效果 (Alert) 　　21-3 下拉式清單 (Dropdown) 　　21-4 按鈕群組 (Button group) 　　21-5 導覽與標籤頁 (Nav and tab) 　　21-6 導覽列 (Navbar) 　　21-7 卡片 (Card) 　　21-8 工具提示 (Tooltip) 　　21-9 彈出提示 (Popover) 　　21-10 摺疊 (Collapse) 　　21-11 手風琴效果 (Accordion) 　　21-12 輪播 (Carousel) 　　21-13 分頁導覽 (Pagination) 第22章　響應式網頁設計實例 - 旅遊網站 　　22-1 「快樂旅遊」網站 　　22-2 設計網頁樣板 　　22-3 設計導覽列 　　22-4 設計輪播 　　22-5 設計內容區 - 警報效果 　　22-6 設計內容區 - 卡片 　　22-7 設計頁尾 第23章　響應式網頁設計實例 - 部落格網站 　　23-1 「快樂部落格」網站 　　23-2 設計網頁樣板 　　23-3 設計頁首、導覽列與介紹區 　　23-4 設計內容區 　　23-5 設計頁尾 第24章　jQuery 　　24-1　認識 jQuery 　　24-2　取得 jQuery 核心 　　24-3　使用 jQuery 核心 　　24-4　事件處理 　　24-5　特效與動畫 第25章　Vue.js 　　25-1 認識 Vue.js 　　25-2 安裝與使用 Vue.js 　　25-3 樣板語法 　　25-4 methods 與 computed 屬性 　　25-5 事件處理 　　25-6 表單欄位繫結 　　25-7 類別與樣式繫結 　　25-8 條件式渲染 　　25-9 清單渲染

HTML/CSS/JavaScript與前端框架的完美結合：使用Bootstrap與PWA技術，新手從這開始！(好評回饋版) (3版)

類似書籍推薦給您

【簡介】 精采內容不容錯過，好評回饋中！！ 掌握HTML/CSS/JavaScript技巧， 搭配高效前端框架技術，輕鬆成為專業網頁設計師 以淺顯易懂的方式從設計網站開始談起，從網站建置的過程、設計網站原型(prototyping)的工具以及取得各式網路資源，再循序漸進介紹Web前端三大核心技術：HTML、CSS及JavaScript，並加入前端框架Bootstrap技術，加上書中介紹好用的配色工具，就算沒有美工基礎，藉由Bootstrap工具模組以及配色表，也能快速建構出專業美觀的RWD網站。 本書也安排了Progressive Web Application(PWA)技術，手把手教您逐步將網站優化為Web APP，讓網站能像Native App在手機等行動裝置建立桌面捷徑，瀏覽網頁時具有操作Native App相似的感受。 本書共分三大單元，第一單元為前端開發觀念及HTML+CSS基礎到進階教學；第二單元安排JavaScript基礎的語法以及Web資料庫的應用；第三單元介紹前端框架工具，包括Bootstrap與PWA。各章節除了實用的範例之外，在每一單元也安排了整合練習，讓讀者能加強學習並驗收學習成果，累積實作經驗，適合自修與教學使用。 |適用對象| ✰對前端技術有興趣卻不知從何入門的初學者 ✰前端開發技術相關從業人員 ✰大專院校網站設計相關課程教材 |重點特色| ✰以淺顯易懂的方式快速了解前端開發的觀念及技術。 ✰熟悉網站原型(prototyping)並善用網路工具與資源加以實作。 ✰循序漸進介紹Web前端三大核心技術：HTML、CSS及JavaScript。 ✰活用前端框架Bootstrap技術以及工具模組，建構RWD網站。 ✰使用Progressive Web Application(PWA)技術，逐步將網站優化為Web APP。 精采內容不容錯過，好評回饋中！！ 本書共分三大單元，第一單元為前端開發觀念及HTML+CSS基礎到進階教學；第二單元安排JavaScript基礎的語法以及Web資料庫的應用；第三單元介紹前端框架工具，包括Bootstrap與PWA。各章節除了實用的範例之外，在每一單元也安排了整合練習，讓讀者能加強學習並驗收學習成果，累積實作經驗，適合自修與教學使用。 【目錄】 CHAPTER 01 網站開發的觀念與技術 1-1 網站開發的基礎觀念 1-1-1 網站及網頁 1-1-2 網頁開發的前端與後端 1-1-3 網址的組成 1-2 網站建置流程與技術 1-2-1 擬定網站主題 1-2-2 規劃網站架構與內容 1-2-3 製作網頁工具 1-2-4 上傳雲端 1-3 網頁介面原型建構工具 1-3-1 網站原型架構 1-3-2 介面線框與原型工具 1-3-3 實作網頁介面原型 CHAPTER 02 HTML與CSS基礎 2-1 學習HTML前的準備工作 2-1-1 建立HTML文件 2-1-2 自動生成HTML5架構程式碼 2-2 HTML語法概念與架構 2-2-1 HTML的標記型態 2-2-2 HTML的組成 2-2-3 標記屬性的運用 2-3 HTML5文件結構與語意標記 2-3-1 語意化的HTML標記 2-3-2 HTML5宣告與編碼設定 2-4 認識CSS基本架構 2-4-1 使用CSS樣式表 2-4-2 CSS基本格式 2-4-3 認識CSS選擇器 2-4-4 CSS的度量單位 2-4-5 CSS的顏色表示法 CHAPTER 03 HTML常用標記 3-1 排版相關標記 3-1-1 瀏覽器呈現網頁的過程 3-1-2 標題標記 3-1-3 段落及換行標記 3-2 項目列表清單 3-2-1 有序列表 3-2-2 無序列表清單 3-2-3 定義列表 3-3 表格與表單 3-3-1 表格 3-3-2 表單 3-3-3 表單元件 3-4 插入圖片與超連結 3-4-1 插入圖片 3-4-2 超連結 3-4-3 內置框架（iframe） 3-5 div標記與span標記 3-5-1 認識div標記 3-5-2 認識span標記 3-5-3 替程式碼加上註解 3-5-4 使用特殊符號及Emoji字符集 CHAPTER 04 CSS常用語法 4-1 文字與段落樣式 4-1-1 文字樣式 4-1-2 文字段落樣式 4-1-3 邊框 4-1-4 文繞圖 4-2 掌握CSS定位 4-2-1 網頁元件的定位（position） 4-2-2 立體網頁的定位 4-2-3 好用的calc()函式 CHAPTER 05 CSS Flexbox響應式排版 5-1 Flexbox模型概念 5-1-1 認識CSS盒子模型（Box Model） 5-1-2 認識Flexbox彈性盒子 5-2 Flexbox屬性 5-2-1 flex container屬性 5-2-2 flex Items屬性 CHAPTER 06 善用網路資源 6-1 圖庫素材分享平台 6-1-1 認識創用CC授權 6-1-2 搜尋CC授權素材 6-1-3 Icon nder-icon圖庫 6-1-4 替網站加入Logo小圖示 6-2 實用的網頁應用產生器 6-2-1 CSS Layout產生器 6-2-2 按鈕產生器 6-2-3 網站配色 CHAPTER 07 整合練習—詩詞展示網頁設計與實作 7-1 網頁架構說明 7-1-1 網頁架構圖 7-1-2 選擇合適的HTML標記 7-2 建立HTML與CSS程式碼 7-2-1 建立網頁架構的HTML語法 7-2-2 加入超連結 7-2-3 加入CSS語法 7-2-4 加入偽元素 7-2-5 利用Icon Fonts產生社群圖示 CHAPTER 08 JavaScript基礎 8-1 認識JavaScript 8-1-1 JavaScript基本觀念 8-1-2 JavaScript運行環境 8-1-3 瀏覽器主控台console 8-1-4 JavaScript語法架構 8-2 JavaScript基礎語法 8-2-1 JavaScript語法架構 8-2-2 JavaScript註解符號 8-2-3 資料型別（Data Type） 8-3 變數宣告與作用範圍 8-3-1 全域變數與區域變數 8-3-2 使用var關鍵字宣告變數 8-3-3 var宣告的作用域 8-3-4 使用Let關鍵字宣告變數 8-3-5 使用const關鍵字宣告常數 8-3-6 變數名稱的限制 CHAPTER 09 函式與作用域 9-1 自訂函式 9-1-1 函式的定義與呼叫 9-1-2 函式參數 9-1-3 函式回傳值 9-2 函式的多重用法 9-2-1 函式宣告式（Function Declaration） 9-2-2 函式表達式（Function Expressions） 9-2-3 物件與this關鍵字 9-2-4 立即執行函式（IIFE） CHAPTER 10 JavaScript操控DOM元素 10-1 DOM物件的方法與屬性 10-1-1 取得物件資訊 10-1-2 處理物件節點 10-1-3 屬性的讀取與設定 10-2 DOM物件的操作 10-2-1 Window物件 10-2-2 DOM集合（Collection） 10-3 DOM風格樣式 10-3-1 查詢元素樣式 10-3-2 設定元件樣式 CHAPTER 11 前端資料儲存 11-1 認識Web Storage 11-1-1 Web Storage概念 11-1-2 偵測瀏覽器是否支援Web Storage 11-2 localStorage及sessionStorage 11-2-1 存取localStorage 11-2-2 刪除localStorage 11-2-3 存取sessionStorage 11-3 IndexedDB資料庫 11-3-1 IndexedDB重要概念 11-3-2 IndexedDB基本操作 11-3-3 讀取資料 11-3-4 刪除資料 11-3-5 清空資料 CHAPTER 12 整合練習—個人通訊錄實作 12-1 網頁架構說明 12-1-1 網頁功能架構圖及線框圖 12-1-2 CSS Image Sprites 12-2 IndexedDB的CURD 12-2-1 建置資料庫物件及開啟交易 12-2-2 設定事件的處理函式 12-2-3 新增會員與新增完成 12-2-4 動態產生資料列表 12-2-5 修改與刪除單筆資料 12-2-6 清空資料與刪除資料庫 12-2-7 阻止事件傳遞與預設行為 CHAPTER 13 響應式網頁框架—Bootstrap 13-1 認識Bootstrap 13-1-1 為什麼要使用Bootstrap 13-1-2 下載Bootstrap 13-1-3 RWD的設計理念 13-2 Bootstrap排版 13-2-1 斷點（Breakpoint）與容器（Container） 13-2-2 了解Grid System 13-2-3 Viewport與Media queries 13-3 Bootstrap的樣式 13-3-1 Bootstrap通用顏色 13-3-2 Bootstrap間距 13-3-3 Bootstrap寬度與高度 13-3-4 Bootstrap文字 13-4 圖片與表格 13-4-1 響應式圖片 13-4-2 邊框圓角 13-4-3 建立Bootstrap表格 CHAPTER 14 Bootstrap擴充元件庫 14-1 導覽與選單 14-1-1 導覽列（Navigation Bar） 14-2 表單與按鈕 14-2-1 表單控制元件 14-2-2 表單排版 14-3 輪播元件（Carousel） 14-3-1 基本的輪播效果 14-3-2 利用JavaScript控制輪播 CHAPTER 15 PWA實作—我的記帳本Web App 15-1 實作「我的記帳本」網頁 15-1-1 「我的記帳本」網頁功能與介面 15-1-2 下拉式選單 15-1-3 按鈕群組 15-1-4 互動視窗 15-1-5 IndexedDB關鍵字查詢 15-1-6 善用Bootstrap Icons製作小圖示 15-2 將網頁轉換成PWA 15-2-1 什麼是PWA 15-2-2 製作各種尺寸的App圖示按鈕 15-2-3 將網頁變成PWA

看完這本就會懂！帶你無痛提升JavaScript面試力：精選55道前端工程師的核心實戰題 × 求職加分模擬試題解析 (1版)

類似書籍推薦給您

看完這本就會懂！帶你無痛提升JavaScript面試力：精選55道前端工程師的核心實戰題 × 求職加分模擬試題解析 系列名：單行本 ISBN13：9786263332973 出版社：博碩文化 作者：卡斯伯 裝訂／頁數：平裝／368頁 規格：23cm*17cm*2cm (高/寬/厚) 出版日：2022/12/19 內容簡介 在本書中，包含許多經典的JavaScript知識點及問題，這些知識點是屬於容易被忽略的核心知識，掌握這些知識內容，將有助於求職中應對各類陷阱題，以及在複雜的JavaScript開發時，更容易找出相對應的錯誤；除此之外，目前主流的ECMAScript 6以上的語法當然也不會錯過，本書會介紹這些語法與ES5觀念上的不同，以及可能遇到的問題點。   當然，作者非常清楚前端在求職的過程絕對不是只有被問到JavaScript的問題，而且並非所有的面試官都是前端開發者，所以除了書中的七大JavaScript章節以外，另外補充「第八章前端面試常見問題」，此章節加入了前端面試常見的延伸問題，例如：MVC、SPA、SSR等各種專有名詞解釋，以及各種網路的常見問題。   　　【目標讀者】 ✦對於JavaScript有基礎的開發者。 ✦即將要面試的前端開發者。 ✦想要鑽研JavaScript核心知識的開發者。   本書特色   著重JavaScript實戰應用與核心知識！ 掌握一定要會的JavaScript面試致勝筆記！   ✦介紹JavaScript的核心知識、經典知識點以及「求職中容易被問到」的問題 ✦每個JS章節後方均有額外考題，除了提供知識，更驗證是否有正確理解 ✦加入前端必備的額外延伸知識，包含開發架構、網路等相關觀念 目錄 |CHAPTER 01| 變數與作用域 1.1 變數宣告 1.2 變數的語法作用域 1.3 提升 1.4 undefined與is not defined 1.5 本章試題演練 |CHAPTER 02| 文法 2.1 陳述式與表達式 2.2 ASI自動插入分號 2.3 運算子 2.4 優先性與相依性 2.5 本章試題演練 |CHAPTER 03| 型別 3.1 原始型別 3.2 型別轉換 3.3 型別比較 3.4 本章試題演練 |CHAPTER 04| 物件 4.1 定義物件 4.2 物件傳址 4.3 陣列 4.4 本章試題演練 |CHAPTER 05| 函式 5.1 建立函式 5.2 函式記憶體 5.3 this 5.4 箭頭函式 5.5 本章試題演練 |CHAPTER 06| 原型 6.1 原型鏈 6.2 函式建構子 6.3 物件屬性特徵 6.4 Class 6.5 本章試題演練 |CHAPTER 07| 非同步 7.1 什麼是非同步 7.2 Promise 7.3 Async與Await 7.4 本章試題演練 |CHAPTER 08| 前端面試常見問題 |CHAPTER 09| 各章試題演練解答 9.1 第一章解答 9.2 第二章解答 9.3 第三章解答 9.4 第四章解答 9.5 第五章解答 9.6 第六章解答 9.7 第七章解答

學好跨平台網頁設計--HTML5、CSS3、JavaScript、jQuery與Bootstrap 5超完美特訓班(附範例/RWD影音教學) (3版)

類似書籍推薦給您

學好跨平台網頁設計：HTML5、CSS3、JavaScript、jQuery與Bootstrap 5超完美特訓班（附範例/RWD影音教學）（第三版） 系列名：網頁開發設計 ISBN13：9789865029074 出版社：碁峰資訊 作者：鄧文淵-總監製;文淵閣工作室-編著 裝訂／頁數：平裝／512頁 規格：23cm*17cm*2.3cm (高/寬/厚) 版次：3 出版日：2021/08/04 中國圖書分類：電腦；資料處理 內容簡介 　　最熱門的跨平台網頁設計技術大集合！ 　　6大主題、300個立即可套用範例，全新Bootstrap 5來襲， 　　最適合全面學習、現學現用的21堂經典關鍵課！ 　　HTML5是最主流的跨平台網頁開發技術，書中以HTML5為主體，綜合當今最經典的跨平台網頁程式設計工具，完整解鎖各項技術，提供最佳學習途徑，現學現用！ 　　【結合最新前端技術】 　　全面引進最新的前端框架與技術，無論是HTML5、CSS3、JavaScript、jQuery、jQuery Mobile或是Bootstrap 5，都能銜接學習而快速上手，打造符合新一代標準的跨平台網站。 　　全新Bootstrap 5更是新一代RWD網站開發中的熱門焦點，能讓網頁因應不同大小的螢幕自動改變內容的配置，確保每個平台的使用者都能得到最好的操作體驗。無論是框架的安裝方式、格線系統的使用、網頁的元件、表單及工具的應用，一直到網頁互動程式的開發，Bootstrap 5都能提供簡單但功能強大的幫助！ 　　【徹底掌握開發語法】 　　透過詳細語法解說、大量圖表示意，引領了解各主題的核心概念與重點技術，並利用最適合的開發工具進行範例實作，徹底掌握語法與應用。 　　【立即套用海量範例】 　　提供大量範例應用，每個主題都依功能別加入實用範例，可依架構學習，也可以依功能主題立即尋找可套用的範例。 　　【跨越平台行動優先】 　　面對行動裝置的普及，網頁就必須跨越不同螢幕尺寸，因應不同作業平台。書中將RWD網頁建置技術徹底解構，進而掌握從電腦到手機版網頁的設計心法，讓跨平台網頁製作更簡單！ 　　【超值RWD影音教學】 　　提供RWD(Responsive Web Design，響應式網頁設計)使用Bootstrap 5的實戰影音教學，利用Bootstrap 5引導您從無到有快速打造一個跨平台的RWD網站，快速強化開發實力！ 　　【超值學習資源】範例程式檔、RWD網頁快速開發：使用Bootstrap 5實戰影音教學 目錄 01 HTML基礎入門 HTML5除了簡化了HTML語法的結構，提供了許多功能標籤能夠直接控制音效、影片等多媒體檔案的播放，並且進一步加入控管地理位置的Geolocation API、繪圖的Canvas API、本地端的資料庫、離線的儲存機制 ⋯ 等讓人期待的功能，讓網頁的呈現與應用提升到另一個不同的層次。 1.1 HTML的出現 1.2 HTML5的歷史 1.3 HTML5的新功能 1.4 HTML5的編輯與瀏覽 02 HTML結構與文字段落 HTML是一個很重要的語法，它能整合文字、圖片、聲音、動畫、影片等內容，藉由瀏覽器讓資訊能夠無遠弗屆，深入到每個角落。在這裡先介紹HTML的文字段落與超連結等標籤，扎實打好HTML的基礎。 2.1 HTML文件結構 2.2 段落 2.3 文字格式 2.4 HTML5的語意標籤 03 超連結、圖片、音效與影片 超連結是HTML 中很重要的一個元素，藉由超連結能夠將不同的網站連繫在一起，也能連結到不同的網站，甚至是不同的資源。除了文字之外，圖片、音效與影片更是HTML 中很重要的內容。本章將要說明如何在網頁中加入圖片、音效與影片，並說明HTML5 新增的元素與功能，讓多媒體的資源豐富您的網頁與內容。 3.1 路徑的表示方法 3.2 超連結 3.3 圖片 3.4 音效的使用 3.5 影片的使用 04 表格與表單 表格是網頁中資料展示的重要利器，本章將分析表格中各個部位，並說明相關的標籤與屬性。表單是網站與瀏覽者互動的窗口，不同的資料需要不同的表單元件來傳送。本章除了介紹HTML中原有的表單元件的建置方式，並會進一步說明HTML5新增的表單元件與使用方式。 4.1 表格 4.2 表單 05 CSS基礎入門 CSS(Cascading Style Sheets)樣式表在網頁設計中占了十分重要的地位，HTML是將網頁進行結構化的製作，而CSS可以依照這個結構進行美化，提升網頁載入的速度，有系統的打造網站的風格。 CSS選擇器是套用樣式的基本功夫，除了一般的套用之外，還能使用屬性選擇器、虛擬類別選擇器、虛擬元素選擇器及組合選擇器，讓樣式的套用更靈活。 5.1 認識CSS 5.2 CSS3的新功能 5.3 CSS的套用方式 5.4 CSS基本語法 5.5 CSS基本選擇器 5.6 CSS屬性選擇器 5.7 CSS虛擬類別選擇器 5.8 CSS虛擬元素選擇器 5.9 組合選擇器 5.10 CSS選擇器的套用順序 06 顏色與文字設定 網頁中顏色的使用相當重要，除了能提高閱讀的舒適度，善用顏色的搭配能讓頁面的表現更加分。文字是網頁中最基礎但也最重要的內容，使用CSS 能快速的定義文字大小，粗細、字型、顏色 ... 等樣式，讓文字的呈現不再一成不變。 6.1 顏色的設定 6.2 文字大小、字型及相關的樣式設定 6.3 字型設定 07 段落與表列設定 文字段落的樣式包括了行距、文字間距、對齊、縮排 ... 等，對於網頁資訊的呈現也相當重要。表列資料的呈現分為項目符號及編號，對於資料的表現十分重要。CSS 的設定能更完美的呈現表列資料。 7.1 文字段落相關的樣式設定 7.2 項目符號及編號的設定 7.3 超連結的樣式設定 7.4 CSS3：文字陰影 08 背景與框線設計 在網頁中可以為元素設定背景，可以凸顯前景的內容。設定的方式十分多元，可以使用顏色、圖片，並能設定背景圖片的位置，背景圖片重複的方式，以及透明度，甚至使用漸層顏色。框線與背景設定的條件十分相似，只要是區塊的標籤元素都能設定框線。除了顏色、粗細，還能設定顯示的樣式，設定圓角，加上陰影。 8.1 設定背景顏色及圖片 8.2 設定透明度 8.3 設定漸層 8.4 框線的設定 8.5 表格框線 8.6 CSS3：圓角框線 8.7 CSS3：區塊陰影 09 盒子模型與版面定位 在網頁的版面上可以說是一個個盒子所組成的，只要能熟悉盒子模型的結構，即可準確的規劃版面中每個區塊的尺寸以及與其他區塊之間的排列狀態。float屬性能將元素設置到所在容器的最左方或最右方成為浮動元素，跟在該元素後方的內容就接著流動到剩下來的位置中。position屬性能精確的定位區塊元素的位置，並依不同特性安排區塊元素的展示方法。CSS3的媒體查詢能根據不同媒體、不同的特性給予不同的CSS樣式設定。 9.1 使用元素結構的重要觀念 9.2 認識盒子模型 9.3 float的使用 9.4 position的使用 9.5 媒體查詢 ...