同類熱銷排行榜

HTML+CSS+JavaScript網頁製作案例教程(AI助學第3版工業和信息化精品系列教材)

作者：編者:謝劍剛//劉磊//吳實蓮|責編:范博濤
出版社：人民郵電
ISBN：9787115689269

出版日期：2026/09/01
裝幀：平裝
頁數：310

人民幣：RMB 69.8 元售價：元

內容大鋼

    本書從初學者的角度出發，通過實用的案例和通俗易懂的語言，詳細介紹使用HTML5、CSS3和JavaScript進行網頁製作的技巧。
    本書共10章，內容包括HTML5+CSS3網頁設計概述、構建HTML5頁面、運用CSS3美化頁面、運用盒子模型劃分網頁模塊、為網頁添加列表和超鏈接、為網頁添加表格和表單、運用浮動和定位布局、全新的網頁視聽技術、JavaScript入門、實戰開發——好趣藝術設計部落首頁。
    本書配套豐富的教學資源，包括教學PPT、教學大綱、教學設計、源代碼、課後習題及答案等。為幫助讀者更好地學習本書中的內容，編寫團隊還提供了在線答疑服務。
    本書既可作為高等教育本、專科院校電腦相關專業的教材，也可作為前端開發愛好者的自學參考書。

作者介紹

編者:謝劍剛//劉磊//吳實蓮|責編:范博濤

第1章 HTML5+CSS3網頁設計
  概述
  1.1 網頁簡介
    1.1.1 網頁的組成
    1.1.2 網頁的相關名詞
    1.1.3 Web標準
  1.2 網頁製作技術
    1.2.1 HTML
    1.2.2 CSS
    1.2.3 JavaScript
  1.3 瀏覽器
  1.4 Visual Studio Code編輯器
    1.4.1 下載和安裝Visual Studio Code編輯器
    1.4.2 安裝擴展
    1.4.3 Visual Studio Code編輯器的簡單使用
  AI實踐：AI與網頁工具初體驗
  本章小結
  本章習題
第2章構建HTML5頁面
  案例2-1 剪紙介紹頁面
    案例描述
    知識引入
      1. HTML文檔的基本格式
      2. 標籤分類
      3. 標籤屬性
      4. 頁面格式化標籤
    案例實現
  案例2-2 新聞頁面
    案例描述
    知識引入
      1. HTML文檔頭部標籤
      2. 文本格式化標籤
    案例實現
  案例2-3 圖文混排頁面
    案例描述
    知識引入
      1. 常見圖像格式
      2. 圖像標籤
      3. 相對路徑和絕對路徑
      4. 特殊字元
    案例實現
  AI實踐：基於AI開發個人作品集網站
  本章小結
  本章習題
第3章運用CSS3美化頁面
  案例3-1 變色文字
    案例描述
    知識引入
      1. 認識CSS
      2. CSS樣式規則

      3. 引入CSS樣式
      4. CSS基礎選擇器
    案例實現
  案例3-2 鮮花專題欄目
    案例描述
    知識引入
      1. 字體樣式屬性
      2. 文本外觀屬性
    案例實現
  案例3-3 搜索頁面
    案例描述
    知識引入
      1. CSS複合選擇器
      2. CSS層疊性和繼承性
      3. CSS優先順序
    案例實現
  AI實踐：基於AI優化網站的CSS樣式
  本章小結
  本章習題
第4章運用盒子模型劃分網頁模塊
  案例4-1 環保宣傳頁面
    案例描述
    知識引入
      1. 認識盒子模型
      2.

標籤
      3. 邊框屬性
    案例實現
  案例4-2 圖書介紹專欄
    案例描述
    知識引入
      1. 內邊距屬性
      2. 外邊距屬性
      3. 寬度屬性和高度屬性
    案例實現
  案例4-3 背景拼圖
    案例描述
    知識引入
      1. 設置背景顏色
      2. 設置背景圖像
      3. 設置背景圖像平鋪
      4. 設置背景圖像的位置
      5. 設置背景圖像位置固定
      6. 綜合設置元素的背景樣式
      7. 多背景圖像
    案例實現
  案例4-4 電商網站導航欄
    案例描述
    知識引入
      1. 元素類型
      2. 標籤

      3. 元素類型的轉換
    案例實現
  案例4-5 創意相框
    案例描述
    知識引入
      1. 顏色透明度
      2. 陰影
      3. 漸變
    案例實現
  AI實踐：基於AI開發產品展示頁面
  本章小結
  本章習題
第5章為網頁添加列表和超鏈接
  案例5-1 美味食譜頁面
    案例描述
    知識引入
      1. 無序列表標籤
      2. 有序列表標籤
      3. 定義列表標籤
      4. 列表嵌套的應用
    案例實現
  案例5-2 電商團購懸浮框
    案例描述
    知識引入
      1. 列表樣式屬性
      2. 通過背景圖像定義列表項目符號
    案例實現
  案例5-3 電商頁面
    案例描述
    知識引入
      1. 超鏈接
      2. 錨點鏈接
      3. 鏈接偽類控制超鏈接樣式
    案例實現
  AI實踐：基於AI製作在線食譜分享網站
  本章小結
  本章習題
