HTML基本文件结构和元素

简介: HTML基本文件结构和元素

HTML

HyperText Markup Language

超文本标记语言

文件结构

<!DOCTYPE html> // 起始行

<html>   // 开始标签  

<head>  // 文档描述信息
<title></title>
</head>

<body>  // 网页内容

</body>

</html>  // 结束标签

常用标签

1、标题标签

<h1>一级标题</h1>

<h2>二级标题</h2>
<h3>三级标题</h3>
<h4>四级标题</h4>
<h5>五级标题</h5>
<h6>六级标题</h6>

一级标题

二级标题

三级标题

四级标题

五级标题
六级标题

2、段落标签

<p>这是一段正文</p>

这是一段正文

3、文本样式标签

<b>加粗</b>
<i>斜体</i>
文本<sub>下标</sub>
<del>删除线</del>
<br />换行

加粗

斜体

文本下标

删除线


换行

4、列表标签

无序列表

<ul>
<li>苹果</li>
<li>橙子</li>
</ul>
  • 苹果
  • 橙子

有序列表

<ol>
<li>苹果</li>
<li>橙子</li>
</ol>
  1. 苹果
  2. 橙子

5、超链接标签

<a href="http://www.baidu.com";>百度</a>

百度

6、图片标签

<img src="./image.jpg" />


7、多媒体标签

视频标签

<video src="./video.mp4" controls></video>

8、音频标签

<audio src="./music.mp3" controls></audio>

9、div标签

<div>
<h3>标题</h3>
<p>内容</p>
</div>

标题

内容

10、布局标签

<header>头部信息</header>
<nav>导航栏</nav>
<aside>侧边栏</aside>
<main>内容区域</main>
<footer>底部信息</footer>
<article>文章详情</article>
<section>页面分区</section>

更多内容

HTML 教程- (HTML5 标准)

            </div>
目录
相关文章
|
24天前
|
数据采集 移动开发 前端开发
HTML代码的革命:语义化标签的魅力,让你的网页结构焕然一新!
【8月更文挑战第26天】本文探讨了Web前端开发中的语义化标签概念及其重要性。语义化标签通过使用具有明确含义的HTML标签来构建页面结构,提升了网页的可访问性及搜索引擎优化效果,并增强了代码的可读性和维护性。文章还讨论了实际开发中遇到的问题及未来发展趋势。
29 0
|
16天前
|
数据采集 存储 JavaScript
如何使用Cheerio与jsdom解析复杂的HTML结构进行数据提取
在现代网页开发中,复杂的HTML结构给爬虫技术带来挑战。传统的解析库难以应对,而Cheerio和jsdom在Node.js环境下提供了强大工具。本文探讨如何在复杂HTML结构中精确提取数据,结合代理IP、cookie、user-agent设置及多线程技术,提升数据采集的效率和准确性。通过具体示例代码,展示如何使用Cheerio和jsdom解析HTML,并进行数据归类和统计。这种方法适用于处理大量分类数据的爬虫任务,帮助开发者轻松实现高效的数据提取。
如何使用Cheerio与jsdom解析复杂的HTML结构进行数据提取
|
7天前
|
搜索推荐 前端开发 JavaScript
html的head元素seo优化详解
在HTML的`&lt;head&gt;`元素中进行SEO优化对于提升网页在搜索引擎中的排名至关重要。以下是几个关键策略:确保每个页面有唯一的标题标签(50-60字符),使用描述标签(150-160字符)概括内容并包含关键词,设置正确的字符集(如UTF-8),使用视口元标签优化移动端显示,添加规范链接避免重复内容,利用结构化数据(如JSON-LD)帮助搜索引擎理解内容,优化样式和脚本加载,以及设置网站图标增强品牌识别。这些措施能显著提高网页的搜索引擎可见性和用户点击率。
|
10天前
|
前端开发 UED SEO
html元素的使用禁忌
在使用HTML元素时,需遵循一些禁忌和最佳实践,以确保网页的可访问性、可维护性和性能。避免使用过时标签(如`&lt;font&gt;`、`&lt;center&gt;`),滥用`&lt;div&gt;`和`&lt;span&gt;`,及忽视必要属性(如`&lt;img&gt;`的`alt`属性)。应尽量集中管理样式于CSS文件,减少内联样式,避免过多嵌套,关注可访问性(如使用ARIA属性),并合理使用文档结构(如`&lt;head&gt;`、`&lt;body&gt;`和标题标签)。遵循这些指南,有助于提升用户体验和SEO效果。
|
23天前
HTML元素(HTML Elements)的属性
【8月更文挑战第27天】HTML元素(HTML Elements)的属性。
24 2
|
23天前
写一个HTML文件
【8月更文挑战第27天】写一个HTML文件。
23 1
|
26天前
|
移动开发 前端开发 JavaScript
|
26天前
|
存储 前端开发
为 HTML 元素指定 CSS 样式的方式
【8月更文挑战第24天】
46 0
|
26天前