介绍一下html的基本骨架(结构)
<!DOCTYPE html> //document type的缩写,是一个文档类型的声明。表明用html5的规范
<html lang="en">:这是HTML文档的根元素。lang="en"属性表示文档的主要语言是英语,有没有问题不大
<head>这个元素包含了所有的元数据元素,比如<meta>标签,它提供了有关文档的信息(比如字符编码和视口设置),但不会显示在页面上。<title>标签定义了文档的标题,它显示在浏览器的标题栏或标签页上。
<meta charset="UTF-8">这个元素设置了文档的字符编码为UTF-8,这是现代网页开发中的常用编码
。
<meta name="viewport" content="width=device-width, initial-scale=1.0">
width=device-width,设置视口的宽度等于设备的宽度。这意味着网页的宽度会根据设备的屏幕宽度进行调整,从而使得网页在不同尺寸的设备上都能有较好的显示效果。
initial-scale=1.0设置页面的初始缩放比例为1.0,即不进行任何缩放,页面按照实际尺寸显示。
<title>Document</title>定义了文档的标题,这里设置为"Document",但通常您会将其更改为与您的网页内容相关的描述性标题。
</head>
<body>这个元素包含了所有要显示在页面上的内容,比如文本、图片、链接、列表、表格等。
</body>
</html>
//二级标签是一个标签里面套用标签
更直接的一种写法:
<html>
<head>
<title>简单的html文件 </title>
</head>
<body text="blue">用于设置整个文档的文本颜色为蓝色。
<h2 align="center">html的学习</h2>
<hr>这是一个水平分割线,用于在页面上创建一条水平线
<p>笔记</p>
</body>
</html>
html的标签分单独出现的标签和成对出现的标签两种。
大多数标签成对出现,是首尾标签和尾标签组成的。首标签的格式为<元素名称>,尾标签的格式为</元素名称>
其完整的语法结构如下:
<元素名称>要控制的元素</元素名称>
为了让html更丰富,就会有属性的出现,所以完整的语法结构:
<元素名称 属性1=“”> 元素资料 </元素名称>
介绍完了骨架,那我们就要往里面填充
HTML的头部标签:<head> </head>
文件头部分用来规定该文件的标题(出现在web浏览器的标题栏中)和文件的一些属性
头部标记
<base> 当前文档的url全称{基底网址}
<title>网页的标题内容
<meta>设定有关文档本身的元信息
<style>设定css层叠样式内容
<link>外部的文件的链接
<script>设定脚本内容
(1)<title> </title> 语法解释 :标记内部是标题的内容
举个例子
<html>
<head>
<title>简单的html文件 </title>
</head>
<body text="blue">
<h2 align="center">html的学习</h2>
<hr>
<p>笔记</p>
</body>
</html>
(2)元信息meta
<meta>是单标签
假设帮助搜索引擎对网页的分类和
设置页面关键字:语法:<meta name="keyname" content="具体的关键字">
设置页面描述:语法: <meta name="descripition" content="描述语言">
设置页面编辑工具:语法:<meta name="generator" content="软件名称">
设置页面作者名称:语法:<meta name="author" content="作者">
设置网页文字和语言:语法:
<meta http-equiv="Content-Type" content="text/html;charst="字符集类型”>
<meta http-equiv=“Content-Language” content=“语言”>
例如:
<meta http-equiv="Content-Type" content="text/html;charst="utf-8”>
设置页面的跳转:语法:<meta http-equiv=" refresh" content="跳转时间;url="跳转地址”>
语法解释:refresh表示页面的刷新,content设置时间和网址,时间单位是秒
一些代码展示:、
<html>
<head>
<title>设置网页的定时跳转</title>
<meta http-equiv="cache-control" content="no-cache">
</head>
<body>
你好,在5秒后将自动跳转到百度首页。
</body>
</html>