前端新手入门：HTML<body>详解及常用标记

需积分: 9 55 浏览量更新于2024-08-17 收藏 1.69MB PPT 举报

""> 此声明适用于HTML5，是最简洁且推荐的版本，告知浏览器使用标准模式解析页面。 HTML文档结构--HTML根元素 HTML文档的根元素是`<html>`，它包裹整个HTML文档，是所有其他元素的父元素。 HTML文档结构--HEAD元素 `<head>`元素包含非可视化的元数据，如`<title>`（定义网页标题）、`<meta>`（提供元信息，如字符编码）、`<link>`（引用外部资源，如CSS文件）和`<script>`（引入JavaScript代码或外部脚本文件）。 HTML文档结构--BODY元素 `<body>`元素包含网页的所有可见内容，如文本、图像、链接、表格、列表、段落、标题等。文本标记 HTML提供了一系列文本标记来控制文本样式和结构，例如： - `<h1>`至`<h6>`定义了六个级别的标题。 - `<p>`用于创建段落。 - `<span>`是一个通用的容器，用于组合其他HTML元素。 - `<em>`用于强调文本，通常表现为斜体。 - `<strong>`强调文本，通常表现为粗体。图像标记 `<img>`标记用于插入图像，其`src`属性指定图像源URL，`alt`属性提供替代文本。超链接标记 `<a>`元素创建超链接，`href`属性定义链接的目标地址，`target`属性可指定打开链接的方式，如新窗口或当前窗口。列表标记 - 有序列表`<ol>`和`<li>`用于创建带编号的列表。 - 无序列表`<ul>`和`<li>`用于创建项目符号列表。分节标记 HTML5新增了`<header>`和`<footer>`等分节元素，用于组织页面的头部和尾部内容。表格标记 `<table>`、`<tr>`（行）、`<td>`（单元格）和`<th>`（表头单元格）用于创建表格。浮动框架标记 `<iframe>`元素用于在页面中嵌入另一个HTML文档，常用于实现页面内的小窗口或广告。多媒体标记 HTML5引入了`<audio>`和`<video>`元素来嵌入音频和视频内容，支持不同格式的媒体源。交互标记 `<progress>`元素用于创建进度条，展示任务的完成进度，HTML5新增。此外，前端开发还包括CSS（层叠样式表）用于定义页面样式，JavaScript用于实现动态交互和功能，以及像jQuery这样的库和Bootstrap这样的框架简化开发工作，还有对开发者工具的熟练使用，如浏览器的控制台，帮助调试和优化代码。总结起来，HTML作为前端开发的基础，通过不同的标记和属性构建网页结构，并通过CSS和JavaScript增强视觉效果和交互性。学习HTML是踏入前端开发的第一步，理解和掌握这些基本元素是成为一名合格前端开发者的必要条件。

猫腻MX

粉丝: 22
资源: 2万+

前端新手入门：HTML<body>详解及常用标记

前端项目基础——Webpack-SCSS-JS快速搭建指南

HTML网络练习项目——codeup-web-exercises

深入理解前端开发技术——holbertonschool-web_front_end

深究AngularJS——ng-checked（回写：带真实案例代码）

HTML压缩包子文件——mulunch-main功能展示

HTML冲浪——surf-master包的探索之旅

前端入坑指南：CSS引用方式详解

狂神Java学习笔记————前端入门——html、css、JavaScript学习代码

5-body-parser.html

Web-前端html+css从入门到精通 205. vw单位进行动态fontsize设置.zip

最新资源