Bootstrap5.X從入門到項目實戰

作者：編者:李愛玲|責編:張彥青
出版社：清華大學
ISBN：9787302638735

出版日期：2023/06/01
裝幀：平裝
頁數：318

人民幣：RMB 75 元售價：元

內容大鋼

    本書是針對零基礎讀者編寫的網站前端開發入門教材。本書採用目前最新的Bootstrap 5.X版本，側重案例實訓，書中配有豐富的微課視頻，讀者可以通過微課視頻更為直觀地學習有關網站前端開發的熱點案例。
    本書分為18章，包括流行的開發框架Bootstrap，使用最新的框架Bootstrap 5.X，快速掌握Bootstrap布局，Bootstrap中的彈性盒子布局，精通頁面排版，CSS通用樣式，Bootstrap在表單中的應用，常用的CSS組件，高級的CSS組件，卡片、旋轉器和手風琴組件，認識JavaScript插件，精通JavaScript插件等內容。最後通過6個熱點綜合項目，幫助讀者進一步掌握項目開發技能。
    本書通過精選熱點案例，可以讓初學者快速掌握網站前端開發技術。通過微信掃碼觀看視頻，可以隨時隨地在移動端學習開發知識。

作者介紹

編者:李愛玲|責編:張彥青

第1章  流行的開發框架Bootstrap
  1.1  認識Bootstrap
    1.1.1  Bootstrap 的由來
    1.1.2  Bootstrap的構成模塊
  1.2  Bootstrap 的特色
  1.3  Bootstrap的優勢
  1.4  Bootstrap 5.X的新變化
  1.5  疑難問題解惑
第2章  使用最新的框架Bootstrap 5.X
  2.1  下載Bootstrap 5.X
    2.2  安裝 Bootstrap 5.X
    2.2.1  本地安裝
    2.2.2  在線安裝
  2.3  Bootstrap 的在線開發工具
  2.4  案例實訓1——我的第一個Bootstrap網頁
  2.5  案例實訓2——設計網站主頁的按鈕
  2.6  疑難問題解惑
第3章  快速掌握Bootstrap布局
  3.1  布局基礎
    3.1.1  布局容器
    3.1.2  響應斷點
    3.1.3  z-index堆疊樣式屬性
    3.1.4  響應式容器
  3.2  網格系統
    3.2.1  網格選項
    3.2.2  自動布局列
    3.2.3  響應類
    3.2.4  重排序
    3.2.5  列嵌套
  3.3  案例實訓——開發電商網站特效
  3.4  疑難問題解惑
第4章  Bootstrap中的彈性盒子布局
  4.1  定義彈性盒子
  4.2  排列方向
    4.2.1  水平方向排列
    4.2.2  垂直方向排列
  4.3  內容排列布局
  4.4  項目對齊布局
  4.5  自動對齊布局
  4.6  自動相等布局
  4.7  等寬變換布局
  4.8  自動浮動布局
    4.8.1  水平方向浮動布局
    4.8.2  垂直方向浮動布局
  4.9  彈性布局——包裹
  4.10  排列順序布局
  4.11  案例實訓——對齊內容布局
  4.12  疑難問題解惑
第5章  精通頁面排版
  5.1  頁面排版的初始化

  5.2  優化頁面排版
    5.2.1  標題
    5.2.2  段落
    5.2.3  強調
    5.2.4  縮略語
    5.2.5  引用
  5.3  顯示代碼
    5.3.1  行內代碼
    5.3.2  多行代碼塊
  5.4  響應式圖片
    5.4.1  圖像的同步縮放
    5.4.2  圖像縮略圖
    5.4.3  圖像對齊方式
  5.5  優化表格的樣式
    5.5.1  表格默認風格
    5.5.2  為表格設計個性化風格
  5.6  案例實訓——設計網站後台人員管理系統頁面
  5.7  疑難問題解惑
第6章  CSS通用樣式
  6.1  文本處理
    6.1.1  文本對齊
    6.1.2  文本換行
    6.1.3  轉換大小寫
    6.1.4  粗細和斜體
    6.1.5  其他文本樣式類
  6.2  顏色樣式
    6.2.1  文本顏色
    6.2.2  鏈接文本顏色
    6.2.3  背景顏色
  6.3  邊框樣式
    6.3.1  添加邊框
    6.3.2  邊框顏色
    6.3.3  圓角邊框
  6.4  寬度和高度
    6.4.1  相對於父元素
    6.4.2  相對於視口
  6.5  邊距
    6.5.1  邊距的定義
    6.5.2  響應式邊距
  6.6  浮動樣式
    6.6.1  實現浮動樣式
    6.6.2  響應式浮動樣式
  6.7  display屬性
    6.7.1  隱藏或顯示元素
    6.7.2  響應式地隱藏或顯示元素
  6.8  嵌入網頁元素
  6.9  內容溢出
  6.10  定位網頁元素
  6.11  案例實訓——陰影效果
  6.12  疑難問題解惑

