0916~0919_開學季語言展

html/css/javascript與前端框架的完美結合:使用bootstrap與pwa技術,新手從這開始!(好評回饋版)

  • 9 621
    690
  • 分類:
    中文書電腦資訊網頁開發HTML/CSS
    追蹤
    ? 追蹤分類後,您會在第一時間收到分類新品通知。
  • 作者: 陳婉凌 追蹤 ? 追蹤作者後,您會在第一時間收到作者新書通知。
  • 出版社: 博碩文化 追蹤 ? 追蹤出版社後,您會在第一時間收到出版社新書通知。
  • 出版日:2025/03/05

活動訊息

想找書的時候,特別想偷看網友的書櫃... 原來大家都在看這本 ↓↓↓

用閱讀開啟視野,讓書成為照亮你人生的光
【金石堂選書】本月推薦您這些好書👉 快來看看

內容簡介

|重點特色|
✰以淺顯易懂的方式快速了解前端開發的觀念及技術。
✰熟悉網站原型(prototyping)並善用網路工具與資源加以實作。
✰循序漸進介紹Web前端三大核心技術:HTML、CSS及JavaScript。
✰活用前端框架Bootstrap技術以及工具模組,建構RWD網站。
✰使用Progressive Web Application(PWA)技術,逐步將網站優化為Web APP。


精采內容不容錯過,好評回饋中!!

本書共分三大單元,第一單元為前端開發觀念及HTML+CSS基礎到進階教學;第二單元安排JavaScript基礎的語法以及Web資料庫的應用;第三單元介紹前端框架工具,包括Bootstrap與PWA。各章節除了實用的範例之外,在每一單元也安排了整合練習,讓讀者能加強學習並驗收學習成果,累積實作經驗,適合自修與教學使用。
精采內容不容錯過,好評回饋中!!

掌握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。各章節除了實用的範例之外,在每一單元也安排了整合練習,讓讀者能加強學習並驗收學習成果,累積實作經驗,適合自修與教學使用。

|適用對象|
✰對前端技術有興趣卻不知從何入門的初學者
✰前端開發技術相關從業人員
✰大專院校網站設計相關課程教材

目錄

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

配送方式

  • 台灣
    • 國內宅配:本島、離島
    • 到店取貨:
      金石堂門市 不限金額免運費
      7-11便利商店 ok便利商店 萊爾富便利商店 全家便利商店
  • 海外
    • 國際快遞:全球
    • 港澳店取:
      ok便利商店 順豐 7-11便利商店

詳細資料

詳細資料

    • 語言
    • 中文繁體
    • 裝訂
    • 紙本平裝
    • ISBN
    • 9786264141192
    • 分級
    • 普通級
    • 頁數
    • 528
    • 商品規格
    • 23*17*2.8
    • 出版地
    • 台灣
    • 適讀年齡
    • 全齡適讀
    • 注音
    • 級別

商品評價

訂購/退換貨須知

加入金石堂 LINE 官方帳號『完成綁定』,隨時掌握出貨動態:

加入金石堂LINE官方帳號『完成綁定』,隨時掌握出貨動態
金石堂LINE官方帳號綁定教學

提醒您!!
金石堂及銀行均不會請您操作ATM! 如接獲電話要求您前往ATM提款機,請不要聽從指示,以免受騙上當!

退換貨須知:

**提醒您,鑑賞期不等於試用期,退回商品須為全新狀態**

  • 依據「消費者保護法」第19條及行政院消費者保護處公告之「通訊交易解除權合理例外情事適用準則」,以下商品購買後,除商品本身有瑕疵外,將不提供7天的猶豫期:
    1. 易於腐敗、保存期限較短或解約時即將逾期。(如:生鮮食品)
    2. 依消費者要求所為之客製化給付。(客製化商品)
    3. 報紙、期刊或雜誌。(含MOOK、外文雜誌)
    4. 經消費者拆封之影音商品或電腦軟體。
    5. 非以有形媒介提供之數位內容或一經提供即為完成之線上服務,經消費者事先同意始提供。(如:電子書、電子雜誌、下載版軟體、虛擬商品…等)
    6. 已拆封之個人衛生用品。(如:內衣褲、刮鬍刀、除毛刀…等)
  • 若非上列種類商品,均享有到貨7天的猶豫期(含例假日)。
  • 辦理退換貨時,商品(組合商品恕無法接受單獨退貨)必須是您收到商品時的原始狀態(包含商品本體、配件、贈品、保證書、所有附隨資料文件及原廠內外包裝…等),請勿直接使用原廠包裝寄送,或於原廠包裝上黏貼紙張或書寫文字。
  • 退回商品若無法回復原狀,將請您負擔回復原狀所需費用,嚴重時將影響您的退貨權益。
※ 網友掛保證,絕不踩雷書單如下 ↓↓↓
預計 2025/09/30 出貨 購買後進貨 
金石堂門市 全家便利商店 ok便利商店 萊爾富便利商店 7-11便利商店
World wide
活動ing