QQ在線客服
免費咨詢熱線
400-615-1233
工作時間-工作日
8:30-17:30
2立封
2平封

HTML5+CSS3+JavaScript網(wǎng)頁設(shè)計與制作案例教程

校企雙元開發(fā),密切結(jié)合思政
  • 類  別:計算機系列
  • 書  名:HTML5+CSS3+JavaScript網(wǎng)頁設(shè)計與制作案例教程
  • 主  編:王麗芬 邵雪 葉靜宇
  • 定  價:59.9
  • 開  本:大16開
  • 印刷方式:雙色
  • 頁  數(shù):328
  • 時  間:2024年3月
  • 出  版  社:上海交通大學出版社
  • 書  號:978-7-313-29801-0

內(nèi)容摘要

        本書共8個項目,每個項目對應(yīng)HTML、CSS、JavaScript相關(guān)知識。項目1介紹網(wǎng)頁網(wǎng)站設(shè)計的基礎(chǔ)知識,項目2介紹HTML5基礎(chǔ)知識,項目3介紹CSS格式化網(wǎng)頁,項目4介紹盒子模型對網(wǎng)頁模塊的劃分,項目5介紹網(wǎng)頁中的列表和超級鏈接,項目6介紹網(wǎng)頁中的表格和表單,項目7介紹網(wǎng)頁中的視聽技術(shù),項目8介紹JavaScript編程。
        本書適合作為高等學校前端開發(fā)課程的的教材,也可供相關(guān)人員參考。

目錄

項目1 網(wǎng)頁網(wǎng)站設(shè)計基礎(chǔ)
  1.1 網(wǎng)頁和網(wǎng)站基礎(chǔ) 1
    1.1.1 網(wǎng)頁的基本構(gòu)成要素 3
    1.1.2 網(wǎng)頁的相關(guān)名詞 3
    1.1.3 Web標準 4
  1.2 網(wǎng)頁設(shè)計原則 5
    1.2.1 以用戶為中心 5
    1.2.2 視覺美觀 5
   1.2.3 主題明確 6
    1.2.4 內(nèi)容與形式統(tǒng)一 6
  1.3 網(wǎng)頁設(shè)計規(guī)范 6
    1.3.1 配色原則 6
    1.3.2 設(shè)計尺寸規(guī)范 7
    1.3.3 字體規(guī)范 8
    1.3.4 命名規(guī)范 8
  1.4 網(wǎng)站制作流程 9
    1.4.1 確定網(wǎng)站主題 10
    1.4.2 網(wǎng)站整體規(guī)劃 10
    1.4.3 收集素材 11
    1.4.4 設(shè)計網(wǎng)頁效果圖 12
    1.4.5 搭建網(wǎng)站靜態(tài)頁面 12
    1.4.6 網(wǎng)站發(fā)布 12
  1.5 網(wǎng)頁制作技術(shù)入門 13
    1.5.1 HTML 13
    1.5.2 CSS 13
    1.5.3 JavaScript 13
    1.5.4 常用開發(fā)工具 13
  1.6 創(chuàng)建第一個網(wǎng)頁 16
 
項目2 HTML5基礎(chǔ)
  2.1 HTML5概述 18
    2.1.1 HTML5的發(fā)展歷程 18
    2.1.2 HTML5的優(yōu)勢 19
    2.1.3 HTML5語法 20
   2.1.4 HTML5文檔的基本格式 21
    2.1.5 HTML文檔頭部的相關(guān)標簽 22
  2.2 標簽基礎(chǔ) 25
    2.2.1 標簽的分類 25
    2.2.2 標簽的關(guān)系 27
    2.2.3 標簽的屬性 28
  2.3 文本標簽 28
    2.3.1 標題標簽 29
    2.3.2 段落標簽 30
    2.3.3 水平線標簽 31
    2.3.4 換行標簽 32
    2.3.5 文本樣式標簽 33
    2.3.6 文本格式化標簽 34
    2.3.7 特殊字符 35
  2.4 圖像標簽 37
    2.4.1 常見圖像格式 37
    2.4.2 圖像標簽 38
    2.4.3 絕對路徑和相對路徑 43
  2.5 動手實踐 44
