wordpress站群代,一个网站绑定多个域名 卖域名,做外贸好还是跨境电商好,wordpress上传ftp密码HTML5 元素语法知识点及案例代码
一、HTML5 元素概述
HTML5 元素是构成网页的基本单位#xff0c;每个元素都有特定的语义和功能。HTML5 元素由开始标签、内容和结束标签组成#xff0c;例如#xff1a;
p这是一个段落。/pp 是开始标签这是一个段…HTML5 元素语法知识点及案例代码
一、HTML5 元素概述
HTML5 元素是构成网页的基本单位每个元素都有特定的语义和功能。HTML5 元素由开始标签、内容和结束标签组成例如
p这是一个段落。/pp 是开始标签这是一个段落。 是内容/p 是结束标签
二、HTML5 元素分类
HTML5 元素可以根据其功能和语义进行分类主要分为以下几类 根元素: html: 定义 HTML 文档的根元素。 文档元数据: head: 定义文档的头部信息例如标题、样式表、脚本等。title: 定义文档的标题。meta: 定义文档的元数据例如字符编码、作者、描述等。link: 定义文档与外部资源的关系例如样式表、图标等。style: 定义文档的内部样式表。script: 定义文档的脚本代码。 内容分区: body: 定义文档的主体内容。header: 定义文档或节的页眉。nav: 定义导航链接。main: 定义文档的主要内容。section: 定义文档中的节。article: 定义独立的文章内容。aside: 定义页面内容之外的内容如侧边栏。footer: 定义文档或节的页脚。 文本内容: h1 - h6: 定义标题。p: 定义段落。br: 定义换行。hr: 定义水平线。pre: 定义预格式化文本。blockquote: 定义块引用。ol: 定义有序列表。ul: 定义无序列表。li: 定义列表项。dl: 定义定义列表。dt: 定义定义术语。dd: 定义定义描述。 内联语义: a: 定义超链接。strong: 定义强调文本。em: 定义强调文本。mark: 定义标记文本。small: 定义小号文本。sub: 定义下标文本。sup: 定义上标文本。code: 定义代码片段。time: 定义日期/时间。 图像和多媒体: img: 定义图像。audio: 定义音频内容。video: 定义视频内容。source: 定义多媒体资源的来源。track: 定义多媒体资源的字幕。 表格: table: 定义表格。caption: 定义表格标题。thead: 定义表格头部。tbody: 定义表格主体。tfoot: 定义表格尾部。tr: 定义表格行。th: 定义表格头单元格。td: 定义表格数据单元格。 表单: form: 定义表单。input: 定义输入控件。label: 定义输入控件的标签。button: 定义按钮。select: 定义下拉列表。option: 定义下拉列表选项。textarea: 定义多行文本输入框。
三、HTML5 元素案例代码
!DOCTYPE html
htmlheadtitleHTML5 元素案例/titlemeta charsetUTF-8meta namedescription contentHTML5 元素案例代码link relstylesheet hrefstyle.cssstylebody {font-family: Arial, sans-serif;}h1 {color: red;}/stylescriptfunction sayHello() {alert(Hello, World!);}/script/headbodyheaderh1HTML5 元素案例/h1navullia href#首页/a/lilia href#关于/a/lilia href#联系/a/li/ul/nav/headermainsectionh2文本内容/h2p这是一个段落。/pp这是另一个段落。/pblockquotep这是一个块引用。/p/blockquote/sectionsectionh2图像和多媒体/h2img srcimage.jpg alt图片audio controlssource srcaudio.mp3 typeaudio/mpeg您的浏览器不支持 audio 标签。/audiovideo width320 height240 controlssource srcvideo.mp4 typevideo/mp4您的浏览器不支持 video 标签。/video/sectionsectionh2表格/h2tablecaption表格标题/captiontheadtrth姓名/thth年龄/th/tr/theadtbodytrtd张三/tdtd20/td/trtrtd李四/tdtd25/td/tr/tbody/table/sectionsectionh2表单/h2form action/submit methodpostlabel forname姓名/labelinput typetext idname namename requiredlabel foremail邮箱/labelinput typeemail idemail nameemail requiredlabel forage年龄/labelinput typenumber idage nameage min1 max120label forbirthday生日/labelinput typedate idbirthday namebirthdaylabel forcolor喜欢的颜色/labelinput typecolor idcolor namecolorinput typesubmit value提交/form/section/mainfooterp版权所有 copy; 2023/p/footerbutton onclicksayHello()点击我/button/body
/html四、代码解析 文档结构: !DOCTYPE html 声明文档类型为 HTML5。html 元素是文档的根元素。head 元素包含文档的元数据例如标题、样式表、脚本等。body 元素包含文档的主体内容。 文档元数据: title 元素定义文档的标题。meta 元素定义文档的字符编码和描述。link 元素链接外部样式表。style 元素定义内部样式表。script 元素定义脚本代码。 内容分区: header 元素定义文档的页眉。nav 元素定义导航链接。main 元素定义文档的主要内容。section 元素定义文档中的节。footer 元素定义文档的页脚。 文本内容: h1 - h6 元素定义标题。p 元素定义段落。blockquote 元素定义块引用。 图像和多媒体: img 元素定义图像。audio 元素定义音频内容。video 元素定义视频内容。 表格: table 元素定义表格。caption 元素定义表格标题。thead 元素定义表格头部。tbody 元素定义表格主体。tr 元素定义表格行。th 元素定义表格头单元格。td 元素定义表格数据单元格。 表单: form 元素定义表单。input 元素定义输入控件。label 元素定义输入控件的标签。button 元素定义按钮。 脚本: script 元素定义脚本代码。onclick 事件属性定义按钮点击事件。
五、总结
HTML5 元素是构成网页的基本单位每个元素都有特定的语义和功能。通过学习 HTML5 元素的语法和用法你可以创建结构清晰、语义明确的网页。
