想让一个HTML文件通过网址被访问，核心并不在HTML代码本身，而在服务器和域名之间的映射关系。很多人把页面保存为 index.html 后直接拖进浏览器，地址栏显示的是 C:\Users\你的目录\index.html 这样的本地磁盘路径，它只能证明文件能打开，不能说明网站已经上线。真正意义上的网址访问需要满足两个条件：域名能解析到某台服务器，服务器能把该域名的请求交给存放HTML的目录。
一、先分清域名、路径和站点根目录
访问一个网址时，浏览器会先把域名交给DNS系统解析成服务器IP地址。比如在浏览器输入 http://www.ipipp.com/news/index.html，其中 www.ipipp.com 是域名，/news/index.html 是路径。服务器收到请求后，并不会把整个网址当作文件名去磁盘里查找，而是先根据域名确定站点根目录，再在这个根目录下按路径拼接文件位置。
假设站点根目录配置为 /var/www/html，那么路径 /news/index.html 实际对应的文件就是 /var/www/html/news/index.html。这里要注意，根目录前面的斜杠代表站点根目录，而不是服务器文件系统的根目录。换句话说，网址里的 / 和磁盘上的 / 不是同一个层级。理解这一点，才能正确处理资源加载与跳转问题。
URL结构可以拆成：协议、域名、端口、路径、查询参数几个部分。端口默认是80或443，因此 http://www.ipipp.com 等价于 http://www.ipipp.com:80。路径为空时，服务器会尝试返回默认文档，通常就是 index.html。所以很多网站首页地址并不显示文件名，但这不意味着没有对应的HTML文件。
二、本地测试：用hosts文件模拟域名访问
在购买域名或配置公网服务器之前，可以先在本机模拟。操作思路是把一个测试域名指向127.0.0.1，然后在本机启动HTTP服务。这样浏览器访问测试域名时，请求会回到自己的电脑。
Windows下需要以管理员身份编辑 C:\Windows\System32\drivers\etc\hosts 文件，Linux或macOS编辑 /etc/hosts。在文件末尾加入一行记录，将测试域名指向本机回环地址。
# Windows 路径：C:\Windows\System32\drivers\etc\hosts # Linux/macOS 路径：/etc/hosts 127.0.0.1 www.ipipp.com ::1 www.ipipp.com
保存后可以启动一个简单的HTTP服务器。进入存放HTML文件的目录，执行Python内置模块即可在8000端口提供访问服务。
cd C:\Users\你的目录\my-site python -m http.server 8000
浏览器打开 http://www.ipipp.com:8000，如果能看到 index.html 内容，说明域名到本机的解析已经生效。之所以必须写端口8000，是因为本地测试没有使用默认的80端口。如果是公网服务器并使用80端口，地址栏就不用额外加端口号。
这一步能验证路径与目录是否对应，但它不能代替真实DNS配置。正式上线时仍然需要在域名服务商处添加A记录，把域名指向服务器的公网IP。A记录生效后，服务器才能收到对应域名的请求。
三、Nginx配置域名和站点目录
生产环境通常使用Nginx、Apache或Caddy来监听80和443端口。以Nginx为例，一个站点至少需要指定监听端口、域名、根目录和默认文档。server_name用于匹配请求头中的Host字段，root指定站点根目录，index指定默认文档。
server {
listen 80;
server_name www.ipipp.com ipipp.com;
root /var/www/html;
index index.html;
location / {
try_files $uri $uri/ =404;
}
}
这段配置表示：凡是Host为 www.ipipp.com 或 ipipp.com 的HTTP请求，都会使用 /var/www/html 作为站点根目录。访问 /news/index.html 时，Nginx会尝试返回 /var/www/html/news/index.html。如果路径对应的是目录，Nginx会继续寻找该目录下的 index.html。try_files 则按顺序检查文件和目录，若都不存在，返回404。
如果一台服务器上有多个网站，可以写多个server块，每个块使用不同的server_name和root。这样不同域名访问同一IP时，Nginx会根据域名把请求分发到不同目录。若某个server_name没有匹配成功，Nginx会使用默认server处理，所以配置多站点时要留意默认站点指向哪个目录。
配置完成后需要检查语法并重载服务。使用 nginx -t 可以验证配置是否正确，nginx -s reload 可以让新配置生效。部署后如果首页能打开但静态资源全部404，通常是HTML里资源路径写成了相对路径，或者域名对应的root目录不对。
四、HTML内部路径的三种写法和base标签
站点上线后，HTML里的图片、样式、脚本和链接必须使用正确的路径。路径写法一般分三类：绝对URL、根相对路径和普通相对路径。绝对URL以协议开头，例如 https://www.ipipp.com/css/style.css，优点是无论当前页面在哪一层目录都能准确加载，缺点是换域名后需要批量替换。根相对路径以斜杠开头，例如 /css/style.css，它从站点根目录开始解析，不受当前页面层级影响。普通相对路径如 ../images/logo.png 或 css/style.css，基于当前页面所在目录计算，页面层级变化时容易出错。
如果页面大多使用相对路径，可以在 <head> 中放置 <base href="/">，统一设置相对路径的基准地址。这样页面里写的 css/style.css 会从站点根目录开始查找，而不是从当前页面目录开始。需要注意的是，<base> 只影响相对URL，对以斜杠或协议开头的URL不会产生影响。
<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <title>网站首页</title> <base href="/"> <link rel="stylesheet" href="css/style.css"> </head> <body> <img src="images/logo.png" alt="网站Logo"> <a href="about/">关于我们</a> </body> </html>
上面的 <base href="/"> 让 href="css/style.css" 实际指向 /css/style.css，src="images/logo.png" 实际指向 /images/logo.png。如果去掉这一行，页面位于 /news/ 目录时，这些资源会错误地解析为 /news/css/style.css 和 /news/images/logo.png。路径末尾是否加斜杠也有区别：/about 通常会被视为文件，/about/ 则更明确表示目录，服务器会继续查找目录默认文档。
另外，不建议在站点根目录层级较深时大量使用类似 ../../ 这样的相对路径，维护起来非常痛苦。对于公共资源，推荐使用根相对路径或独立静态资源域名，既清晰又便于迁移。
五、404、403与端口问题分别怎么排查
页面打不开时，先看状态码。404表示服务器找不到对应文件，通常是路径写错、root配置不正确或文件没有上传到目标目录。403表示服务器没有权限读取文件，常见原因是文件权限过小或目录缺少索引文件。对于Nginx，还要确保运行Nginx的用户对站点目录有读权限。
端口问题也容易被忽略。80端口可以省略，443用于HTTPS，也可以省略端口但协议必须是https。如果服务运行在8080、8000等非默认端口，地址栏必须写成 http://域名:端口/路径。很多本地服务迁移到服务器后忘记改端口，导致域名能解析但网页打不开。
还有一个常见误区是把首页文件命名为 index.html 后，以为所有子目录都会自动出现首页。实际上只有Web服务器明确配置了 index 指令，目录请求才会尝试返回默认文档。如果某个子目录没有 index.html，而服务器又禁止目录列表，通常会返回403。此时补一个 index.html 或在配置中添加 index 规则即可。
如果域名变更，建议通过301重定向把旧域名跳转到新域名。Nginx中可以这样配置：
server {
listen 80;
server_name old.ipipp.com;
return 301 http://www.ipipp.com$request_uri;
}
这样用户访问旧地址时，浏览器和搜索引擎都会逐步更新到新域名。$request_uri 保留原始路径和查询参数，避免跳转后丢失用户本来要访问的页面。
总之，给HTML设置网址不是修改HTML文件，而是把域名、服务器、目录路径和页面内部资源路径串成一条完整链路。任何一环配置不一致，都会表现为打不开或资源加载失败。按照本地hosts测试、服务器域名绑定、HTML路径规范这个顺序排查，可以快速定位问题。