項目3 CSS格式化網(wǎng)頁
  3.1  CSS3介紹 45
    3.1.1 認識CSS3 45
    3.1.2 CSS樣式規(guī)則 48
    3.1.3 CSS基礎(chǔ)選擇器 52
  3.2  CSS設(shè)置文本樣式 59
    3.2.1 CSS字體樣式屬性 59
    3.2.2 CSS文本外觀屬性 65
  3.3 CSS3 新增選擇器 75
    3.3.1 CSS3選擇器 75
    3.3.2 CSS3的層疊性和繼承性 97
    3.3.3 CSS3優(yōu)先級 99
  3.4 動手實踐 104
項目4 網(wǎng)頁網(wǎng)站設(shè)計基礎(chǔ)
  4.1 盒子模型 105
    4.1.1 認識盒子模型 106
    4.1.2
標簽 109
  4.2 盒子模型相關(guān)屬性 111
    4.2.1 邊框?qū)傩?span style="white-space:pre"> 111
    4.2.2 內(nèi)邊距屬性 122
    4.2.3 外邊距屬性 123
  4.3  背景屬性 126
    4.3.1 設(shè)置背景顏色 126
    4.3.2 設(shè)置背景圖像 127
    4.3.3 設(shè)置背景圖像平鋪 129
    4.3.4 設(shè)置背景圖像位置 131
    4.3.5 綜合設(shè)置元素背景 133
  4.4 元素的轉(zhuǎn)換 135
    4.4.1 元素的類型 135
    4.4.2 標簽 137
    4.4.3 元素類型的轉(zhuǎn)換 139
  4.5 浮動和定位 142
    4.5.1 認識浮動 142
    4.5.2 清除浮動 145
    4.5.3 overflow屬性 150
   4.5.4 設(shè)置定位 153
  4.6 網(wǎng)頁布局 161
    4.6.1 認識布局 161
    4.6.2 單列布局 162
    4.6.3 兩列布局 164
    4.6.4 三列布局 166
    4.6.5 通欄布局 168
  4.7 動手實踐 170
項目5 為網(wǎng)頁添加列表和超鏈接
  5.1 列表 171
    5.1.1 無序列表 171
    5.1.2 有序列表 173
    5.1.3 定義列表 175
    5.1.4 列表的嵌套 178
  5.2 CSS控制列表樣式 180
    5.2.1 list-style-type屬性 180
    5.2.2 list-style-image屬性 182
    5.2.3 list-style-position屬性 183
    5.2.4 list-style屬性 185
    5.2.5 背景圖像定義列表項目符號 186
  5.3 超鏈接 188
    5.3.1 創(chuàng)建超鏈接 188
    5.3.2 錨點鏈接 190
    5.3.3 鏈接偽類控制超鏈接 192
  5.4 動手實踐 195
項目6 為網(wǎng)頁添加表格和表單
  6.1 表格標記 196
    6.1.1 創(chuàng)建表格 196
    6.1.2 標簽的屬性 200
    6.1.3
標簽的屬性 202
    6.1.4
標簽的屬性 205
    6.1.5
標簽的屬性 207
  6.2 CSS控制表格樣式 208
    6.2.1 CSS控制表格邊框 208
    6.2.2 CSS控制單元格邊距 212
    6.2.3 CSS控制單元格寬高 215
  6.3 表單標簽 216
    6.3.1 認識表單 216
    6.3.2 創(chuàng)建表單 218
  6.4 表單控件 220
    6.4.1 input控件 220
   6.4.2 textarea控件 228
    6.4.3 select控件 229
   6.4.4 CSS控制表單樣式 233
  6.5 動手實踐 236