第7章  Bootstrap在表單中的應用
  7.1  Bootstrap創建表單
    7.1.1  定義表單控制項
    7.1.2  設置表單控制項的大小
    7.1.3  設置表單控制項只讀
    7.1.4  設置只讀純文本
    7.1.5  範圍輸入
  7.2  單選按鈕和複選框的樣式
    7.2.1  默認堆疊方式
    7.2.2  水平排列方式
    7.2.3  無文本形式
  7.3  設計表單的布局
    7.3.1  使用網格系統布局表單
    7.3.2  設置列的寬度
  7.4  幫助文本
  7.5  禁用表單
  7.6  按鈕
    7.6.1  定義按鈕
    7.6.2  設計按鈕風格
  7.7  按鈕組
    7.7.1  定義按鈕組
    7.7.2  定義按鈕組工具欄
    7.7.3  設計按鈕的組布局和樣式
  7.8  下拉菜單
    7.8.1  定義下拉菜單
    7.8.2  設計下拉按鈕的樣式
    7.8.3  設計下拉菜單的樣式
    7.8.4  單選和多選下拉菜單
    7.8.5  為元素設置下拉菜單
  7.9  Bootstrap 5.X新增的浮動標籤
  7.10  案例實訓——設置表單的驗證功能
  7.11  疑難問題解惑
第8章  常用的CSS組件
  8.1  導航組件
    8.1.1  定義導航
    8.1.2  設計導航的布局
    8.1.3  設計導航的風格
    8.1.4  設計導航選項卡
  8.2  警告框
    8.2.1  定義警告框
    8.2.2  添加鏈接
    8.2.3  額外附加內容
    8.2.4  關閉警告框
  8.3  徽章
    8.3.1  定義徽章
    8.3.2  設置顏色
    8.3.3  橢圓形徽章
  8.4  進度條
    8.4.1  定義進度條
    8.4.2  設計進度條樣式

    8.4.3  設計進度條風格
  8.5  案例實訓——設計具有淡入效果的導航選項卡
  8.6  疑難問題解惑
第9章  高級的CSS組件
  9.1  導航欄
    9.1.1  定義導航欄
    9.1.2  定位導航欄
    9.1.3  設計導航欄的顏色
  9.2  列表組
    9.2.1  定義列表組
    9.2.2  設計列表組的風格樣式
    9.2.3  定製內容
  9.3  麵包屑
    9.3.1  定義麵包屑
    9.3.2  設計分隔符
  9.4  分頁效果
    9.4.1  定義分頁
    9.4.2  使用圖標
    9.4.3  設計分頁風格
  9.5  案例實訓——設計企業招聘表頁面
  9.6  疑難問題解答
第10章  卡片、旋轉器和手風琴組件
  10.1  卡片內容
    10.1.1  卡片的標題、主體、文本和超鏈接
    10.1.2  卡片的圖片
    10.1.3  卡片的列表組
    10.1.4  卡片的頁眉和頁腳
  10.2  控制卡片的寬度
    10.2.1  使用網格系統控制卡片的寬度
    10.2.2  使用寬度類控制卡片的寬度
    10.2.3  使用CSS樣式控制卡片的寬度
  10.3  卡片中文本的對齊方式
  10.4  卡片中添加導航
  10.5  設計卡片的風格
    10.5.1  設置卡片的背景顏色
    10.5.2  設置背景圖像
    10.5.3  卡片的邊框顏色
    10.5.4  設計卡片的樣式
  10.6  卡片排版
  10.7  旋轉器
    10.7.1  定義旋轉器
    10.7.2  設置旋轉器風格
    10.7.3  設置旋轉器的對齊方式
    10.7.4  按鈕旋轉器
  10.8  新增的手風琴組件
    10.8.1  創建手風琴
    10.8.2  手風琴組件的結構
    10.8.3  手風琴組件的樣式
    10.8.4  在手風琴組件中使用列表
  10.9  案例實訓——使用網格系統布局卡片

  10.10  疑難問題解答
