初为程序员-优快云博客

本文链接：https://blog.youkuaiyun.com/qq_45554167/article/details/118641777

本文讲述了作者的编程入门经历，从理解程序的概念到区分不同类型的程序，尤其是通过后缀名来辨别。然后详细介绍了如何编写并运行第一个HTML网页，包括基本的HTML结构、标签和样式设置，以此激发读者对编程的兴趣。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

我正在参与优快云《新程序员》有奖征文。活动链接

文章目录

前言

好久好久以前我也有一个梦想，就是想开发一款自己的游戏，照着自己心目中的那个游戏构建一个自己的世界。想着我自己做的游戏是否也能像雪人兄弟，魂斗罗，洛克人那样带给我的小伙伴们快乐与惊喜。

从小学开始我就是同游戏作伴。从小学的插卡街头霸王游戏机，到买DVD送游戏碟子，再到诺基亚砖头机，然后到大头电脑，然后到智能手机，最后到现在的VR虚拟现实。我玩过的游戏大概有几千款了吧，多的已经记不清了。高考过后选专业，一脸懵逼，各种专业五花八门，借着自己的那个小小梦想选了一门软件工程专业。下面当然是讲一下我写第一个程序的过程啦~

提示：以下是本篇文章正文内容，下面案例可供参考

一、什么是程序

计算机程序或者软件程序（通常简称程序）是指一组指示计算机每一步动作的指令，通常用某种程序设计语言编写，运行于某种目标体系结构上。比如，做任何一件事情都有一个过程，从开始到结束。程序也是这样的。有一个入口，我们叫main方法。代码从main方法中开始跑，从上至下依次运行直到最后一行代码。

二、如何区分程序

1.通过后缀名区分程序

在我们现实生活中游戏有游戏的程序，歌曲有歌曲的程序，视频有视频的程序，网页有网页的程序，那么我们程序世界中怎么来区分呢。

通过后缀名来区分程序。比如：

1、打开电脑，我们右键桌面来新建一个文本文档

2、里边内容我们先不管，重命名文件修改后缀，所谓的后缀就是英文句号后边的英文。txt是文本文档，现在修改后缀为MP3.

3、修改后缀后图标就变成歌曲的logo了。我们再修改为MP4视频格式

4、现在变成视频的图标了。我们没有往里边写入任何东西，就只是修改了一下后缀名，整个程序就变成我们想要的形式了。

5、没有显示后缀名请按如下操作：windows（键盘上这个图标）+E 打开文件资源管理器，然后选中文件扩展名。最后右键重命名文件时就会出现后缀名了。

7、所以说我们电脑中的程序是按照文件后缀名来区分程序类分的。

2.第一个网页

既然我们知道怎么区分程序了，那么我们来写第一个网页吧（也就是以.html结尾的文件）

我们右键鼠标新建一个文本文档，然后右键这个新建的文本文档选择“编辑“，写入以下代码：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
	</body>
</html>

1、第一行的<!DOCTYPE html>是html5标准网页声明，原先的是一串很长的字符串，现在是这个简洁形式，支持html5标准的主流浏览器都认识这个声明。删掉了也没关系，因为这个文件的后缀名已经告诉系统这个是个什么文件了。不过这个主要是为了规范化。

2、<html>

...

</html>

这个代表网页中的所有内容，你写的所有网页代码必须是在这对标签内的。

3、<head>...</head>代表网页信息头部

4、<meta> 标签是HTML语言HEAD区的一个辅助性标签，它位于HTML文档头部的<HEAD>标记和<TITLE>标记之间，它提供用户不可见的信息。meta标签通常用来为搜索引擎robots定义页面主题，或者是定义用户浏览器上的cookie；它可以用于鉴别作者，设定页面格式，标注内容提要和关键字；等等。比如说：

5、<title></title>这个是网页标题标签，我们在这个标签中添加一句话 "我的第一个网页"

然后保存ctrl + s 保存记事本后双击 "网页.html" 这个文件,然后就可以看到我们写的标题内容啦

6、<body>...</body>代表网页的主体内容，我们编辑如下代码：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>我的第一个网页</title>
	</head>
	<body style="background-color:red">
	</body>
</html>

加上 style="background-color:red" 这段代码，意思是style就是样式的意思。我们将样式中background-color，背景颜色设置为red，也就是红色，接下来我们保存记事本，再双击我们写的文件，看到的就是这样啦：

7、现在我们再写入以下代码：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>我的第一个网页</title>
	</head>
	<body style="background-color:red">
		<h1>Hello World!</h1>
	</body>
</html>

加上<h1>Hello World!</h1>。写第一个程序当然是Hello World开始啦。然后打开我们写的html网页