第6章為網頁添加表格和表單
  案例6-1 在線簡歷表
    案例描述
    知識引入
      1. 創建表格
      2. 表格標籤的屬性
      3. 表格的結構
      4. CSS控製表格樣式
    案例實現
  案例6-2 課題問卷調研表
    案例描述
    知識引入
      1. 認識表單

      2. 創建表單
      3. 標籤
      4.

標籤<br>      5. <select>標籤<br>    案例實現<br>  案例6-3 員工信息登記表<br>    案例描述<br>    知識引入<br>      CSS控製表單樣式<br>    案例實現<br>  AI實踐：基於AI製作註冊頁面<br>  本章小結<br>  本章習題<br>第7章 運用浮動和定位布局<br>  案例7-1 古典樂器展示頁面<br>    案例描述<br>    知識引入<br>      1. 布局概述<br>      2. 浮動屬性<br>      3. 清除浮動<br>    案例實現<br>  案例7-2 中國載人航天網站頁面<br>    案例描述<br>    知識引入<br>      overflow屬性<br>    案例實現<br>  案例7-3 智能導航界面<br>    案例描述<br>    知識引入<br>      1. 元素的定位<br>      2. 不同定位模式的特點<br>      3. 重疊順序屬性<br>    案例實現<br>  案例7-4 鮮花驛站首頁<br>    案例描述<br>    知識引入<br>      1. 單列布局<br>      2. 兩列布局<br>      3. 三列布局<br>      4. 網頁模塊命名規範<br>    案例實現<br>  AI實踐：基於AI製作電商頁面<br>  本章小結<br>  本章習題<br>第8章 全新的網頁視聽技術<br>  案例8-1 影視播放頁面<br>    案例描述<br>    知識引入<br>      1. 視頻和音頻嵌入技術概述<br>      2. 嵌入視頻<br><BR>      3. 嵌入音頻<br>      4. 瀏覽器對視頻和音頻文件的兼容性<br>      5. 控制視頻寬度和高度<br>    案例實現<br>  案例8-2 導航欄滑鼠指針懸停特效<br>    案例描述<br>    知識引入<br>      1. transition-property屬性<br>      2. transition-duration屬性<br>      3. transition-timing-function屬性<br>      4. transition-delay屬性<br>      5. transition屬性<br>    案例實現<br>  案例8-3 翻牌動畫<br>    案例描述<br>    知識引入<br>      1. 2D變形<br>      2. 3D變形<br>    案例實現<br>  案例8-4 太陽笑臉<br>    案例描述<br>    知識引入<br>      1. @keyframes規則<br>      2. animation-name屬性<br>      3. animation-duration屬性<br>      4. animation-timing-function屬性<br>      5. animation-delay屬性<br>      6. animation-iteration-count屬性<br>      7. animation-direction屬性<br>      8. animation屬性<br>    案例實現<br>  AI實踐：基於AI製作視頻網站首頁<br>  本章小結<br>  本章習題<br>第9章 JavaScript入門<br>  案例9-1 身份驗證<br>    案例描述<br>    知識引入<br>      1. 認識JavaScript<br>      2. JavaScript語法規則<br>      3. 關鍵字<br>      4. JavaScript腳本代碼的引入方式<br>      5. alert()方法<br>      6. prompt()方法<br>    案例實現<br>  案例9-2 商城下拉菜單式導航欄<br>    案例描述<br>    知識引入<br>      1. DOM簡介<br>      2. 對象<br><BR>      3. 訪問節點<br>      4. 設置節點樣式<br>      5. 變數<br>      6. 函數<br>      7. 事件<br>      8. JavaScript中的常用事件<br>    案例實現<br>  案例9-3 限時搶購頁面<br>    案例描述<br>    知識引入<br>      1. 數據類型<br>      2. 運算符<br>      3. 運算符優先順序與結合性<br>      4. 條件語句<br>      5. BOM簡介<br>      6. Date對象<br>      7. 數據類型轉換<br>    案例實現<br>  案例9-4 Tab欄切換效果<br>    案例描述<br>    知識引入<br>      1. 循環語句<br>      2. 跳轉語句<br>      3. 數組<br>    案例實現<br>  AI實踐：基於AI製作在線學習平台註冊與登錄頁面<br>  本章小結<br>  本章習題<br>第10章 實戰開發——好趣藝術設計部落首頁<br>  10.1 效果圖分析<br>    10.1.1 HTML結構分析<br>    10.1.2 CSS樣式和JavaScript特效分析<br>  10.2 頁面製作<br>    10.2.1 製作頭部和導航模塊<br>    10.2.2 製作焦點圖和通知公告模塊<br>    10.2.3 製作主體內容模塊<br>    10.2.4 製作版權信息模塊<br>  10.3 本章小結<br><BR>
		
						</div>
					</div>
					
					
				</div>
			</div>
			
		</div>
			
			
			
		</div>
		
		
        <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>

同類熱銷排行榜

最近瀏覽的商品

HTML+CSS+JavaScript網頁製作案例教程(AI助學第3版工業和信息化精品系列教材)