《HTML5与CSS3基础教程》学习笔记

文章由LinuxBoy分享于2019-04-01 10:04:23热评（410）

《HTML5与CSS3基础教程》学习笔记

HTML5与CSS3基础教程（第8版）中文高清版 PDF 下载

第一章

1、邮箱地址的URL地址包括：mailto:+邮箱地址

2、 ../表示向上走一级，开头直接使用/表示根目录

第三章

1、 <header>:

role = “banner”【适用于页面级的页眉】

2、 <nav>标记导航：

role = “navigation”不是必须的，提高可访问性

3、 <main>主要区域，一个页面只有一个,不能将main放在article、aside、footer、header、nav元素中。

role=”main”

4、 <article>创建文章,可以用于独立的内容项,可以嵌套,比如:一篇博客条目/一则用户提交的评论/一个交互的小部件/案例研究

5、 <section>定义区块，相似主题的一组内容，通常包含一个标题，相对于article组织、结构性更强

6、 < aside >指定附注栏,放在main之后

role=”complementary”

7、 <footer>代表嵌套它的最近的元素的页脚。只有当它最近的祖先是 body 时，它才是整个页面的页脚

role="contentinfo"【只有页面级页脚有】

第四章

1、各元素使用：

1) em 元素用于标识强调的文本

2) cite 元素用于标识对艺术作品、电影、图书等内容的引用

3) small 表示细则一类的旁注（side comment），“通常包括免责声明、注意事项、法律限制、版权信息等。有时我们还可以用它来表示署名，或者满足许可要求。

4) strong 元素表示内容的重要性

5) b用于如文档摘要里的关键词、评论中的产品名、基于文本的交互式软件中指示操作的文字、文章导语

6) i 元素表示一块不同于其他文字的文字，具有不同的语态或语气，或其他不同于常规之处，用于如分类名称、技术术语、外语里的惯用语、翻译的散文、西方文字中的船舶名称

2、创建图：

1) <figure>添加图像、视频、数据表格等内容

2) < figcaption >元素并不是必需的，但如果包含它，它就必须是 figure 元素内嵌的第一个或最后一个元素,并且只允许有一个figcaption。

3、引述文本

1) blockquote：浏览器默认对 blockquote 文本进行缩进，cite 属性的值则不会显示出来

2) 可以对 blockquote 和 q 使用可选的cite 属性，cite=url(引用的地址)

3) q 元素引用的内容不能跨越不同的段落，在这种情况下应使用 blockquote

4、指定时间

1) <time>

2) datetime="2014-07-16"等，atetime，文本内容就可以按你希望的任何形式表示日期、时间或时间段了

5、解释缩写词

1) <abbr>

2) 属性：title="缩写词的全称"

6、定义术语

1) <dfn>

7、创建上标和下标

1) 输入 <sub> 创建下标，或输入 <sup>创建上标

    /*
* 在所有浏览器中防止sub和sup影响line-height
* gist.github.com/413930
*/
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sup {
top: -0.5em;
}
sub {
bottom: -0.25em;
}

8、添加作者联系信息

1) <address>

9、标注编辑和不再准确的文本(既可以包围短语内容（HTML5 之前称“ 行内元素”）又可以包围块级内容的元素，)

1) < ins >标记新插入文本

2) < del >标记已删除文本

3) <s>标记不再准确或不再相关的文本

10、标记代码

1) <code>

2) < kbd >标记用户输入指示

3) < samp >元素用于指示程序或系统的示例输出

4) < var >元素表示变量或占位符的值

11、预格式化的文本

1) <pre>

2) 对 pre 的内容打开自动换行(IE<8不适用)

pre {
white-space: pre-wrap;
}

12、突出显示文本

1) <mark>即加上黄色背景

13、其他元素

1) 浏览器默认为 < u >元素添加下划线

2) <wbr>：可以在必要的时候进行换行

3) 旁注标记：ruby、 rp 和 rt 元素

4) bdi（于内容的方向未知的情况。不必包含 dir 属性，因为默认已设为自动判断）

5) bdo（必须包含 dir 属性并将属性值设为 ltr（由左至右）或 rtl（由右至左），指定你希望呈现的方向）

6) meter：表示分数的值或已知范围的测量结果

7) progress：它指示某项任务的完成进度。可以用它表示一个进度条

(1) max：任务的总工作量，其值必须大于 0

(2) value ：任务已完成的量

(3) form：添加 form 属性并将其值设为该 form 的 id

第六章

1、创建锚

在需要跳转到元素添加id="anchor-name"

2、创建链接到特定锚的链接

3、锚位于另一个文档，就使用 <ahref ="page.html#anchor-name"> 引用该区域。（在 URL 和 # 之间没有空格。）

4、锚位于另一台服务器上的页面，则需输入

<a href="http://www.site.com/directory/age.html#anchor-name">（没有空格）

更多详情见请继续阅读下一页的精彩内容：

【内容导航】
第1页：One Day	第2页：Two Day
第3页：Three Day

推荐文章：

《HTML5与CSS3基础教程》学习笔记