第1章 Web技術(shù)概述 1
1.1 Internet概述 1
1.1.1 TCP/IP 1
1.1.2 主機(jī)和IP地址 2
1.1.3 域名和DNS 3
1.2 Web概述 3
1.2.1 Web歷史 4
1.2.2 Web體系結(jié)構(gòu) 5
1.2.3 基本W(wǎng)eb技術(shù) 5
1.2.4 Web服務(wù)器 9
1.3 超文本與標(biāo)記語言 9
1.3.1 超文本與超媒體 10
1.3.2 標(biāo)記語言 10
1.4 Web標(biāo)準(zhǔn) 12
1.4.1 Web標(biāo)準(zhǔn)體系 13
1.4.2 采用Web標(biāo)準(zhǔn)的優(yōu)勢 15
1.5 瀏覽器 15
1.5.1 瀏覽器的發(fā)展史 15
1.5.2 瀏覽器的內(nèi)核 16
1.5.3 常用瀏覽器 16
1.5.4 標(biāo)準(zhǔn)瀏覽器 17
1.6 Web開發(fā)工具 18
1.6.1 JetBrains WebStorm 19
1.6.2 測試和調(diào)試環(huán)境 19
1.7 小結(jié) 20
1.8 習(xí)題 20
第2章 初識HTML5 21
2.1 HTML5基礎(chǔ) 21
2.1.1 HTML5文檔結(jié)構(gòu) 21
2.1.2 元素與標(biāo)簽 22
2.1.3 屬性 26
2.1.4 語法規(guī)則 27
2.2 WebStorm基礎(chǔ) 27
2.2.1 WebStorm的基本操作 28
2.2.2 WebStorm的快捷鍵 29
2.3 文檔結(jié)構(gòu)元素 30
2.3.1 標(biāo)簽 31
2.3.2
標(biāo)簽 31
2.3.3
標(biāo)簽 31
2.4 頭部元素 31
2.4.1
標(biāo)簽 31</p>
<p>2.4.2 <meta>標(biāo)簽 32</p>
<p>2.5 為叮叮書店首頁添加元信息 35</p>
<p>2.6 小結(jié) 36</p>
<p>2.7 習(xí)題 36</p>
<p> 第3章 HTML5內(nèi)容結(jié)構(gòu)與文本 37</p>
<p>3.1 HTML5結(jié)構(gòu)標(biāo)簽 37</p>
<p>3.1.1 <header>標(biāo)簽 38</p>
<p>3.1.2 <main>標(biāo)簽 38</p>
<p>3.1.3 <nav>標(biāo)簽 38</p>
<p>3.1.4 <article>標(biāo)簽 38</p>
<p>3.1.5 <section>標(biāo)簽 38</p>
<p>3.1.6 <aside>標(biāo)簽 39</p>
<p>3.1.7 <footer>標(biāo)簽 39</p>
<p>3.1.8 <details>標(biāo)簽和<summary>標(biāo)簽 39</p>
<p>3.1.9 <div>標(biāo)簽 39</p>
<p>3.1.10 <span>標(biāo)簽 40</p>
<p>3.2 HTML5基礎(chǔ)標(biāo)簽 40</p>
<p>3.2.1 標(biāo)題 40</p>
<p>3.2.2 段落 41</p>
<p>3.2.3 換行符 41</p>
<p>3.2.4 注釋 41</p>
<p>3.3 HTML5格式化標(biāo)簽 41</p>
<p>3.3.1 文本格式化標(biāo)簽 41</p>
<p>3.3.2 引用和術(shù)語定義標(biāo)簽 43</p>
<p>3.3.3 HTML5新增格式標(biāo)簽 44</p>
<p>3.4 HTML5列表 47</p>
<p>3.4.1 無序列表 47</p>
<p>3.4.2 有序列表 48</p>
<p>3.4.3 定義列表 49</p>
<p>3.5 叮叮書店首頁內(nèi)容結(jié)構(gòu)的建立 49</p>
<p>3.5.1 分析設(shè)計(jì)頁面內(nèi)容結(jié)構(gòu) 50</p>
<p>3.5.2 用HTML5結(jié)構(gòu)標(biāo)簽確定頁面內(nèi)容結(jié)構(gòu) 50</p>
<p>3.5.3 添加文本內(nèi)容 53</p>
<p>3.5.4 在瀏覽器中預(yù)覽 57</p>
<p>3.6 小結(jié) 58</p>
<p>3.7 習(xí)題 5</p>
<p></div>
</div>
</div>
<div id="epq1u6m" class="text-center margin-large-bottom">
<script async src="http://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- read*底部 -->
<ins class="adsbygoogle"
style="display:inline-block;width:728px;height:90px"
data-ad-client="ca-pub-7029444221371985"
data-ad-slot="7049136436"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
</div>
</div>
<div id="2gd6iip" class="bookdetails-right">
<div style="height:250px;">
<div id="rcb1k4e" class="_8yiuxfzeh64"></div>
<script type="text/javascript">
(window.slotbydup = window.slotbydup || []).push({
id: "u2724904",
container: "_8yiuxfzeh64",
async: true
});
</script>
</div>
<div id="eiwlbc8" class="tit margin-big-top"><h3>本目錄推薦</h3></div>
<div class="9ml8d6u" id="J_commend" class="books-left border">
<ul>
<li>
<p style="display: none;" class="fold">
<a href="/book/14174423/" title="優(yōu)設(shè)Cinema 4D三維設(shè)計(jì)實(shí)訓(xùn)教程" target="_blank"><i>01</i>優(yōu)設(shè)Cinema 4D三維設(shè)計(jì)實(shí)…</a></p>
<div id="dqq1drp" class="unfold" style="display: block;">
<i>01</i>
<div>
<div id="fpofgfi" class="img80"><a href="/book/14174423/" title="優(yōu)設(shè)Cinema 4D三維設(shè)計(jì)實(shí)訓(xùn)教程" target="_blank"><img src="https://img.dushu.com/2025/05/30/01353287840362289.jpg_80.jpg" alt="優(yōu)設(shè)Cinema 4D三維設(shè)計(jì)實(shí)訓(xùn)教程"></a></div>
<h3><a href="/book/14174423/" title="優(yōu)設(shè)Cinema 4D三維設(shè)計(jì)實(shí)訓(xùn)教程" target="_blank">優(yōu)設(shè)Cinema 4D三維設(shè)計(jì)實(shí)訓(xùn)教程…</a></h3>
<p></p>
</div>
</div>
</li>
<li>
<p style="display: block;" class="fold">
<a href="/book/14174409/" title="AI+Maya 2025從新手到高手（微課版）" target="_blank"><i>02</i>AI+Maya 2025從新手到高手…</a></p>
<div id="k94wbee" class="unfold" style="display: none;">
<i>02</i>
<div>
<div id="lx4f7xu" class="img80"><a href="/book/14174409/" title="AI+Maya 2025從新手到高手（微課版）" target="_blank"><img src="https://img.dushu.com/2025/05/30/0133288940366394.jpg_80.jpg" alt="AI+Maya 2025從新手到高手（微課版）"></a></div>
<h3><a href="/book/14174409/" title="AI+Maya 2025從新手到高手（微課版）" target="_blank">AI+Maya 2025從新手到高手（微課…</a></h3>
<p></p>
</div>
</div>
</li>
<li>
<p style="display: block;" class="fold">
<a href="/book/14174431/" title="圖像擬態(tài)融合理論、模型和應(yīng)用" target="_blank"><i>03</i>圖像擬態(tài)融合理論、模型和…</a></p>
<div id="89dxwed" class="unfold" style="display: none;">
<i>03</i>
<div>
<div id="e6ked69" class="img80"><a href="/book/14174431/" title="圖像擬態(tài)融合理論、模型和應(yīng)用" target="_blank"><img src="https://img.dushu.com/2025/05/30/01531790540369061.jpg_80.jpg" alt="圖像擬態(tài)融合理論、模型和應(yīng)用"></a></div>
<h3><a href="/book/14174431/" title="圖像擬態(tài)融合理論、模型和應(yīng)用" target="_blank">圖像擬態(tài)融合理論、模型和應(yīng)用</a></h3>
<p></p>
</div>
</div>
</li>
<li>
<p style="display: block;" class="fold">
<a href="/book/14174421/" title="數(shù)字媒體取證學(xué)原理與應(yīng)用實(shí)踐" target="_blank"><i>04</i>數(shù)字媒體取證學(xué)原理與應(yīng)用…</a></p>
<div id="11ar4rs" class="unfold" style="display: none;">
<i>04</i>
<div>
<div id="e4ay2xu" class="img80"><a href="/book/14174421/" title="數(shù)字媒體取證學(xué)原理與應(yīng)用實(shí)踐" target="_blank"><img src="https://img.dushu.com/2025/05/30/01345768540366494.jpg_80.jpg" alt="數(shù)字媒體取證學(xué)原理與應(yīng)用實(shí)踐"></a></div>
<h3><a href="/book/14174421/" title="數(shù)字媒體取證學(xué)原理與應(yīng)用實(shí)踐" target="_blank">數(shù)字媒體取證學(xué)原理與應(yīng)用實(shí)踐</a></h3>
<p></p>
</div>
</div>
</li>
<li>
<p style="display: block;" class="fold">
<a href="/book/14174369/" title="圖像數(shù)據(jù)先驗(yàn)的數(shù)學(xué)建模及其應(yīng)用" target="_blank"><i>05</i>圖像數(shù)據(jù)先驗(yàn)的數(shù)學(xué)建模及…</a></p>
<div id="i61fbwo" class="unfold" style="display: none;">
<i>05</i>
<div>
<div id="pby8hyy" class="img80"><a href="/book/14174369/" title="圖像數(shù)據(jù)先驗(yàn)的數(shù)學(xué)建模及其應(yīng)用" target="_blank"><img src="https://img.dushu.com/2025/05/30/01274888840362419.jpg_80.jpg" alt="圖像數(shù)據(jù)先驗(yàn)的數(shù)學(xué)建模及其應(yīng)用"></a></div>
<h3><a href="/book/14174369/" title="圖像數(shù)據(jù)先驗(yàn)的數(shù)學(xué)建模及其應(yīng)用" target="_blank">圖像數(shù)據(jù)先驗(yàn)的數(shù)學(xué)建模及其應(yīng)用…</a></h3>
<p></p>
</div>
</div>
</li>
<li>
<p style="display: block;" class="fold">
<a href="/book/14174389/" title="剪映短視頻剪輯150例（AI版+手機(jī)版+電腦版）" target="_blank"><i>06</i>剪映短視頻剪輯150例（AI…</a></p>
<div id="ve71lk6" class="unfold" style="display: none;">
<i>06</i>
<div>
<div id="t96k7lh" class="img80"><a href="/book/14174389/" title="剪映短視頻剪輯150例（AI版+手機(jī)版+電腦版）" target="_blank"><img src="https://img.dushu.com/2025/05/30/01285990040364392.jpg_80.jpg" alt="剪映短視頻剪輯150例（AI版+手機(jī)版+電腦版）"></a></div>
<h3><a href="/book/14174389/" title="剪映短視頻剪輯150例（AI版+手機(jī)版+電腦版）" target="_blank">剪映短視頻剪輯150例（AI版+手機(jī)…</a></h3>
<p></p>
</div>
</div>
</li>
<li>
<p style="display: block;" class="fold">
<a href="/book/14174444/" title="手機(jī)短視頻選題構(gòu)思、腳本創(chuàng)作、運(yùn)鏡拍攝、成片剪輯一本通" target="_blank"><i>07</i>手機(jī)短視頻選題構(gòu)思、腳本…</a></p>
<div id="tflfz9u" class="unfold" style="display: none;">
<i>07</i>
<div>
<div id="1yrhdhx" class="img80"><a href="/book/14174444/" title="手機(jī)短視頻選題構(gòu)思、腳本創(chuàng)作、運(yùn)鏡拍攝、成片剪輯一本通" target="_blank"><img src="https://img.dushu.com/2025/05/30/01552563740363812.jpg_80.jpg" alt="手機(jī)短視頻選題構(gòu)思、腳本創(chuàng)作、運(yùn)鏡拍攝、成片剪輯一本通"></a></div>
<h3><a href="/book/14174444/" title="手機(jī)短視頻選題構(gòu)思、腳本創(chuàng)作、運(yùn)鏡拍攝、成片剪輯一本通" target="_blank">手機(jī)短視頻選題構(gòu)思、腳本創(chuàng)作、…</a></h3>
<p></p>
</div>
</div>
</li>
<li>
<p style="display: block;" class="fold">
<a href="/book/14174400/" title="中文版After Effects 2022基礎(chǔ)培訓(xùn)教程" target="_blank"><i>08</i>中文版After Effects 202…</a></p>
<div id="zjfedfa" class="unfold" style="display: none;">
<i>08</i>
<div>
<div id="xh1son7" class="img80"><a href="/book/14174400/" title="中文版After Effects 2022基礎(chǔ)培訓(xùn)教程" target="_blank"><img src="https://img.dushu.com/2025/05/30/01313165940368395.jpg_80.jpg" alt="中文版After Effects 2022基礎(chǔ)培訓(xùn)教程"></a></div>
<h3><a href="/book/14174400/" title="中文版After Effects 2022基礎(chǔ)培訓(xùn)教程" target="_blank">中文版After Effects 2022基礎(chǔ)培…</a></h3>
<p></p>
</div>
</div>
</li>
<li>
<p style="display: block;" class="fold">
<a href="/book/14174411/" title="Photoshop 2022攝影后期修圖+商業(yè)合成實(shí)戰(zhàn)" target="_blank"><i>09</i>Photoshop 2022攝影后期修…</a></p>
<div id="xj7s1tg" class="unfold" style="display: none;">
<i>09</i>
<div>
<div id="kscazw7" class="img80"><a href="/book/14174411/" title="Photoshop 2022攝影后期修圖+商業(yè)合成實(shí)戰(zhàn)" target="_blank"><img src="https://img.dushu.com/2025/05/30/01334458640366571.jpg_80.jpg" alt="Photoshop 2022攝影后期修圖+商業(yè)合成實(shí)戰(zhàn)"></a></div>
<h3><a href="/book/14174411/" title="Photoshop 2022攝影后期修圖+商業(yè)合成實(shí)戰(zhàn)" target="_blank">Photoshop 2022攝影后期修圖+商…</a></h3>
<p></p>
</div>
</div>
</li>
<li id="kuumu1x" class="bt">
<p style="display: block;" class="fold">
<a href="/book/14174435/" title="漫畫設(shè)計(jì)模式" target="_blank"><i>10</i>漫畫設(shè)計(jì)模式</a></p>
<div id="d63bzta" class="unfold" style="display: none;">
<i>10</i>
<div>
<div id="nzt1zxy" class="img80"><a href="/book/14174435/" title="漫畫設(shè)計(jì)模式" target="_blank"><img src="https://img.dushu.com/2025/05/30/01534865540364845.jpg_80.jpg" alt="漫畫設(shè)計(jì)模式"></a></div>
<h3><a href="/book/14174435/" title="漫畫設(shè)計(jì)模式" target="_blank">漫畫設(shè)計(jì)模式</a></h3>
<p></p>
</div>
</div>
</li>
</ul>
</div>
<div id="7c6hea6" class="margin-big-top" id="sidebar">
<script async src="http://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- 300-right -->
<ins class="adsbygoogle"
style="display:inline-block;width:300px;height:250px"
data-ad-client="ca-pub-7029444221371985"
data-ad-slot="1399555633"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
<div class="p8yroo3" id="qrcode"></div>
<div id="e9hglk6" class="margin-big-top text-center text-gray">掃描二維碼</div>
</div>
</div>
</div>
<div id="sezqqcy" class="layout" id="footer">
<div id="lvuqmjt" class="container padding">
<div id="a3azol3" class="text-center">
<ul class="nav nav-inline">
<li><a href="/help/1587.html">關(guān)于讀書</a> </li>
<li><a href="/help/1588.html">免責(zé)聲明</a> </li>
<li><a href="/help/1589.html">讀書目錄</a> </li>
<li><a href="/help/1590.html">聯(lián)系我們</a> </li>
</ul>
</div>
<div id="aj6awtb" class="text-center height-big">Copyright ? 讀書網(wǎng) m.ranfinancial.com 2005-2020, All Rights Reserved.</div>
<div id="oav89dy" class="text-center height-big"><a >鄂ICP備15019699號</a> <img src="https://a.dushu.com/img/beian.png" style="vertical-align:middle;margin-left:10px;" /> 鄂公網(wǎng)安備 42010302001612號 <a ><img src="https://a.dushu.com/img/jubao.gif" style="vertical-align:middle;margin-left:10px;" /></a></div>
</div>
</div>
<script lang="javascript" type="text/javascript" src="https://a.dushu.com/js/qrcode.min.js"></script>
<script lang="javascript" type="text/javascript" src="https://a.dushu.com/js/portamento-min.js"></script>
<script lang="javascript" type="text/javascript" src="https://a.dushu.com/js/readmore.min.js"></script>
<script>
$('.txtsummary').readmore({ maxHeight: 140, moreLink: '<a href="#"><span id="whijl6o" class="icon-arrow-right"></span> 展開全部</a>', lessLink: '<a href="#"><span id="fpeiihf" class="icon-arrow-right"></span> 收起</a>', embedCSS: false });
$('#sidebar').portamento({ disableWorkaround: true, gap: 40 });
$("#qrcode").qrcode({ render: "canvas", width: 200, height: 200, text: location.href });
</script>
<script lang="javascript" type="text/javascript" src="https://a.dushu.com/js/autocomplete.min.js"></script>
<script lang="javascript" type="text/javascript" src="https://a.dushu.com/js/common.min.js?v=201706"></script>
<footer>
<div class="friendship-link">
<p>感谢您访问我们的网站，您可能还对以下资源感兴趣：</p>
<a href="http://m.ranfinancial.com/" title="日本人妻专区一区二区三区">日本人妻专区一区二区三区</a>
<div class="friend-links">
</div>
</div>
</footer>
<script>
(function(){
var bp = document.createElement('script');
var curProtocol = window.location.protocol.split(':')[0];
if (curProtocol === 'https') {
bp.src = 'https://zz.bdstatic.com/linksubmit/push.js';
}
else {
bp.src = 'http://push.zhanzhang.baidu.com/push.js';
}
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(bp, s);
})();
</script>
</body><div id="wypte" class="pl_css_ganrao" style="display: none;"><sup id="wypte"></sup><thead id="wypte"><s id="wypte"><kbd id="wypte"><th id="wypte"></th></kbd></s></thead><s id="wypte"></s><p id="wypte"></p><u id="wypte"></u><font id="wypte"></font><thead id="wypte"><dfn id="wypte"><kbd id="wypte"></kbd></dfn></thead><kbd id="wypte"><tr id="wypte"><p id="wypte"></p></tr></kbd><output id="wypte"><ol id="wypte"></ol></output><label id="wypte"><tt id="wypte"><tbody id="wypte"><menu id="wypte"></menu></tbody></tt></label><thead id="wypte"><strong id="wypte"></strong></thead><big id="wypte"></big><strong id="wypte"></strong><rp id="wypte"></rp><th id="wypte"></th><th id="wypte"></th><div id="wypte"><nobr id="wypte"></nobr></div><track id="wypte"></track><center id="wypte"></center><output id="wypte"></output><tbody id="wypte"></tbody><var id="wypte"><font id="wypte"></font></var><optgroup id="wypte"><center id="wypte"></center></optgroup><abbr id="wypte"></abbr><em id="wypte"></em><delect id="wypte"></delect><legend id="wypte"><ruby id="wypte"></ruby></legend><fieldset id="wypte"></fieldset><legend id="wypte"></legend><sub id="wypte"><legend id="wypte"><button id="wypte"></button></legend></sub><em id="wypte"></em><dd id="wypte"><cite id="wypte"><b id="wypte"></b></cite></dd><legend id="wypte"><th id="wypte"></th></legend><table id="wypte"></table><rp id="wypte"><xmp id="wypte"><fieldset id="wypte"><optgroup id="wypte"></optgroup></fieldset></xmp></rp><progress id="wypte"></progress><pre id="wypte"></pre><th id="wypte"></th><ins id="wypte"></ins><dl id="wypte"></dl><u id="wypte"></u><div id="wypte"><nobr id="wypte"><del id="wypte"><tfoot id="wypte"></tfoot></del></nobr></div><xmp id="wypte"></xmp><menuitem id="wypte"><strong id="wypte"></strong></menuitem><form id="wypte"></form><rp id="wypte"><xmp id="wypte"><fieldset id="wypte"><option id="wypte"></option></fieldset></xmp></rp><li id="wypte"><tbody id="wypte"></tbody></li><div id="wypte"></div><code id="wypte"><button id="wypte"><thead id="wypte"></thead></button></code><p id="wypte"><rp id="wypte"></rp></p></div>
</html>