項目7 全新的網(wǎng)頁視聽技術(shù)
  7.1 視聽技術(shù) 237
    7.1.1 音視頻嵌入技術(shù)概述 237
    7.1.2 視頻和音頻文件格式 238
    7.1.3 視頻和音頻文件的兼容性 239
    7.1.4 嵌入視頻 240
    7.1.5 嵌入音頻 241
    7.1.6 控制視頻寬度和高度 242
  7.2 CSS3過渡 245
    7.2.1 transition-property屬性 245
    7.2.2 transition-duration屬性 245
    7.2.3 transition-timing-function屬性 247
    7.2.4 transition-delay屬性 248
    7.2.5  transition屬性 248
  7.3 CSS3轉(zhuǎn)換 249
    7.3.1 認識transform 249
    7.3.2 2D轉(zhuǎn)換 249
    7.3.3 3D轉(zhuǎn)換 258
  7.4 CSS3動畫 261
    7.4.1 @Keyframes關(guān)鍵幀 262
    7.4.2 animation-name屬性 263
    7.4.3 animation-duration屬性 263
    7.4.4 animation-timing-function屬性 264
    7.4.5 animation-delay屬性 265
    7.4.6 animation-iteration-count屬性 266
    7.4.7 animation-direction屬性 266
    7.4.8 animation屬性 267
  7.5 動手實踐 268
項目8  JavaScript編程
  8.1 JavaScript概述 269
    8.1.1 認識JavaScript 270
    8.1.2 JavaScript語法規(guī)則 271
    8.1.3 JavaScript引入方式 272
  8.2 JavaScript基礎(chǔ) 275
    8.2.1 關(guān)鍵字 275
    8.2.2 變量 276
    8.2.3 數(shù)據(jù)類型 277
    8.2.4 數(shù)據(jù)類型轉(zhuǎn)換 278
    8.2.5 運算符 279
    8.2.6 運算符優(yōu)先級 285
  8.3 數(shù)組與函數(shù) 287
    8.3.1 數(shù)組 287
    8.3.2 函數(shù) 291
   8.3.3 alert(  )方法 295
    8.3.4 prompt(  )方法 295
  8.4 流程控制結(jié)構(gòu) 296
    8.4.1 條件語句 296
   8.4.2 循環(huán)控制語句 301
    8.4.3 跳轉(zhuǎn)語句 304
  8.5 對象模型 307
    8.5.1 對象 307
    8.5.2 DOM模型 307
    8.5.3 訪問節(jié)點 308
    8.5.4 設(shè)置節(jié)點樣式 310
    8.5.5 BOM模型 310
    8.5.6 Date對象 314
  8.6 事件 318
    8.6.1 事件和事件調(diào)用 318
    8.6.2 常用JavaScript事件 319
  8.7 動手實踐 321
 
案例設(shè)計目錄
2.2.4簡單的網(wǎng)頁28
2.3.8新聞頁面37
2.4.4 古詩文排版43
3.1.5文字Logo59
3.2.3 農(nóng)耕文化75
3.3.4 農(nóng)耕文化軟文推廣104
4.1.4 五四運動新聞標題111
4.2.4 中國共青團125
4.3.6 五四青年節(jié)海報135
4.4.4 地標導航欄141
4.5.5 吉林市滑雪場160
4.6.6 網(wǎng)頁布局170
5.1.5計時單位懸浮框180
5.2.6 琴師導航188
5.3.4 卡片式文本效果195
6.1.6 表格設(shè)計網(wǎng)頁布局208
6.2.4 求職表216
6.3.3 智慧農(nóng)業(yè)系統(tǒng)登錄界面219
6.4.5 農(nóng)作物檔案236
7.1.7 播放列表245
7.2.6 導航欄動畫249
7.3.4 卡片翻轉(zhuǎn)特效261
7.4.9 網(wǎng)頁創(chuàng)意分區(qū)268
8.2.7驗證碼286
8.3.5 輪播圖296
8.4.4 下拉菜單307
8.5.7節(jié)日倒計時318
8.6.3 Tab欄切換320

主編信息

王麗芬,女,吉林農(nóng)業(yè)科技學院副教授。2003至今在吉林農(nóng)業(yè)科技學院任教,主持教育廳項目3項,參與課題6項,主編教材2部,副主編教材3部。邵雪,女,吉林農(nóng)業(yè)科技學院講師,2006年至今在吉林農(nóng)業(yè)科技學院任教,主持教育廳項目1項,參與課題5項,副主編教材3部。葉靜宇,女,吉林農(nóng)業(yè)科技學院助教。2018年至今吉林農(nóng)業(yè)科技學院任教,主持省級課題1項,校級課題2項,參與課題7項,副主編教材3部。

