目录
[HTML、CSS 简介] HTML
HTML，即HTML，是一种用于创建网页的标记语言。 它使用一系列标签来描述网页中文本、图像、超链接等元素的结构和显示。 HTML标签通常称为标记，一般用尖括号括起来，例如，，
等等。这些标签告诉浏览器如何显示页面的内容和布局。
HTML 是一项非常基础的技术，广泛应用于网页开发和设计中。 随着HTML的发展和完善，现代Web开发逐渐转向使用更先进的技术，例如CSS和HTML来控制页面的样式和交互。 但HTML仍然是Web开发的基础，理解HTML对于成为一名优秀的Web开发人员非常重要。
CSS
CSS（层叠样式表）是一种描述网页样式的语言。 CSS可以控制网页的布局、字体、颜色、背景等方面的风格。 通过CSS，可以将网页的内容与样式分离，使得网页的设计更加灵活，易于维护和修改。
CSS 基于“样式规则”工作。 样式规则由两个主要部分组成：选择器和声明块。 选择器指定要设置样式的 HTML 元素，而声明块包含一个或多个样式规则，每个规则包含一个属性和一个值。
CSS 可以通过多种方式应用于 HTML 文档，包括内部样式表、外部样式表和内联样式。
是一种脚本语言，用于为 Web 应用程序添加交互性和活力。 它是一种轻量级的编程语言，可以通过在网页中嵌入()标签来实现交互效果。
可用于：
动态更改 HTML 和 CSS 内容，使网页更具动态性和交互性
处理网页上的用户输入，例如表单验证
与Web服务器通信，向服务器发送数据或从服务器获取数据
创建运动图形和动画效果
【No.01新浪新闻标题排版】
样式如下：
该页面的标题可以分为以下几个部分：
h1-h7标题标签和标题浏览器标题标签
<h1>我是标题h1h1>
<h2>我是标题h2h2>
<h3>我是标题h3h3>
<h4>我是标题h4h4>
<h5>我是标题h5h5>
<h6>我是标题h6h6>
<title>演示title>
填写标准HTML文件->
DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>演示title>
head>
<body>
<h1>我是标题h1h1>
<h2>我是标题h2h2>
<h3>我是标题h3h3>
<h4>我是标题h4h4>
<h5>我是标题h5h5>
<h6>我是标题h6h6>
body>
html>
以上代码，除了<body>body>包围的和<title>title>包围的内容，
其他全不是自己书写的，都是由VSCode新建html文件输入 ! (英文状态) 自动补全
示范效果：
在浏览器中，可以用标题标签来修改顶部小标签中的文本，标题标签写在head标签中。
浏览器首页显示的内容在body标签中：
img 图像标签
<img src="https://i2.sinaimg.cn/dy/deco/2012/0613/yocc20120613img01/news_logo.png" width="114514px" height="1919810px">
填写标准HTML文件->
DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>演示title>
head>
<body>
<img src="https://i2.sinaimg.cn/dy/deco/2012/0613/yocc20120613img01/news_logo.png">
body>
html>
以上代码，除了<body>body>包围的和<title>title>包围的内容，
其他全不是自己书写的，都是由VSCode新建html文件输入 ! (英文状态) 自动补全
示范效果：
hr 水平线标签
<hr>
我是文字
<hr>
填写标准HTML文件->
DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>演示title>
head>
<body>
<hr>
我是文字
<hr>
body>
html>
以上代码，除了<body>body>包围的和<title>title>包围的内容，
其他全不是自己书写的，都是由VSCode新建html文件输入 ! (英文状态) 自动补全
示范效果：
回顾和分析
<h1>我是标题h1h1>
<h2>我是标题h2h2>
<h3>我是标题h3h3>
<h4>我是标题h4h4>
<h5>我是标题h5h5>
<h6>我是标题h6h6>
<title>演示title>
<img src="https://i2.sinaimg.cn/dy/deco/2012/0613/yocc20120613img01/news_logo.png" width="114514px" height="1919810px">
<hr>
我是文字
<hr>
那么，让我们分析一下我们学到了什么
1、对于左上角的图片，显然可以使用img标签，直接在img标签后面添加以下文字即可。 src图片路径可以直接选择绝对网络路径。 这里不使用后面的宽度。 ，不添加。
2、中间的标题可以用h1标签包围。
三、分割线，使用hr标签。
4、文字无实际意义，直接填写相应内容即可。
五、分割线，使用hr标签。
根据这个分析，你就可以写代码了！
DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>中国国防部长：请各国管好自家的军舰飞机title>
head>
<body>
<img src="https://i2.sinaimg.cn/dy/deco/2012/0613/yocc20120613img01/news_logo.png"> 新浪政务 > 正文
<h1>中国国防部长：请各国管好自家的军舰飞机h1>
<hr>
2023年06月04日 15:06 央视网作者：央视新闻
<hr>
body>
html>
最终页面效果如图！
本网站的标题部分到这里就结束了，下一篇将对标题样式进行美化。 如果您觉得这篇文章对您的学习有一点帮助，不妨在走之前点个赞和书签，继续更新您的个人学习日志！ ！
经过：
日期：2023年6月5日
