《HTML语言》教学课件

语言教学课件HTML欢迎来到HTML语言教学课件！我们将深入了解HTML的基础知识，并学习如何创建网页语言简介HTML定义用途HTML（超文本标记语言）是一种标记语言，用于创建网页它HTML用于构建网页结构，并提供文本、图像、音频、视频等内由标记组成，这些标记告诉浏览器如何显示网页内容容的历史发展HTML11990年，蒂姆·伯纳斯-李发明了HTML，旨在为互联网共享信息21993年，发布了第一个HTML版本，并迅速成为互联网的标准语言32000年，HTML

4.01发布，成为最广泛使用的版本之一42014年，HTML5发布，引入了新的功能和特性标签概览HTML文本标签结构标签用于显示文本内容，例如标题、用于定义网页的结构，例如头部段落、列表等、主体、标题等媒体标签表单标签用于嵌入图像、音频、视频等多用于创建网页表单，用于收集用媒体内容户输入的信息基本标签HTML文档声明根元素头部元素主体元素HTML!DOCTYPE htmlhtml/html head/head body/body标题标签H1H2一级标题，用于页面主要标题二级标题，用于次要标题H3H4~H6三级标题，用于更小的标题用于更小的标题段落标签P用于创建一个段落，浏览器会自动在段落前后添加空格列表标签UL无序列表，使用圆点标记列表项OL有序列表，使用数字标记列表项LI列表项，用于定义每个列表项的内容链接标签A1链接标签，用于创建一个指向其他页面的链接href2属性指定链接的目标URLtarget3属性指定链接打开方式，例如_blank新窗口图像标签IMG1图像标签，用于在网页中嵌入图片src2属性指定图片的URLalt3属性提供图片的替代文本，供搜索引擎和屏幕阅读器使用表格标签12Table TR表格标签，用于创建表格表格行标签，用于创建表格行34TD TH表格单元格标签，用于创建表格单元表格表头单元格标签，用于创建表格格表头表单标签Form InputSelect Button表单标签，用于创建表单输入标签，用于创建各种输入下拉列表标签，用于创建下拉按钮标签，用于创建按钮，例框，例如文本框、密码框等菜单如提交按钮、重置按钮等页面结构标签属性HTML定义语法属性用于提供有关标签的附加信息，例如id、class、style等属性使用键值对的形式表示，例如img src=image.jpg alt=图片描述全局属性id class用于为元素提供唯一的标识符，用于CSS样式和JavaScript用于为元素定义类名，用于CSS样式和JavaScript代码代码style title用于为元素设置内联样式用于提供元素的标题，用于提示信息和搜索引擎优化常用属性href用于指定链接的URLsrc用于指定图片、音频、视频等资源的URLalt用于提供图片的替代文本value用于指定输入框的默认值页面基本结构文档声明1声明HTML版本根元素HTML2包含整个网页的内容头部元素3包含页面元数据，例如标题、样式表、脚本等主体元素4包含网页的可见内容文档声明HTMLDOCTYPE声明文档类型，告诉浏览器使用哪个HTML版本头部元素HTMLHead1包含网页元数据，例如标题、样式表、脚本等Title2指定网页的标题，显示在浏览器标签栏中Meta3提供网页的元信息，例如关键字、描述等Link4链接外部CSS样式表主体元素HTML12Body Content包含网页的可见内容，例如文本、图放置网页内容，例如标题、段落、列像、视频等表等34Structure Layout使用标签组织内容，例如div、span使用CSS样式布局网页内容等简介CSS定义用途CSS（层叠样式表）是一种样式表语言，用于控制网页的外观和布CSS用于定义网页中元素的样式，例如颜色、字体、大小、位置等局语法CSS选择器属性值用于选择要设置样式的元素用于指定要设置的样式属性用于指定属性的值选择器CSS标签选择器类选择器选择所有指定类型的元素选择具有特定类名的元素选择器通用选择器ID选择具有特定ID的元素选择所有元素基本选择器标签选择器例如，p{color:red;}类选择器例如，.myClass{font-size:16px;}选择器ID例如，#myId{background-color:blue;}组合选择器后代选择器1选择指定元素的后代元素子选择器2选择指定元素的直接子元素相邻兄弟选择器3选择与指定元素相邻的兄弟元素与集成HTML CSS内联样式1直接在标签中设置样式内部样式表2在HTML文档的`标签样式12定义影响为特定标签设置样式，例如p{影响所有具有该标签的元素color:red;}类样式定义影响为具有特定类名的元素设置样式，例如.myClass{font-size:影响所有具有该类名的元素16px;}样式ID定义影响为具有特定ID的元素设置样式，例如#myId{background-只影响具有该ID的元素color:blue;}总结回顾通过本课件的学习，我们掌握了HTML和CSS的基本知识，并能够创建简单的网页。