HTML-01我的第一个网页

注释

设么是注释

注释:代码不会执行:用来给开发人员看的

格式:

元素

其他的叫法:标签 标记

html 复制代码
<a href="">我的博客</a>

标签:Element 元素

元素的构成:开始标签 + 结束标签 +标签内容 +属性

属性:属性名+属性值

属性分类:

  • 局部属性:某些元素特有属性 例子 href 只用于a
  • 全局属性:所有元素通用 例子title

单标签 空元素

html 复制代码
<meta charset="utf-8">
<img src="" alt="" />

有些元素是没有闭合标签 ---也叫空元素

元素嵌套

元素之间不能彼此嵌套

html 复制代码
<div><p></div></p>

父元素 子元素 兄弟元素 祖先元素 后代元素

标准文档结构介绍

html 复制代码
<!DOCTYPE html>

声明文档 告诉浏览器当前使用的是html5

不写的话会出现怪异模式

html 复制代码
<html></html>

根元素:可以不写 浏览器会自行识别--建议还是写上

虽然 HTML 并不要求作者指定 元素的开始和结束标记,但作者必须这样做,因为这将允许他们为网页指定 lang。根据 RFC 5646: 识别语言的标签(也称为 BCP 47),在 元素上提供一个带有有效语言标记的 lang 属性,将有助于屏幕阅读技术确定要宣告的适当语言。标识语言标签应描述页面大部分内容所使用的语言。如果没有它,屏幕阅读器通常会默认使用操作系统设置的语言,这可能会导致发音错误。

在 元素中包含一个有效的 lang 声明,还可以确保页面的 中包含的重要元数据(如页面的
)也会被正确地宣告。

html 复制代码
<head></head>

机器可读的文档相关信息(元数据):对文件的描述信息

html 复制代码
<head>
<meta charset="utf-8">
<meta name="author" content="yzm"/>
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
</head>
html 复制代码
<meta> 元素表示那些不能由其他 HTML 元相关(meta-related)元素表示的元数据信息。
<meta> 元素定义的元数据的类型包括以下几种:

如果设置了 name 属性,<meta> 元素提供的是文档级别(document-level)的元数据,应用于整个页面。
如果设置了 http-equiv 属性,<meta> 元素则是编译指令,提供的信息与类似命名的 HTTP 头部相同。
如果设置了 charset 属性,<meta> 元素是一个字符集声明,告诉文档使用哪种字符编码。
如果设置了 itemprop 属性,<meta> 元素提供用户定义的元数据。
html 复制代码
<title>第一个网页</title>

元素 定义文档的标题,显示在浏览器的标题栏或标签页上。 一个 元素只能包含一个 <title> 元素 页面标题和 SEO 页面标题的内容可能对搜索引擎优化(SEO)具有重要意义。通常,较长的描述性标题要比简短或一般性标题更好。标题的内容是搜索引擎算法用来确定在搜索结果中列出页面顺序的组件之一。同样,标题是初始的"挂钩",你可以通过它吸引浏览浏览结果页面的读者的注意力。

撰写好标题的一些准则和技巧:

避免使用一两个单词的标题。对于词汇表或参考样式的页面,请使用描述性短语或术语 - 定义对。

搜索引擎通常显示页面标题的前 55 至 60 个字符。超出此范围的文本可能会丢失,因此请尽量不要使标题更长。如果你必须使用较长的标题,请确保重要的部分出现在前面,并且标题中可能要删除的部分中没有关键内容。

不要使用"关键字集合"。如果标题只是单词列表,则算法通常会降低页面在搜索结果中的位置。

尝试确保你的标题在你自己的网站中尽可能唯一。标题重复(或几乎重复)可能会导致搜索结果不准确。

html 复制代码
<body>
	<!-- 所有的网页内容都写在这里 -->
	<a href="">我的博客</a>
</body>

HTML 元素表示 HTML 文档的内容。文档中只能有一个 元素。

相关推荐
excel12 分钟前
双 Token 与前端使用 Crypto 公私钥鉴权换 Token,哪种方案更好?
前端·后端
外收内放13 分钟前
Python基础语法练习题(73)
java·前端·python
风骏时光牛马1 小时前
面向复杂场景的大模型应用落地与能力优化实践
前端
小小善后师1 小时前
我做了个病历归档小程序,被 AI 识别的"最后一公里"狠狠上了一课
前端
H_Lisa1 小时前
我用 Express 写了个 MCP,Claude 直接调用我的 API 了
前端
IT_陈寒1 小时前
React的useEffect依赖数组把我坑惨了
前端·人工智能·后端
兰亭妙微UI设计公司2 小时前
兰亭妙微ui设计公司分享:B端组件命名如何支持团队协作
前端·javascript·vue.js
云和数据.ChenGuang3 小时前
光哥说Python 异常深度解析:从异常模型到工程化实践
java·前端·人工智能·python·langchain
小大宇3 小时前
Vue知识点-ElementPlus-03提示框+询问+通知
前端·javascript·vue.js
步行cgn4 小时前
Axios 请求成功但页面不显示:两个前端错误的分析与修正
前端