本書結合流行有趣的熱點案例，詳細介紹了HTML5+CSS3+JavaScript開發中的各項技術。本書共17章，分別介紹了HTML5基礎、網頁中的文本、圖像和超鏈接、CSS3基礎入門、CSS3常用屬性、CSS3的高級應用、設計列表與菜單、表格與
標記、網頁中的表單、JavaScript基礎入門、JavaScript編程基礎、JavaScript對象編程、JavaScript事件機制、繪製網頁圖形、文件與拖放、響應式網頁組件，最後通過設計企業響應式網站的綜合案例對本書所講的各項技術進行了綜合應用。
本書內容側重實戰，每個重要的技術都精心配置了實例，在講解完知識點的詳細內容后，可以通過實例進一步深入了解該技術的應用場景及實現效果，這種「知識點+實例」的設置更易於記憶和理解，也為實際應用打下了堅實的基礎。另外，書中還設置有「大牛提醒」，對重要的知識點查漏補缺或進行拓展說明，以做到重點內容全覆蓋。每章內容學習完還可以通過「實戰訓練」檢驗學習成果，並且案例和實戰練習都配有視頻操作，在學習中遇到疑難可以隨時觀看視頻尋求答案。
本書適合零基礎的網頁設計者和希望快速掌握HTML5+CSS3+JavaScript開發技術的人員學習使用；針對有一定網頁設計基礎的讀者，也可以通過本書進一步理解HTML5+CSS3+JavaScript的重要知識和開發技能。對於大中專院校的學生和培訓機構的學員，本書也是一本非常實用的教材。
目錄
第1章 HTML5基礎
1.1 HTML概述
1.1.1 什麼是HTML
1.1.2 HTML的發展歷程
1.2 HTML5文件的基本結構
1.2.1 認識標記
1.2.2 認識元素
1.2.3 HTML文件結構
1.3 HTML5的基本標記
1.3.1 文件類型說明
1.3.2 文件開始標記
1.3.3 文件頭部標記
1.3.4 文件標題標記
<br> 1.3.5 元信息標記<meta><br> 1.3.6 網頁主體標記<body><br> 1.3.7 頁面註釋標記<!-- --><br> 1.4 編寫我的第一個HTML文件<br> 1.4.1 使用「記事本」編寫<br> 1.4.2 使用WebStorm工具編寫<br> 1.5 新手疑難問題解答<br> 1.6 實戰訓練<br>第2章 網頁中的文本<br> 2.1 設置標題格式<br> 2.1.1 標題標記<br> 2.1.2 標題對齊方式<br> 2.2 設置文字格式<br> 2.2.1 文字的字體、大小和顏色<br> 2.2.2 文字的斜體、下畫線和刪除線<br> 2.2.3 公式的上標和下標<br> 2.3 設置段落格式<br> 2.3.1 段落標記<br> 2.3.2 段落換行標記<br> 2.3.3 段落原格式標記<br> 2.4 網頁的水平線<br> 2.4.1 添加水平線<br> 2.4.2 設置水平線的樣式<br> 2.5 新手疑難問題解答<br> 2.6 實戰訓練<br>第3章 圖像和超鏈接<br> 3.1 添加圖像<br> 3.1.1 了解圖像格式<br> 3.1.2 圖像中的路徑<br> 3.1.3 插入圖像<br> 3.2 設置圖像屬性<br> 3.2.1 圖像的大小與邊框<br> 3.2.2 圖像間距和對齊方式<br> 3.2.3 替換文本與提示文字<br> 3.3 網頁中的超鏈接<br> 3.3.1 文本鏈接<br> 3.3.2 下載鏈接<br><BR> 3.3.3 書籤鏈接<br> 3.3.4 電子郵件鏈接<br> 3.4 圖像的超鏈接<br> 3.4.1 創建圖片鏈接<br> 3.4.2 圖像熱點鏈接<br> 3.5 新手疑難問題解答<br> 3.6 實戰訓練<br>第4章 CSS3基礎入門<br> 4.1 CSS概述<br> 4.1.1 CSS發展歷史<br> 4.1.2 CSS語法規則<br> 4.1.3 CSS註釋方式<br> 4.2 HTML5中調用CSS的方法<br> 4.2.1 行內樣式<br> 4.2.2 內嵌樣式<br> 4.2.3 鏈接樣式<br> 4.2.4 導入樣式<br> 4.3 CSS3中的選擇器<br> 4.3.1 標記選擇器<br> 4.3.2 全局選擇器<br> 4.3.3 類與ID選擇器<br> 4.3.4 組合選擇器<br> 4.3.5 屬性選擇器<br> 4.3.6 偽類選擇器<br> 4.3.7 結構偽類選擇器<br> 4.3.8 UI元素狀態偽類選擇器<br> 4.4 新手疑難問題解答<br> 4.5 實戰訓練<br>第5章 CSS3常用屬性<br> 5.1 文本相關屬性<br> 5.1.1 定義字體類型<br> 5.1.2 定義字體大小<br> 5.1.3 定義文字的顏色<br> 5.1.4 定義文本的水平對齊方式<br> 5.2 圖片相關屬性<br> 5.2.1 定義文字環繞圖片的樣式<br> 5.2.2 定義圖片與文字的間距<br> 5.3 邊框相關屬性<br> 5.3.1 邊框樣式<br> 5.3.2 邊框顏色<br> 5.3.3 邊框線寬<br> 5.3.4 邊框半徑<br> 5.4 背景相關屬性<br> 5.4.1 設置背景顏色<br> 5.4.2 設置背景圖像<br> 5.4.3 平鋪背景圖像<br> 5.4.4 定位背景圖像<br> 5.4.5 設置背景圖像大小<br> 5.5 新手疑難問題解答<br> 5.6 實戰訓練<br><BR>第6章 CSS3的高級應用<br> 6.1 盒子模型<br> 6.1.1 盒子模型的外邊距<br> 6.1.2 盒子模型的邊框<br> 6.1.3 盒子模型的內邊距<br> 6.1.4 盒子模型的高度和寬度<br> 6.1.5 盒子模型的相關屬性<br> 6.2 動畫與特效<br> 6.2.1 變換動畫效果<br> 6.2.2 過渡動畫效果<br> 6.2.3 幀動畫效果<br> 6.3 新手疑難問題解答<br> 6.4 實戰訓練<br>第7章 設計列表與菜單<br> 7.1 認識列表標記<br> 7.1.1 無序列表標記<br> 7.1.2 有序列表標記<br> 7.1.3 自定義列表標記<br> 7.1.4 列表的嵌套<br> 7.2 使用CSS設計列表樣式<br> 7.2.1 無序項目列表<br> 7.2.2 有序項目列表<br> 7.2.3 圖片列表樣式<br> 7.2.4 列表複合屬性<br> 7.3 使用CSS設計菜單樣式<br> 7.3.1 製作動態導航菜單<br> 7.3.2 製作水平方向菜單<br> 7.3.3 製作多級菜單列表<br> 7.4 新手疑難問題解答<br> 7.5 實戰訓練<br>第8章 表格與<div>標記<br> 8.1 簡單表格<br> 8.1.1 創建簡單表格<br> 8.1.2 表格的表頭<br> 8.2 表格的高級應用<br> 8.2.1 表格的樣式<br> 8.2.2 表格的合併<br> 8.2.3 表格的分組<br> 8.3 使用CSS3設計表格樣式<br> 8.3.1 設置表格顏色<br> 8.3.2 設置表格邊框<br> 8.3.3 表格標題位置<br> 8.3.4 隱藏空單元格<br> 8.3.5 單元格的邊距<br> 8.4 <div>與<span>標記<br> 8.5 新手疑難問題解答<br> 8.6 實戰訓練<br>第9章 網頁中的表單<br> 9.1 表單概述<br> 9.1.1 表單定義<br><BR> 9.1.2 表單標記<form><br> 9.2 輸入標記<br> 9.2.1 文本框<br> 9.2.2 單選按鈕和複選框<br> 9.2.3 按鈕<br> 9.2.4 圖像域和文件域<br> 9.3 文本域與列表<br> 9.3.1 文本域<br> 9.3.2 列表/菜單<br> 9.4 使用CSS3設計表單樣式<br> 9.4.1 表單字體樣式<br> 9.4.2 表單邊框樣式<br> 9.4.3 表單背景樣式<br> 9.4.4 表單按鈕樣式<br> 9.4.5 下拉菜單樣式<br> 9.5 新手疑難問題解答<br> 9.6 實戰訓練<br>第10章 JavaScript基礎入門<br> 10.1 JavaScript概述<br> 10.1.1 JavaScript能做什麼<br> 10.1.2 JavaScript的主要特點<br> 10.1.3 JavaScript在HTML中的使用<br> 10.2 JavaScript的語法<br> 10.2.1 代碼執行順序<br> 10.2.2 區分大小寫<br> 10.2.3 分號與空格<br> 10.2.4 註釋語句<br> 10.3 JavaScript語言基礎<br> 10.3.1 認識變數<br> 10.3.2 數據類型<br> 10.3.3 認識運算符<br> 10.3.4 運算符優先順序<br> 10.4 新手疑難問題解答<br> 10.5 實戰訓練<br>第11章 JavaScript編程基礎<br> 11.1 JavaScript中的語句<br> 11.1.1 條件語句<br> 11.1.2 循環語句<br> 11.1.3 跳轉語句<br> 11.2 JavaScript對象與數組<br> 11.2.1 創建對象<br> 11.2.2 常用內置對象<br> 11.2.3 數組對象與方法<br> 11.3 JavaScript中的函數<br> 11.3.1 定義函數<br> 11.3.2 函數調用<br> 11.4 新手疑難問題解答<br> 11.5 實戰訓練<br>第12章 JavaScript對象編程<br> 12.1 窗口（Window）對象<br><BR> 12.1.1 窗口對象屬性<br> 12.1.2 窗口對象方法<br> 12.2 JavaScript對話框<br> 12.2.1 警告對話框<br> 12.2.2 確認對話框<br> 12.2.3 提示對話框<br> 12.3 文檔對象<br> 12.3.1 文檔對象屬性<br> 12.3.2 文檔對象方法<br> 12.4 文檔對象模型<br> 12.4.1 DOM簡介<br> 12.4.2 基本的DOM方法<br> 12.5 操作DOM中的節點<br> 12.5.1 訪問節點<br> 12.5.2 創建節點<br> 12.5.3 插入節點<br> 12.5.4 刪除節點<br> 12.5.5 複製節點<br> 12.5.6 替換節點<br> 12.6 新手疑難問題解答<br> 12.7 實戰訓練<br>第13章 JavaScript事件機制<br> 13.1 什麼是事件<br> 13.2 事件的調用方式<br> 13.2.1 在<script>標記中調用<br> 13.2.2 在元素中調用<br> 13.3 JavaScript常用事件<br> 13.3.1 滑鼠相關事件<br> 13.3.2 鍵盤相關事件<br> 13.3.3 表單相關事件<br> 13.3.4 拖動相關事件<br> 13.4 處理事件的方式<br> 13.4.1 通過匿名函數處理<br> 13.4.2 通過顯式聲明處理<br> 13.4.3 通過手工觸發處理<br> 13.5 新手疑難問題解答<br> 13.6 實戰訓練<br>第14章 繪製網頁圖形<br> 14.1 <canvas>標記<br> 14.2 繪製基本形狀<br> 14.2.1 繪製矩形<br> 14.2.2 繪製圓形<br> 14.2.3 繪製直線<br> 14.2.4 繪製貝濟埃曲線<br> 14.3 繪製變形圖形<br> 14.3.1 繪製平移效果的圖形<br> 14.3.2 繪製縮放效果的圖形<br> 14.3.3 繪製旋轉效果的圖形<br> 14.3.4 繪製帶陰影效果的圖形<br> 14.4 繪製文字<br><BR> 14.4.1 繪製輪廓文字<br> 14.4.2 繪製填充文字<br> 14.5 新手疑難問題解答<br> 14.6 實戰訓練<br>第15章 文件與拖放<br> 15.1 選擇文件<br> 15.1.1 選擇單個文件<br> 15.1.2 選擇多個文件<br> 15.2 讀取文件<br> 15.2.1 檢測瀏覽器是否支持FileReader介面<br> 15.2.2 FileReader介面的方法<br> 15.2.3 使用readAsDataURL()方法預覽圖片<br> 15.2.4 使用readAsText()方法讀取文本文件<br> 15.3 拖放文件<br> 15.3.1 拖放頁面元素<br> 15.3.2 dataTransfer屬性<br> 15.3.3 在網頁中拖放文字<br> 15.4 新手疑難問題解答<br> 15.5 實戰訓練<br>第16章 響應式網頁組件<br> 16.1 響應式網頁設計概述<br> 16.1.1 什麼是響應式網頁設計<br> 16.1.2 響應式網頁設計原理<br> 16.1.3 像素和屏幕解析度<br> 16.1.4 視口與媒體查詢<br> 16.2 響應式網頁的布局設計<br> 16.2.1 常用布局類型<br> 16.2.2 布局的實現方式<br> 16.2.3 響應式布局的實現<br> 16.3 響應式圖片<br> 16.3.1 使用<picture>標記<br> 16.3.2 使用CSS圖片<br> 16.4 響應式視頻<br> 16.5 響應式導航菜單<br> 16.6 響應式表格<br> 16.6.1 隱藏表格中的列<br> 16.6.2 滾動表格中的列<br> 16.6.3 轉換表格中的列<br> 16.7 新手疑難問題解答<br> 16.8 實戰訓練<br>第17章 設計企業響應式網站<br> 17.1 網站概述<br> 17.1.1 網站結構<br> 17.1.2 設計效果<br> 17.1.3 設計準備<br> 17.2 設計主頁<br> 17.2.1 主頁布局<br> 17.2.2 設計導航條<br> 17.2.3 設計輪播廣告<br> 17.2.4 設計功能區<br><BR> 17.2.5 設計特色展示<br> 17.2.6 設計腳註<br> 17.3 設計側邊導航欄<br> 17.4 設計登錄頁<br><BR>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- bottom -->
<script language="javascript">
<!--
function f_search_bottom()
{
document.form3.target="_self";
document.form3.action = "//tl.zxhsd.com/tw/big5_search.jsp";
document.form3.keyword.value=Traditionalized(document.form3.keyword_input.value);
//document.form3.submit();
}
// -->
</script>
<div class="hw_bottom">
<div class="clearLine" style="height:30px;"></div>
<div class="bottomhelpbox">
<ul>
<li style="list-style-type:none; padding:0;"><strong style="color:#333333;">Δ購買商品</strong></li>
<li><a href="//tl.zxhsd.com/help/help_gwlc.html" target="_blank">購物流程</a></li>
<li><a href="//tl.zxhsd.com/help/help_reg.html" target="_blank">註冊帳戶</a></li>
<li><a href="//tl.zxhsd.com/help/help_changepsw.html" target="_blank">更改註冊資訊</a></li>
</ul>
<ul>
<li style="list-style-type:none; padding:0;"><strong style="color:#333333;">Δ售後服務</strong></li>
<li><a href="//tl.zxhsd.com/help/help_thyz.html" target="_blank">退換貨原則</a></li>
<li><a href="//tl.zxhsd.com/help/help_thhzy.html" target="_blank">退換貨注意事項</a></li>
<li><a href="//tl.zxhsd.com/help/help_thlc.html" target="_blank">退換貨流程</a></li>
</ul>
<ul>
<li style="list-style-type:none; padding:0;"><strong style="color:#333333;">Δ訂單支付</strong></li>
<li><a href="//tl.zxhsd.com/help/help_fkfs.html" target="_blank">付款方式</a></li>
<li><a href="//tl.zxhsd.com/help/help_yfjs.html" target="_blank">運費計算方式</a></li>
</ul>
<ul>
<li style="list-style-type:none; padding:0;"><strong style="color:#333333;">Δ關於我們</strong></li>
<li><a href="//tl.zxhsd.com/help/help_about_us.html" target="_blank">關於美商天龍</a></li>
<li><a href="//tl.zxhsd.com/help/help_connet_us.html" target="_blank">聯絡我們</a></li>
</ul>
</div>
<div class="bottomSearche">
<div style="width:680px; margin:0 auto;">
<form name="form3" action="" method="post" onSubmit='return f_search_bottom();'>
<input name="soure_lx" type="hidden" value="big5">
<input name="keyword" type="hidden" value="">
<ul>
<li class="width1">商品搜索：</li>
<li class="width5">
<select name="category">
<option value="gjz" >全文搜索</option>
<option value="sm" >商品名</option>
<option value="zz" >作者</option>
<option value="cbs" >出版社</option>
<option value="isbn" >ISBN</option>
</select>
</li>
<li class="width2">
<input type="text" name="keyword_input" />
</li>
<li class="width3">
<div id="navGoButton">
<input type="image" src="//tl.zxhsd.com/images/transparent_pixel.gif" alt="Go" id="navGoButtonPanel" onmouseover="shiftImage('navGoButtonPanel',0,-22,'navGoButton');" onmouseout="shiftImage('navGoButtonPanel',0,0,'navGoButton');" onfocus="shiftImage('navGoButtonPanel',0,-22,'navGoButton');" onblur="shiftImage('navGoButtonPanel',0,0,'navGoButton');" />
</div>
</li>
<li class="width4">| <a href="#" target="_blank">高級搜索</a></li>
</ul>
</form>
</div>
</div>
<div class="bottombase">
<a href="//tl.zxhsd.com/" target="_blank">首頁</a>│
<a href="//tl.zxhsd.com/help/help.shtml" target="_blank">新手上路</a>│
<a href="//tl.zxhsd.com/help/help.shtml" target="_blank">客服中心</a>│
<a href="//tl.zxhsd.com/help/help_about_us.html" target="_blank">關於我們</a>│
<a href="//tl.zxhsd.com/help/help_connet_us.html" target="_blank">聯絡我們</a>│
<a href="#">Top↑</a>│<br />
Copyrightc 1999~2008 美商天龍國際圖書股份有限公司 臺灣分公司. All rights reserved.<br />
營業地址:臺北市中正區重慶南路一段103號1F 105號1F-2F<br />
讀者服務部電話：02-2381-2033 02-2381-1863 時間：週一-週五 10:00-17:00<br />
服務信箱：bookuu@69book.com 客戶、意見信箱:<a href="mailto:cs@69book.com">cs@69book.com</a>
<br />ICP證：浙B2-20060032
</div>
<div style="clear:both; height:20px;"></div>
</div>
</div>
</div>
</body>
</html>
<!-- Generated by Gemway InfoPublisher V2.0 at 2024-04-11 13:53:19 cost 208ms -->
[