你有没有试过打开记事本,敲几行字,然后双击就直接在浏览器里看到效果?其实这就是做网页的第一步——写 HTML。它不难,也不需要装什么复杂软件,一台电脑、一个文本编辑器、一个浏览器就够了。
先搞清楚:HTML 是啥?
HTML 不是编程语言,更像是一种“说明书”,告诉浏览器:这儿是一段标题,那儿是一张图片,下面该换行了…… 它靠的是一个个带尖括号的标签,比如 <h1>、<p>、<img>,就像给内容贴上小纸条,浏览器照着读就行。
动手写第一个页面
打开电脑自带的“记事本”(Windows)或“文本编辑”(Mac,记得设为纯文本模式),把下面这段代码原样复制进去:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>我的第一个网页</title>
</head>
<body>
<h1>欢迎来到我的小站</h1>
<p>这是用记事本写的第一个 HTML 页面。</p>
<p>不用上传,不用服务器,保存后双击就能看!</p>
</body>
</html>
点【文件 → 另存为】,文件名输入 index.html(注意后缀必须是 .html),保存类型选“所有文件”,编码选 UTF-8。然后找到这个文件,双击——浏览器自动打开,你的网页就出来了。
几个常用标签,够你搭个简易主页
别急着背全,先记住这几个最常用的:
- <h1>~<h6>:标题,数字越小字越大,<h1>一般一页只用一次
- <p>:段落,写文字就包在里面
- <img src="图片地址" alt="描述文字">:插入图片,src 填图片路径(比如同文件夹下放了 photo.jpg,就写 "photo.jpg")
- <a href="https://xxx.com">点我跳转</a>:超链接,“href”后面填网址
试试改一改刚才的代码:把 <p>里的字换成你想说的,或者加一行 <img src="cat.jpg" alt="一只猫">,再把一张叫 cat.jpg 的照片和 index.html 放在同一个文件夹里,刷新页面看看效果。
小提醒:别踩这些坑
• 文件名别用中文或空格,比如“我的网页.html”容易出错,用 “my-page.html” 更稳;
• 所有标签尽量成对出现,<p>要配 </p>,漏了可能显示错乱;
• 保存时一定选“UTF-8 编码”,不然中文会变成乱码;
• 浏览器改了代码后,按 Ctrl+F5 强制刷新,确保看到最新版。
做完这个,你就已经能做出带标题、文字、图片、链接的静态页面了。下一步想让按钮变色、让菜单收起来?那是 CSS 和 JavaScript 的事儿——但那都是后话。现在,关掉这篇文章,打开记事本,敲下 <!DOCTYPE html>,你的网页生涯,就从这一行开始了。