HTML--基本结构构成

基本结构:

文档声明: <!DOCTYPE html>

htm标签对 :<html> </html>

head标签对: <head> </head>

body标签对:<body> </body>

如下结构:

html 复制代码
<html>
<head> 
    <title>这是一个标题</title>
</head>
<body>
    <p>这是一个段落</p>
</body>
</html>

<head> </head> head标签对中一般只有6个标签能放进去

title标签: 定义网页标题,就是显示在网页标签栏的名字

meta标签:定义网页特殊信息,如关键字、页面描述等等。

style标签:定义元素的CSS样式

link标签:用于引入外部样式文件(CSS文件)

script标签:用于定义页面的JavaScript代码

base标签:没啥实际意义

复制代码
>meta标签含以下两种属性,name和http-equiv

name属性:
html 复制代码
	<!--这是一个注解-->
	<meta name="keywords" content="网页关键字,可以设定多个"/>
	<meta name="description" content="网页描述"/>
	<meta name="author" content="网页作者"/>
	<meta name="copyright" content="版权信息">
复制代码
>http-equiv属性:定义网页编码,定义网页自动刷新跳转
html 复制代码
	<!--定义网页使用的编码-->
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
	<!-- HTML5 可以用更简单的写法-->
	<meta charset="utf-8"/>
	
	<!--定义网页自动刷新跳转,6s后自动跳转到url指定的网页-->
	<meta http-equiv="refresh" content="6;url=http://www.xxx.com"/>
复制代码
>style标签
html 复制代码
	<style type="text/css">
		/*这里写css样式*/
	</style>
复制代码
>script标签:
html 复制代码
	<script>
		/*这里写JavaScript代码*/
	</script>
复制代码
>link标签:
html 复制代码
	<link type="text/css" rel="stylesheet" herf="css/index.css">

body标签:页面的身体,主要显示的一些数据,文字等等都在这个里面

html 复制代码
<!DOCTYPE html>
<html>
<head> 
    <title>这是一个标题</title>
    <meta charset="utf-8"/>
</head>
<body>
    <h1>一级标签h1</h1>
    <h2>二级标签h2</h2>
    <h3>三级标签h3</h3>
    <h4>四级标签h4</h4>
    <h5>五级标签h5</h5>
    <!--这是一个注释-->
    <h6>六级标签h6</h6>
    <p>这是一个段落</p>
    <em>这是斜体字体</em>
</body>
</html>

效果图:

相关推荐
excel8 小时前
研究 Vue 3 源码的收获
前端·vue.js
可乐鸡翅yeah_9 小时前
业务中 M3U8 水印相关坑,硬水印和动态水印区别
前端·网络·数据库·ffmpeg·m3u8在线
lerhxx10 小时前
AI 应用如何高效优雅地恢复中断?—— "连接解耦 + 状态持久化"
前端·javascript
计算机魔术师10 小时前
METR 演示 AI 智能体如何篡改 Inspect 评估记录以掩盖不当行为
前端
前端snow10 小时前
ai agent --- 异步处理之 Rabbit MQ
前端
念何架构之路10 小时前
zap扩展生态与总结
java·前端·数据库
独孤九剑打醒他11 小时前
【原创开源】【概念设计】源 - 栅 - 漏 - 栅 - 源 横向双栅 MOS,低压交流多值逻辑芯片探索
前端·其他·架构·开源·硬件工程
mantou13211 小时前
我给 AI Agent 做了个「油猴」:让 Claude Code / Codex 直接用你已登录的浏览器
前端·javascript·后端
默_笙11 小时前
🍕 一个主编、三个工种、两本手册:搭一支 AI 调研队
前端·javascript
纸片人11 小时前
Blender 建模 + Three.js 展示:和 AI 一起做一个光储充超充站数字孪生大屏
前端