相關(guān)圖書

  • 網(wǎng)絡(luò)工程導論

    主編:張海民

    本書介紹網(wǎng)絡(luò)工程基礎(chǔ)知識和技能,全書共分為5個項目,內(nèi)容包括網(wǎng)絡(luò)工程啟蒙、網(wǎng)絡(luò)工程初探、網(wǎng)絡(luò)工程基礎(chǔ)技術(shù)、網(wǎng)絡(luò)工程核心技術(shù)

    ¥48
  • Python計算機視覺應(yīng)用(全彩版)

    主編:劉國華

    本書是依托Python語言講解計算機視覺的基礎(chǔ)理論與算法,并通過大量示例細致分析了圖像形成和處理技術(shù)、圖像特征提取、圖像分割、圖

    ¥69.8
  • Python程序設(shè)計簡明教程

    主編:張春飛

    本書分為10章,內(nèi)容包括Python語言概述、初識Python、選擇結(jié)構(gòu)與循環(huán)結(jié)構(gòu)、Python組合數(shù)據(jù)類型、函數(shù)、面向?qū)ο蟪绦蛟O(shè)計、模塊及第

    ¥49.9
  • Premiere Pro 2021影視編輯與制作

    主編:左浩

    本書以Adobe Premiere Pro 2021為藍本,全面系統(tǒng)地介紹Premiere的基本操作方法及視頻編輯技巧,包括Premiere Pro 2021基本操

    ¥49.8
  • AutoCAD 2021基礎(chǔ)與應(yīng)用案例教程

    主編:鐘良 王科飛 余家欣 張德虎

    本書從理論到案例都進行了較詳盡的敘述,內(nèi)容由淺入深,全面介紹了AutoCAD 2021基礎(chǔ)知識及其在相關(guān)行業(yè)中的應(yīng)用。全書共分12 章,內(nèi)

    ¥55
  • CorelDRAW 2021平面設(shè)計案例教程

    主編:申莎

    本書從平面設(shè)計工作人員的實際工作入手,介紹了CorelDRAW 2021平面設(shè)計的基礎(chǔ)知識、繪制和編輯幾何圖形、繪制與編輯線條圖形、圖

    ¥58
  • Photoshop 2020圖形圖像處理案例教程

    主編:張永生 熊芳芳 段紅玉

    Photoshop圖形圖像處理是我國高等院校計算機類及相關(guān)專業(yè)的一門專業(yè)技術(shù)必修課程,是培養(yǎng)學生專業(yè)能力的核心課程之一。本書以實例

    ¥49.8
  • Java程序設(shè)計案例教程

    主編:李海濤 陳濤 孫紅麗

    本書是基于翻轉(zhuǎn)課堂的課程教學范式改革與校本應(yīng)用型教材建設(shè)項目基礎(chǔ)上編寫的。本書采用案例驅(qū)動的方式編寫,即把理論知識點的講解

    ¥59.8
  • 計算機導論

    主編:姚保峰

    本書共12章,分別為計算思維和計算機發(fā)展、信息的表示、計算機硬件系統(tǒng)、計算機網(wǎng)絡(luò)技術(shù)和網(wǎng)絡(luò)安全、機器語言到高級語言、程序設(shè)計

    ¥59.8
  • Access 2016數(shù)據(jù)庫基礎(chǔ)與應(yīng)用

    主編:舒軍 王曉麗

    本書注重以實例講解Access 2016數(shù)據(jù)庫的開發(fā)和管理。全書共分7個項目,包括數(shù)據(jù)庫和表的創(chuàng)建、處理數(shù)據(jù)庫的樣式和數(shù)據(jù)、數(shù)據(jù)的查

    ¥54
  • Access 2010數(shù)據(jù)庫基礎(chǔ)與應(yīng)用

    主編:熊芳芳

    本書分為9章,分別介紹了數(shù)據(jù)庫基礎(chǔ)知識、數(shù)據(jù)庫與表、查詢、窗體、報表、宏、模塊與VBA程序設(shè)計、VBA數(shù)據(jù)庫編程、全國計算機等級

    ¥49.8