![]() ![]() |
HTML CSS JavaScript基礎(chǔ)教程 Web前端開(kāi)發(fā)精品課 ![]()
本書(shū)緊密圍繞網(wǎng)頁(yè)設(shè)計(jì)師在制作網(wǎng)頁(yè)過(guò)程中的實(shí)際需要和應(yīng)該掌握的技術(shù),全面介紹了如何使用HTML、CSS、JavaScrip 以及前端框架進(jìn)行網(wǎng)站建設(shè)和網(wǎng)頁(yè)設(shè)計(jì)。
從內(nèi)功到招式,全書(shū)貫穿了不同行業(yè)的多種實(shí)例,各實(shí)例均經(jīng)過(guò)精心設(shè)計(jì),操作步驟清晰簡(jiǎn)明,技術(shù)分析深入淺出,能夠幫助讀者沉浸在真實(shí)的開(kāi)發(fā)狀態(tài)中。這樣,無(wú)論以后是面對(duì)公司的面試,還是真實(shí)的工作需求,讀者都能夠跨過(guò)所學(xué)與所用之間的鴻溝。
此外,本書(shū)還精心配備了PPT 電子課件,便于老師課堂教學(xué)和學(xué)生把握知識(shí)要點(diǎn)。
初學(xué)優(yōu)選 入門經(jīng)典
針對(duì)前端新手全新打造,一本書(shū)搞定 HTML、CSS、JavaScript
· 精品呈現(xiàn) 通俗易懂
語(yǔ)言輕松幽默,講解一針見(jiàn)血,從全新角度講透前端開(kāi)發(fā)核心技術(shù)
· 五位一體 全面服務(wù)
在線教程 在線問(wèn)答 面試練習(xí) 源碼素材 課件 PPT
(獲取方式請(qǐng)加本書(shū)封底QQ群)
莫振杰,綠葉學(xué)習(xí)網(wǎng)(http://www.lvyestudy.com)站長(zhǎng),利用該網(wǎng)站用于分享自己在前后端開(kāi)發(fā)中的一些經(jīng)驗(yàn),并且制作相關(guān)前后端開(kāi)發(fā)的在線教程。這些在線教程在互聯(lián)網(wǎng)引起廣泛關(guān)注,極大受到網(wǎng)友推崇。本人編寫(xiě)過(guò)大量原創(chuàng)在線教程和《Web前端開(kāi)發(fā)精品課》系列圖書(shū),廣受網(wǎng)友稱贊與推崇。
《Web前端開(kāi)發(fā)精品課HTML與CSS基礎(chǔ)教程》
《Web前端開(kāi)發(fā)精品課HTML與CSS進(jìn)階教程》
《Web前端開(kāi)發(fā)精品課JavaScript基礎(chǔ)教程》
《Web前端開(kāi)發(fā)精品課HTML5 Canvas開(kāi)發(fā)詳解》
目錄
第一部分 HTML基礎(chǔ) 第01章 HTML簡(jiǎn)介 1.1 前端技術(shù)簡(jiǎn)介 2 1.1.1 從網(wǎng)頁(yè)制作到前端開(kāi)發(fā) 2 1.1.2 從前端開(kāi)發(fā)到后端開(kāi)發(fā) 3 1.1.3 學(xué)習(xí)路線 5 1.2 什么是HTML 5 1.3 教程介紹 6 1.3.1 教程簡(jiǎn)介 6 1.3.2 初學(xué)者比較關(guān)心的問(wèn)題7 第02章 開(kāi)發(fā)工具 2.1 開(kāi)發(fā)工具 8 2.2 使用Hbuilder 9 第03章 基本標(biāo)簽 3.1 HTML結(jié)構(gòu) 11 3.2 head標(biāo)簽 12 3.2.1 title標(biāo)簽 13 3.2.2 meta標(biāo)簽 13 3.2.3 style標(biāo)簽 15 3.2.4 script標(biāo)簽 15 3.2.5 link標(biāo)簽 16 3.2.6 base標(biāo)簽 16 3.3 body標(biāo)簽 16 3.4 HTML注釋 17 3.5 練習(xí)題 18 第04章 文本 4.1 文本簡(jiǎn)介 19 4.1.1 頁(yè)面組成元素 19 4.1.2 HTML文本 20 4.2 標(biāo)題標(biāo)簽 21 4.3 段落標(biāo)簽 22 4.3.1 段落標(biāo)簽: 22 4.3.2 換行標(biāo)簽: 23 4.4 文本標(biāo)簽 25 4.4.1 粗體標(biāo)簽 25 4.4.2 斜體標(biāo)簽 26 4.4.3 上標(biāo)標(biāo)簽 26 4.4.4 下標(biāo)標(biāo)簽 27 4.4.5 中劃線標(biāo)簽 27 4.4.6 下劃線標(biāo)簽 28 4.4.7 大字號(hào)標(biāo)簽和小字號(hào)標(biāo)簽 28 4.5 水平線標(biāo)簽 29 4.6 div標(biāo)簽 30 4.7 自閉合標(biāo)簽 31 4.8 塊元素和行內(nèi)元素 32 4.8.1 塊元素 33 4.8.2 行內(nèi)元素 34 4.9 特殊符號(hào) 35 4.9.1 網(wǎng)頁(yè)中的空格 35 4.9.2 網(wǎng)頁(yè)中的特殊符號(hào) 36 4.10 練習(xí)題 38 第05章 列表 5.1 列表簡(jiǎn)介 39 5.2 有序列表 40 5.2.1 有序列表簡(jiǎn)介 40 5.2.2 type屬性 41 5.3 無(wú)序列表 42 5.3.1 無(wú)序列表簡(jiǎn)介 42 5.3.2 type屬性 43 5.3.3 深入無(wú)序列表 44 5.4 定義列表 46 5.5 HTML語(yǔ)義化 47 5.6 練習(xí)題 48 第06章 表格 6.1 表格簡(jiǎn)介 49 6.2 基本結(jié)構(gòu) 49 6.3 完整結(jié)構(gòu) 51 6.3.1 表格標(biāo)題:caption 51 6.3.2 表頭單元格:th 52 6.4 語(yǔ)義化 54 6.5 合并行:rowspan 56 6.6 合并列:colspan 57 6.7 練習(xí)題 58 第07章 圖片 7.1 圖片標(biāo)簽 59 7.1.1 src屬性 59 7.1.2 alt屬性和title屬性 60 7.2 圖片路徑 62 7.2.1 page1.html引用圖片 62 7.2.2 page2.html引用圖片 63 7.3 圖片格式 64 7.3.1 位圖 64 7.3.2 矢量圖 66 7.4 練習(xí)題 67 第08章 超鏈接 8.1 超鏈接簡(jiǎn)介 68 8.1.1 a標(biāo)簽 69 8.1.2 target屬性 70 8.2 內(nèi)部鏈接 70 8.3 錨點(diǎn)鏈接 72 8.4 練習(xí)題 74 第09章 表單 9.1 表單簡(jiǎn)介 75 9.1.1 表單是什么75 9.1.2 表單標(biāo)簽 76 9.2 form標(biāo)簽 76 9.2.1 form標(biāo)簽簡(jiǎn)介 76 9.2.2 form標(biāo)簽屬性 77 9.3 input標(biāo)簽 78 9.4 單行文本框 79 9.4.1 單行文本框簡(jiǎn)介 79 9.4.2 單行文本框?qū)傩?79 9.5 密碼文本框 81 9.5.1 密碼文本框簡(jiǎn)介 81 9.5.2 密碼文本框?qū)傩?82 9.6 單選框 83 9.6.1 單選框簡(jiǎn)介 83 9.6.2 忽略點(diǎn) 84 9.7 復(fù)選框 86 9.8 按鈕 87 9.8.1 普通按鈕button 88 9.8.2 提交按鈕submit 89 9.8.3 重置按鈕reset 89 9.8.4 button標(biāo)簽 91 9.9 文件上傳 91 9.10 多行文本框 92 9.11 下拉列表 93 9.11.1 下拉列表簡(jiǎn)介 93 9.11.2 select標(biāo)簽屬性 94 9.11.3 option標(biāo)簽屬性 95 9.12 練習(xí)題 97 第10章 框架 10.1 iframe標(biāo)簽 99 10.2 練習(xí)題 100 第二部分 CSS基礎(chǔ) 第11章 CSS簡(jiǎn)介 11.1 CSS簡(jiǎn)介 102 11.1.1 CSS是什么 102 11.1.2 CSS和CSS3 102 11.2 教程簡(jiǎn)介 103 11.3 CSS引入方式 103 11.3.1 外部樣式表 103 11.3.2 內(nèi)部樣式表 104 11.3.3 行內(nèi)樣式表 105 11.4 練習(xí)題 106 第12章 CSS選擇器 12.1 元素的id和class 107 12.1.1 id屬性 107 12.1.2 class屬性 108 12.2 選擇器是什么 108 12.3 CSS選擇器 109 12.3.1 元素選擇器 110 12.3.2 id選擇器 110 12.3.3 class選擇器 111 12.3.4 后代選擇器 113 12.3.5 群組選擇器 114 12.4 練習(xí)題 116 第13章 字體樣式 13.1 字體樣式簡(jiǎn)介 118 13.2 字體類型(font-family)119 13.3 字體大。╢ont-size)120 13.3.1 px是什么 120 13.3.2 采用px為單位 121 13.4 字體粗細(xì)(font-weight)122 13.5 字體風(fēng)格(font-style)123 13.6 字體顏色(color)125 13.6.1 關(guān)鍵字 125 13.6.2 16進(jìn)制RGB值 125 13.7 CSS注釋 126 13.8 練習(xí)題 128 第14章 文本樣式 14.1 文本樣式簡(jiǎn)介 129 14.2 首行縮進(jìn)(text-indent)129 14.3 水平對(duì)齊(text-align)130 14.4 文本修飾(text-decoration)131 14.4.1 text-decoration屬性 131 14.4.2 三種劃線的用途分析 133 14.5 大小寫(xiě)(text-transform)134 14.6 行高(line-height)135 14.7 間距(letter-spacing和word-spacing)136 14.7.1 字間距 136 14.7.2 詞間距 136 14.8 練習(xí)題 137 第15章 邊框樣式 15.1 邊框樣式簡(jiǎn)介 139 15.2 整體樣式 140 15.2.1 邊框?qū)傩?140 15.2.2 簡(jiǎn)寫(xiě)形式 142 15.3 局部樣式 142 15.4 練習(xí)題 145 第16章 列表樣式 16.1 列表項(xiàng)符號(hào)(list-style-type)146 16.1.1 定義列表項(xiàng)符號(hào) 146 16.1.2 去除列表項(xiàng)符號(hào) 148 16.2 列表項(xiàng)圖片(list-style-image)149 16.3 練習(xí)題 150 第17章 表格樣式 17.1 表格標(biāo)題位置(caption-side)151 17.2 表格邊框合并(border-collapse)152 17.3 表格邊框間距(border-spacing)154 17.4 練習(xí)題 155 第18章 圖片樣式 18.1 圖片大小 156 18.2 圖片邊框 157 18.3 圖片對(duì)齊 158 18.3.1 水平對(duì)齊 158 18.3.2 垂直對(duì)齊 159 18.4 文字環(huán)繞初識(shí)float 162 18.5 練習(xí)題 163 第19章 背景樣式 19.1 背景樣式簡(jiǎn)介 164 19.2 背景顏色(background-color)164 19.3 背景圖片樣式(background-image)166 19.4 背景圖片重復(fù)(background-repeat)167 19.5 背景圖片位置(background-position)169 19.5.1 像素值 169 19.5.2 關(guān)鍵字 170 19.6 背景圖片固定(background-attachment)172 19.7 練習(xí)題 173 第20章 超鏈接樣式 20.1 超鏈接偽類 174 20.1.1 超鏈接偽類簡(jiǎn)介 174 20.1.2 深入了解超鏈接偽類 175 20.2 深入了解:hover 177 20.3 鼠標(biāo)樣式 178 20.3.1 瀏覽器鼠標(biāo)樣式 178 20.3.2 自定義鼠標(biāo)樣式 180 20.4 練習(xí)題 181 第21章 盒子模型 21.1 CSS盒子模型 182 21.2 寬和高(width和height)184 21.3 邊框(border)187 21.4 內(nèi)邊距(padding)188 21.4.1 padding局部樣式 188 21.4.2 padding簡(jiǎn)寫(xiě)形式 189 21.5 外邊距(margin)191 21.5.1 margin局部樣式191 21.5.2 margin簡(jiǎn)寫(xiě)形式 194 21.5.3 瀏覽器審查元素 195 21.6 練習(xí)題 196 第22章 浮動(dòng)布局 22.1 文檔流簡(jiǎn)介 197 22.1.1 正常文檔流 197 22.1.2 脫離文檔流 198 22.2 浮動(dòng) 200 22.3 清除浮動(dòng) 202 22.4 練習(xí)題 204 第23章 定位布局 23.1 定位布局簡(jiǎn)介 205 23.2 固定定位:fixed 206 23.3 相對(duì)定位:relative 207 23.4 絕對(duì)定位:absolute 209 23.5 靜態(tài)定位:static 211 23.6 練習(xí)題 211 第三部分 JavaScript基礎(chǔ) 第24章 JavaScript簡(jiǎn)介 24.1 JavaScript是什么214 24.1.1 JavaScript簡(jiǎn)介 214 24.1.2 教程介紹 215 24.2 JavaScript開(kāi)發(fā)工具 216 24.3 JavaScript引入方式 217 24.3.1 外部JavaScript 218 24.3.2 內(nèi)部JavaScript 219 24.3.3 元素屬性JavaScript 220 24.4 一個(gè)簡(jiǎn)單的JavaScript程序 221 24.5 練習(xí)題 222 第25章 語(yǔ)法基礎(chǔ) 25.1 語(yǔ)法簡(jiǎn)介 223 25.2 變量與常量 224 25.2.1 變量 225 25.2.2 常量 229 25.3 數(shù)據(jù)類型 229 25.3.1 數(shù)字 229 25.3.2 字符串 230 25.3.3 布爾值 232 25.3.4 未定義值 233 25.3.5 空值 234 25.4 運(yùn)算符 234 25.4.1 算術(shù)運(yùn)算符 235 25.4.2 賦值運(yùn)算符 239 25.4.3 比較運(yùn)算符 240 25.4.4 邏輯運(yùn)算符 241 25.4.5 條件運(yùn)算符 244 25.5 表達(dá)式與語(yǔ)句 245 25.6 類型轉(zhuǎn)換 245 25.6.1 字符串轉(zhuǎn)換為數(shù)字 245 25.6.2 數(shù)字轉(zhuǎn)換為字符串 248 25.7 轉(zhuǎn)義字符 249 25.8 注釋 251 25.8.1 單行注釋 251 25.8.2 多行注釋 252 25.9 練習(xí)題 253 第26章 流程控制 26.1 流程控制簡(jiǎn)介 255 26.1.1 順序結(jié)構(gòu) 255 26.1.2 選擇結(jié)構(gòu) 256 26.1.3 循環(huán)結(jié)構(gòu) 257 26.2 選擇結(jié)構(gòu):if 257 26.2.1 單向選擇:if… 257 26.2.2 雙向選擇:if…else… 259 26.2.3 多向選擇:if…else if…else… 260 26.2.4 if語(yǔ)句的嵌套 262 26.3 選擇結(jié)構(gòu):switch 264 26.4 循環(huán)結(jié)構(gòu):while 267 26.5 循環(huán)結(jié)構(gòu):do…while 270 26.6 循環(huán)結(jié)構(gòu):for 271 26.7 判斷整數(shù)或小數(shù) 274 26.8 找出水仙花數(shù) 275 26.9 練習(xí)題 276 第27章 初識(shí)函數(shù) 27.1 函數(shù)是什么? 278 27.2 函數(shù)的定義 280 27.2.1 沒(méi)有返回值的函數(shù) 280 27.2.2 有返回值的函數(shù) 282 27.2.3 全局變量與局部變量 283 27.3 函數(shù)的調(diào)用 285 27.3.1 直接調(diào)用 286 27.3.2 在表達(dá)式中調(diào)用 286 27.3.3 在超鏈接中調(diào)用 287 27.3.4 在事件中調(diào)用 288 27.4 嵌套函數(shù) 289 27.5 內(nèi)置函數(shù) 290 27.6 判斷某一年是否閏年 291 27.7 求出任意五個(gè)數(shù)最大值 292 27.8 練習(xí)題 292 第28章 字符串對(duì)象 28.1 內(nèi)置對(duì)象簡(jiǎn)介 294 28.2 獲取字符串長(zhǎng)度 295 28.3 大小寫(xiě)轉(zhuǎn)換 296 28.4 獲取某一個(gè)字符 297 28.5 截取字符串 298 28.6 替換字符串 300 28.7 分割字符串 302 28.8 檢索字符串的位置 304 28.9 統(tǒng)計(jì)某一個(gè)字符的個(gè)數(shù) 306 28.10 統(tǒng)計(jì)字符串中有多少個(gè)數(shù)字307 28.11 練習(xí)題 308 第29章 數(shù)組對(duì)象 29.1 數(shù)組是什么 309 29.2 數(shù)組的創(chuàng)建 310 29.3 數(shù)組的獲取 310 29.4 數(shù)組的賦值 311 29.5 獲取數(shù)組長(zhǎng)度 312 29.6 截取數(shù)組某部分 315 29.7 為數(shù)組添加元素 316 29.7.1 在數(shù)組開(kāi)頭添加元素:unshift() 316 29.7.2 在數(shù)組結(jié)尾添加元素:push() 318 29.8 刪除數(shù)組元素 319 29.8.1 刪除數(shù)組中第一個(gè)元素:shift() 319 29.8.2 刪除數(shù)組最后一個(gè)元素:pop() 320 29.9 數(shù)組大小比較 :sort()322 29.10 數(shù)組顛倒順序:reverse()323 29.11 將數(shù)組元素連接成字符串:join()323 29.12 數(shù)組與字符串的轉(zhuǎn)換操作 326 29.13 計(jì)算面積與體積,返回一個(gè)數(shù)組 326 29.14 練習(xí)題 327 第30章 時(shí)間對(duì)象 30.1 日期對(duì)象簡(jiǎn)介 329 30.2 操作年、月、日 331 30.2.1 獲取年、月、日 331 30.2.2 設(shè)置年、月、日 333 30.3 操作時(shí)、分、秒 334 30.3.1 獲取時(shí)、分、秒 334 30.3.2 設(shè)置時(shí)、分、秒 335 30.4 獲取星期幾 336 30.5 練習(xí)題 338 第31章 數(shù)學(xué)對(duì)象 31.1 數(shù)學(xué)對(duì)象簡(jiǎn)介 339 31.2 Math對(duì)象的屬性 339 31.3 Math對(duì)象的方法 341 31.4 最大值與最小值 341 31.5 取整運(yùn)算 342 31.5.1 向下取整:floor() 342 31.5.2 向上取整:ceil() 343 31.6 三角函數(shù) 344 31.7 生成隨機(jī)數(shù) 346 31.7.1 隨機(jī)生成某個(gè)范圍內(nèi)的任意數(shù) 346 31.7.2 隨機(jī)數(shù)生成某個(gè)范圍內(nèi)的整數(shù) 347 31.8 生成隨機(jī)驗(yàn)證碼 347 31.9 生成隨機(jī)顏色值 348 31.10 練習(xí)題 349 第32章 DOM基礎(chǔ) 32.1 核心技術(shù)簡(jiǎn)介 350 32.2 DOM是什么 351 32.2.1 DOM對(duì)象 351 32.2.2 DOM結(jié)構(gòu) 351 32.3 節(jié)點(diǎn)類型 352 32.4 獲取元素 353 32.4.1 getElementById() 353 32.4.2 getElementsByTagName 355 32.4.3 getElementsByClassName() 359 32.4.4 querySelector()和querySelectorAll() 360 32.4.5 getElementsByName() 363 32.4.6 document.title和document.body 364 32.5 創(chuàng)建元素 365 32.6 插入元素 370 32.6.1 appendChild() 370 32.6.2 insertBefore() 372 32.7 刪除元素 373 32.8 復(fù)制元素 376 32.9 替換元素 377 32.10 練習(xí)題 378 第33章 DOM進(jìn)階 33.1 HTML屬性操作(對(duì)象屬性) 380 33.1.1 獲取HTML屬性值 380 33.1.2 設(shè)置HTML屬性值 386 33.2 HTML屬性操作(對(duì)象方法) 388 33.2.1 getAttribute() 388 33.2.2 setAttribute() 390 33.2.3 removeAttribute() 391 33.2.4 hasAttribute() 393 33.3 CSS屬性操作 394 33.3.1 獲取CSS屬性值 394 33.3.2 設(shè)置CSS屬性值 396 33.3.3 最后一個(gè)問(wèn)題 401 33.4 DOM遍歷 404 33.4.1 查找父元素 404 33.4.2 查找子元素 406 33.4.3 查找兄弟元素 410 33.5 innerHTML和innerText 411 33.6 練習(xí)題 414 第34章 事件基礎(chǔ) 34.1 事件是什么 415 34.2 事件調(diào)用方式 416 34.2.1 在script標(biāo)簽中調(diào)用 416 34.2.2 在元素中調(diào)用事件 417 34.3 鼠標(biāo)事件 418 34.3.1 鼠標(biāo)單擊 419 34.3.2 鼠標(biāo)移入和鼠標(biāo)移出 421 34.3.3 鼠標(biāo)按下和鼠標(biāo)松開(kāi) 422 34.4 鍵盤事件 423 34.5 表單事件 425 34.5.1 onfocus和onblur 425 34.5.2 onselect 427 34.5.3 onchange 429 34.6 編輯事件 432 34.6.1 oncopy 432 34.6.2 onselectstart 433 34.6.3 oncontextmenu 434 34.7 頁(yè)面事件 435 34.7.1 onload 435 34.7.2 onbeforeunload 437 34.8 練習(xí)題 438 第35章 事件進(jìn)階 35.1 事件監(jiān)聽(tīng)器 439 35.1.1 事件處理器 439 35.1.2 事件監(jiān)聽(tīng)器 440 35.2 event對(duì)象 447 35.2.1 type 448 35.2.2 keyCode 448 35.3 this 451 35.4 練習(xí)題 454 第36章 window對(duì)象 36.1 window對(duì)象簡(jiǎn)介 455 36.2 窗口操作 457 36.2.1 打開(kāi)窗口 457 36.2.2 關(guān)閉窗口 462 36.3 對(duì)話框 464 36.3.1 alert() 464 36.3.2 confirm() 465 36.3.3 prompt() 466 36.4 定時(shí)器 467 36.4.1 setTimeout()和clearTimeout() 468 36.4.2 setInterval()和clearInterval() 472 36.5 location對(duì)象 476 36.5.1 window.location.href 476 36.5.2 window.location.search 477 13.5.3 window.location.hash 478 36.6 navigator對(duì)象 479 36.7 練習(xí)題 481 第37章 document對(duì)象 37.1 document對(duì)象簡(jiǎn)介 482 37.2 document對(duì)象屬性 482 37.2.1 document.URL 483 37.2.2 document.referrer 484 37.3 document對(duì)象方法 484 37.3.1 document.write() 485 37.3.2 document.writeln() 485 37.4 練習(xí)題 487 后記
你還可能感興趣
我要評(píng)論
|