《HTML5与CSS3基础教程》学习笔记 ——One Day - 逆光

      2020-07-01 18:46      HTML5
第一章

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>创建上标

2)

/** 在所有浏览器中防止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、 创建链接到特定锚的链接

<a href="#anchor-name">

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

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

<a href="#anchor-name">(没有空格)