内容简介
《HTML并不简单：Web前端开发精进秘籍》凝结了作者多年对HTML 钻研与实践的研究成果，旨在为前端开发人员，尤其是新人，提供有价值的参考，并值得反复阅读。本书深入细节以HTML 为索引对Web 前端开发知识进行系统、全面的讲解，书中介绍了大量前端开发人员不知道，但非常重要、好用的知识点。本书还配备专门的网站用于实例展示。
这是一本深度讲解HTML 的图书，通过阅读本书，读者会对HTML 有一个全新的认识。其实HTML 并不简单，精通HTML 会助你成为真正的Web 开发高手，实现“有他人不能有之效率，解他人不能解之难题”。
作者简介
张鑫旭，前端开发工程师，国内知名前端博客“鑫空间-鑫生活”博主，目前就职于阅文集团前端技术中心，担任前端技术专家，是目前公司专业级别最高的技术人员之一。2007年开始接触前端，17年来一直奋斗在前端一线，在HTML、CSS等与交互体验关系密切的领域花了大量的时间学习和研究，有比较多的心得体会。
目录
第1章正确认识HTML···········11.1HTML并不简单··········1
1.1.1门槛低不等于简单·····························1
1.1.2得心应手带来的双刃剑·······················2
1.1.3依赖路径并非最优解··························2
1.1.4社区环境与学习资源··························3
1.2精通HTML有什么用···3
第2章看似普通的元素的背后··6
2.1你不知道的<a>元素······6
2.1.1rel属性知多少····6
2.1.2你知道target的这个特性吗················14
2.1.3实用的download属性·······················15
2.1.4看看ping属性的妙用························17
2.1.5好好讲一下referrerpolicy属性············20
2.1.6href属性的背后也有细节知识·············23
2.1.7为何<base>元素无人问津···················26
2.1.8如何实现链接元素的嵌套··················27
2.2重新认识列表元素·····31
2.2.1无序列表元素除<ul>外还有其他的·······31
2.2.2<ol>元素额外支持的那些属性·············32
2.2.3定义列表的特点35
2.3正确认识<body>元素和<html>元素···············38
2.3.1难以名状的关联性···························38
2.3.2桌面端和移动端的差异·····················43
第3章那些自带交互特征的HTML元素··················44
3.1非常实用的<details>元素····························44
3.1.1黄金搭档<summary>元素···················44
3.1.2样式的自定义···46
3.1.3实际使用案例示意····························48
3.1.4全新的name属性与手风琴效果··········51
3.2深入了解<dialog>元素和popover属性···········52
3.2.1<dialog>元素的基本特性····················52
3.2.2<dialog>元素的不可替代性·················53
3.2.3原生弹层与popover属性···················63
3.3控件伴侣<label>元素··67
3.3.1<label>元素的价值所在·····················67
3.3.2必学的单选按钮、复选框技术············71
3.4什么时候使用<fieldset>元素和<legend>元素····73
3.4.1表单分组与<fieldset>元素的使用·········73
3.4.2特殊且唯一的边框样式······················75
3.4.3<fieldset>元素的独家功能··················77
3.5务必使用<progress>元素实现进度条··············77
3.5.1<progress>元素的基本特性·················78
3.5.2<progress>元素的样式自定义··············79
3.6务必使用<meter>元素显示密码强度··············80
3.6.1<meter>元素的基本特性····················81
3.6.2<meter>元素的美化技巧····················83
第4章经常出现在页面首尾的HTML元素···············87
4.1几万字都讲不完的<meta>元素·····················87
4.1.1SEO最重要的元素之一·····················88
4.1.2网页尺寸设置···91
4.1.3referrer设置与防盗图片显示···············93
4.1.4网站风格和主题色的设置···················94
4.2知识同样非常密集的<link>元素···················97
4.2.1favicon小图标的设置与显示···············97
4.2.2网站换肤的最佳实现·······················100
4.2.3资源的预加载··102
4.3相对简单的<style>元素·····························110
4.3.1废弃的type属性·····························111
4.3.2局部样式特性··111
4.4<script>元素的水很深113
4.4.1async属性和defer属性的区别···········113
4.4.2不太一般的type属性·······················114
4.4.3灵活运用ImportMaps······················118
4.4.4nonce、integrity属性与脚本安全········121
4.4.5有必要使用<noscript>元素吗·············125
第5章语义化与使用场景·····126
5.1页面整体布局结构的塑造··························127
5.1.1<header>元素和<footer>元素的使用变化·····························127
5.1.2<aside>元素和<main>元素的结构关系·129
5.1.3<nav>元素的使用场景······················130
5.1.4万能的<section>元素························131
5.2文档结构信息的标签使用··························132
5.2.1比<section>元素更高一级的<article>元素·····························132
5.2.2<h1>～<h6>元素及<hgroup>元素的使用规则························133
5.2.3引用元素<blockquote>、<q>和<cite>的区别·························136
5.2.4<i>元素和<b>元素为何起死回生？<em>元素和<strong>元素都表示强调吗····138
5.2.5为何<small>元素被保留但<big>元素被废弃了······················141
5.2.6<del>元素和<s>元素、<ins>元素的关系······························141
5.2.7养成使用<time>元素表示日期的习惯···143
5.2.8搜索高亮必用元素<mark>·················144
5.3那些你不了解却有用的内联元素·················144
5.3.1超过一半的<span>元素可以换成<data>元素·························145
5.3.2上标<sup>元素和下标<sub>元素与公式排版························146
5.3.3<dfn>元素和<abbr>元素的使用场景····147
5.3.4<code>元素、<kbd>元素、<var>元素和<samp>元素各自的语义·····149
5.4与内容无关的语义化元素··························151
5.4.1<br>元素和<wbr>元素的区别·············152
5.4.2可以玩出花的<hr>元素·····················153
第6章富媒体资源元素········156
6.1深入图像元素···········156
6.1.1了解<svg>元素156
6.1.2<canvas>元素的基本特性··················165
6.1.3专为图像显示设计的<figure>元素和<figcaption>元素·············170
6.1.4srcset、sizes等属性与响应式图片开发·171
6.1.5实用却不常用的<picture>元素············176
6.1.6聊聊loading="lazy"（懒加载）···········179
6.1.7crossOrigin与跨域处理·····················181
6.1.8使用elementtiming属性知晓图片的加载时长························183
6.2快速上手音视频开发·185
6.2.1<audio>元素的常用应用指南·············186
6.2.2<video>元素的常用应用指南·············188
6.2.3聊聊音视频的自动播放·····················194
6.2.4解密倍速播放的实现························195
6.2.5视频的画中画技术···························196
6.2.6<track>元素与WebVTT字幕的显示····198
第7章庞杂的表单控件元素··204
7.1先从元素说起···········206
7.1.1<form>元素的行为与特征·················206
7.1.2并不简单的<button>按钮··················217
7.1.3好好了解一下<select>下拉框·············219
7.1.4<textarea>元素的精华与糟粕··············226
7.1.5单选按钮、复选框行为与应用···········230
7.1.6file类型输入框的隐藏知识················233
7.1.7时间日期选择框速览·······················238
7.1.8范围选择控件的高级应用·················241
7.1.9<datalist>元素与列表内容的选择········243
7.2表单体系中的HTML属性·························247
7.2.1表单中的name属性与行为···············247
7.2.2深入讲讲autocomplete属性···············250
7.2.3表单验证属性及方法·······················256
第8章深入表格·················263
8.1<table>元素的基本特性·····························265
8.1.1深入固定分配尺寸与弹性尺寸规则·····265
8.1.2间隙的分离与合并规则····················273
8.2专为表格而生的标题元素<caption>··············278
8.2.1罕见的脱离渲染特性·······················278
8.2.2最早的渲染位置可定义元素··············280
8.3<td>元素和<th>元素的特性与应用···············281
8.3.1匿名表格元素创建规则····················281
8.3.2单元格合并的实现··························283
8.4了解<col>元素和<colgroup>元素的作用········285
第9章无障碍访问··············289
9.1键盘的无障碍访问····289
9.1.1务必了解的tabindex属性··················290
9.1.2深入了解快捷键设置属性accesskey·····291
9.2屏幕阅读无障碍访问·294
9.2.1尽可能使用原生元素和属性··············294
9.2.2系统介绍ARIA规范属性··················296
9.3iOS、Android虚拟键盘设置·······················316
9.3.1enterkeyhint属性与确认按钮文案的自定义设置·····················316
9.3.2使用inputmode属性设置虚拟键盘的输入模式······················319
9.3.3virtualkeyboardpolicy属性的作用········320
9.3.4autocapitalize全局属性与首字母大写的设置·························321
第10章WebComponents开发····························323
10.1自定义元素和未知元素····························323
10.2详细了解<template>元素··························326
10.3深入介绍<slot>元素·327
10.3.1了解ShadowDOM·························328
10.3.2<slot>元素的匹配细节····················330
10.3.3<slot>元素中的事件·······················332
10.3.4特殊的display计算值与样式设置······334
10.4了解part属性和exportparts属性················335
10.4.1更常用的part属性·························335
10.4.2嵌套组件解决方案exportparts属性····336
10.5后起之秀is属性·····338
第11章结构化微数据语言简介·····························340
11.1词汇表··················343
11.2itemid、itemscope、itemtype等属性简介······345
11.2.1和id属性完全不同的itemid属性······345
11.2.2快速了解itemscope属性·················347
11.2.3快速了解itemtype属性···················347
11.2.4快速了解itemprop属性···················347
11.2.5有别于href的itemhref属性·············348
第12章MathML简介··········350
12.1按类别分类的MathML表现元素················350
12.2语义注释相关的MathML元素···················361
第13章SMIL简介··············363
13.1SVG语言简介········364
13.2SVGSMIL动画详解366
13.2.1SVGSMIL动画元素介绍················366
13.2.2SVGSMIL动画属性详解················370
······
[ HTML并不简单：Web前端开发精进秘籍下载地址 ]【免费下载】
最后修改：2025 年 01 月 31 日
© 允许规范转载