Web前端开发与应用第2章 HTML5基础.pptxVIP

第2章 HTML基础 第2章 HTML基础Web前端开发与应用教程（HTML5+CSS3+JavaScript）2.1 HTML语法基础2.2 文本控制标记2.3 图像标记2.4 超链接标记2.5 表格标记2.6 元标记2.7 link标记2.8 练习2.1 HTML语法基础Web前端开发与应用教程（HTML5+CSS3+JavaScript）2.1 HTML语法基础Web前端开发与应用教程（HTML5+CSS3+JavaScript）HTML语言是用来描述网页的一种语言，该语言是一种标记语言（即一套标记标签，用来描述网页），而不是编程员，它是制作网页的基础语言，主要用于描述超文本中内容的显示方式。2.1.1 HTML文档结构Web前端开发与应用教程（HTML5+CSS3+JavaScript）完整的HTML文件包括头部和主题两大部分，头部描述了文档的各种属性和信息，包括文档的标题、在 Web 中的位置以及和其他文档的关系等；主体包括文本、段落、列表、表格、绘制的图形以及各种嵌入对象，这些对象称为HTML元素。2.1.1 HTML文档结构Web前端开发与应用教程（HTML5+CSS3+JavaScript）基本的HTML文件结构如下：!DOCTYPE htmlhtml head /head body /body/html2.1.2 HTML标记Web前端开发与应用教程（HTML5+CSS3+JavaScript）HTML5不是一种编程语言，而是一种描述性的标记语言，用于描述超文本中的内容和结构。HTML最基本的语法是标记名/标记名。标记通常是成对使用的，一个开始标记和一个结束标记。2.1.3 标记的属性Web前端开发与应用教程（HTML5+CSS3+JavaScript）HTML 属性能够赋予标签含义和语境，提供了有关HTML元素的更多的信息。属性要在开始标签中指定，通常是以名称/值对的形式出现.2.2 文本控制标记Web前端开发与应用教程（HTML5+CSS3+JavaScript）2.2 文本控制标记设计web页面时要组织好页面的基本元素，同时再配合一些特效，构成一个绚丽多彩的页面。页面的组成对象包括文本、图像、表单、超链接以及多媒体等。Web前端开发与应用教程（HTML5+CSS3+JavaScript）2.2.1 标题段落标记Web前端开发与应用教程（HTML5+CSS3+JavaScript）标题段落在页面文字中起到格式化文本的作用，可以使得文本信息结构更清晰，读者可以一目了然。1．标题标记hihi标记用于定义段落标题的大小级数。其语法格式如下：hi标题/hi其中i表示标题级数，取值范围为1到6之间的正整数。2.2.1 标题段落标记Web前端开发与应用教程（HTML5+CSS3+JavaScript）2．段落标记pp标记用于划分段落，控制文本的位置。其语法格式如下：p……/pP是成对标记，用于定义内容从新的一行开始，并与上段之间有一个空行。开始标记p和结束标记/p之间写入段落内容。2.2.2 文本格式化标记Web前端开发与应用教程（HTML5+CSS3+JavaScript）1．换行标记brbr标记用于定义文本从新的一行显示。其语法格式如下：br它不产生一个空行，但连续多个的br标记可以产生多个空行的效果。br标记是非成对标记，所以规范的换行标记在使用的时候记为br。2.2.2 文本格式化标记Web前端开发与应用教程（HTML5+CSS3+JavaScript）2．水平线标记hrhr标记用于产生一条水平线，以分隔文档的不同部分。其语法格式如下：hrhr标记是非成对标记，所以规范的换行标记在使用的时候记为hr。2.2.2 文本格式化标记3．字形标记字形标记用于设置文字的风格。标记含义b.../b粗体标记i.../i斜体标记big.../big大字体标记small.../small小字体标记u.../u下划线标记sup ... /sup上标标记sub ... /sub下标标记strong... /strong斜体加T体标记mark... /mark定义带有记号的文本Web前端开发与应用教程（HTML5+CSS3+JavaScript）2.2.2 文本格式化标记Web前端开发与应用教程（HTML5+CSS3+JavaScript）4．div标记div标记可以用来排版大块HTML段落，设置多个段落的文本对齐方式等。其语法格式如下：div……/div2.2.2 文本格式化标记Web前端开发与应用教程（HTML5+CSS3+JavaScript）5．span标记span 标签被用来组合文档中的行内元素。使用方法和div标记基本相同。其语法格式如下：span……/span2.2.3 特