第11章  認識JavaScript插件
  11.1  插件概述
    11.1.1  插件分類
    11.1.2  安裝插件
    11.1.3  調用插件
  11.2  警告框
    11.2.1  關閉警告框
    11.2.2  顯示警告框
  11.3  按鈕
  11.4  輪播
    11.4.1  定義輪播
    11.4.2  設計輪播風格
  11.5  摺疊
    11.5.1  定義摺疊效果
    11.5.2  控制多目標
    11.5.3  設計手風琴效果
  11.6  下拉菜單
    11.6.1  調用下拉菜單
    11.6.2  設置下拉菜單
    11.6.3  添加用戶行為
  11.7  模態框
    11.7.1  定義模態框
    11.7.2  模態框的布局和樣式
  11.8  案例實訓——設計搶紅包提示框
  11.9  疑難問題解答
第12章  精通JavaScript插件
  12.1  側邊欄導航
    12.1.1  創建側邊欄導航
    12.1.2  側邊欄導航的組件
    12.1.3  設置背景及背景是否可滾動
    12.1.4  通過JavaScript控制側邊欄導航
  12.2  彈窗
    12.2.1  創建彈窗
    12.2.2  設置彈窗方向
    12.2.3  關閉彈窗
  12.3  滾動監聽
    12.3.1  導航欄中的滾動監聽
    12.3.2  嵌套導航欄中的滾動監聽
    12.3.3  列表組中的滾動監聽
  12.4  標籤頁
  12.5  提示框
    12.5.1  創建提示框
    12.5.2  設置提示框的顯示位置
    12.5.3  調用提示框
  12.6  吐司消息
    12.6.1  創建吐司消息
    12.6.2  堆疊吐司消息
    12.6.3  自定義吐司消息
    12.6.4  設置吐司消息的顏色

  12.7  案例實訓——設計熱銷商品推薦區
  12.8  疑難問題解答
第13章  項目實訓1——招聘網中的簡歷模板
  13.1  案例概述
    13.1.1  案例結構
    13.1.2  設計效果
    13.1.3  設計準備
  13.2  設計布局
  13.3  設計左側信息欄
  13.4  設計導航條
  13.5  設計主頁
    13.5.1  工作經歷
    13.5.2  專業技能
    13.5.3  教育經歷
    13.5.4  綜合概述
  13.6  設計聯繫頁
  13.7  設計相冊頁
第14章  項目實訓2——開發連鎖咖啡網站
  14.1  網站概述
    14.1.1  網站結構
    14.1.2  設計效果
    14.1.3  設計準備
  14.2  設計首頁布局
  14.3  設計可切換導航
  14.4  主體內容
    14.4.1  設計輪播廣告區
    14.4.2  設計產品推薦區
    14.4.3  設計登錄、註冊按鈕和Logo
    14.4.4  設計特色展示區
    14.4.5  設計產品生產流程區
  14.5  設計底部隱藏導航
第15章  項目實訓3——開發攝影相冊類項目
  15.1  案例概述
    15.1.1  案例結構
    15.1.2  設計效果
    15.1.3  設計準備
  15.2  設計導航欄
  15.3  設計首頁
    15.3.1  設計相冊展示區
    15.3.2  添加Swipebox燈箱插件
  15.4  分類頁
    15.4.1  設計相冊分類展示
    15.4.2  添加Swipebox燈箱插件
  15.5  博客
  15.6  聯繫頁
第16章  項目實訓4——設計流行企業網站
  16.1  網站概述
    16.1.1  網站結構
    16.1.2  設計效果
    16.1.3  設計準備

  16.2  設計主頁
    16.2.1  主頁布局
    16.2.2  設計導航條
    16.2.3  設計輪播廣告
    16.2.4  設計功能區
    16.2.5  設計特色展示
    16.2.6  設計腳註
  16.3  設計側邊導航欄
  16.4  設計登錄頁
第17章  項目實訓5——Web設計與定製網站
  17.1  網站概述
    17.1.1  網站結構
    17.1.2  網站布局
    17.1.3  設計準備
  17.2  設計主頁面導航
  17.3  設計主頁面內容
    17.3.1  設計首頁
    17.3.2  關於我們
    17.3.3  我們的團隊
    17.3.4  我們的服務
    17.3.5  我們的博客
    17.3.6  我們的定製
  17.4  設計腳註
第18章  項目實訓6——開發神影視頻網站
  18.1  網站概述
    18.1.1  網站結構
    18.1.2  網站布局
    18.1.3  網站效果
    18.1.4  設計準備
  18.2  設計主頁面
    18.2.1  設計頭部內容
    18.2.2  設計輪播
    18.2.3  設計分類列表
    18.2.4  設計視頻內容
    18.2.5  設計腳註

同類熱銷排行榜

最近瀏覽的商品

Bootstrap5.X從入門到項目實戰