最小可打开html文件需4行：标题内容，后缀.html、utf-8编码、双击即开。
怎么写一个能打开的最小 HTML 文件
只要 4 行代码，浏览器双击就能打开 —— 不需要服务器、不依赖工具、不装任何东西。
必须写在第一行，少它可能触发 IE 兼容模式，样式乱套-
<title>页面标题</title>内容是最简结构，缺标签，文字会显示但 DOM 不完整，JS 操作document.body时可能报错 - 文件后缀必须是
.html（不是.txt），用记事本保存时选“所有文件”，编码选 UTF-8（否则中文变乱码）
文字和段落怎么加进网页里
不用学标签体系，先记住两个最常用：显示普通文本用 <p></p>，换行用 <br>，别用 \n 或空格凑格式 —— HTML 会把连续空白缩成一个空格。
-
<p>这是第一段</p> <p>这是第二段</p><div class="aritcle_card flexRow"> <div class="artcardd flexRow"> <a class="aritcle_card_img" href="/ai/2472" title="千问智学"><img src="https://img.php.cn/upload/ai_manual/001/246/273/176732397144504.png" alt="千问智学" onerror="this.onerror='';this.src='/static/lhimages/moren/morentu.png'" ></a> <div class="aritcle_card_info flexColumn"> <a href="/ai/2472" title="千问智学">千问智学</a> <p>阿里旗下AI教育应用（原夸克学习APP）</p> </div> <a href="/ai/2472" title="千问智学" class="aritcle_card_btn flexRow flexcenter"><b></b><span>下载</span> </a> </div> </div> <p><span>立即学习</span>“<a href="https://pan.quark.cn/s/cb6835dc7db1" style="text-decoration: underline !important; color: blue; font-weight: bolder;" rel="nofollow" target="_blank">前端免费学习笔记（深入）</a>”；</p>：语义清晰，搜索引擎能识别段落边界 -
<br>只适合极简场景（比如地址换行），滥用会导致响应式布局错乱 - 中文标点直接输入即可，但避免用全角空格或 Word 里的智能引号（“”‘’），它们不是 ASCII 字符，容易引发解析异常
为什么图片不显示？路径是最大坑
90% 的新手卡在这儿：图片路径写错，控制台报 404 Not Found，但页面上只留一个方框或替代文字。
- 图片和 HTML 文件在同一文件夹：用
<img src="photo.jpg" alt="怎么用html做一个网页_html零基础制作网页【指南】" >，不要加./或file:/// - 图片在子文件夹
images/里：写<img src="images/photo.jpg" alt="怎么用html做一个网页_html零基础制作网页【指南】" >，注意是斜杠/，不是反斜杠\ - 绝对路径（如
C:\my\page\photo.jpg）在本地打不开，浏览器禁用file://协议下的跨目录访问
CSS 样式怎么立刻生效
不想碰外部文件？直接写 <style></style> 块，放在 里，改完保存 → 刷新浏览器就行。
- 给所有段落加字体大小：
<style>p { font-size: 18px; }</style> - 颜色用英文名（
red）、十六进制（#333）或 rgb（rgb(51, 51, 51)）都行，别用中文“红色” - 别在
<style></style>里写 JavaScript，也别把 CSS 写进下面 —— 浏览器可能渲染到一半才读到样式，造成闪动
真实项目里，HTML 结构会越来越深，class 名越来越多，但起步那四行、一个 <p></p>、一张正确路径的图、一段内联 <style></style>，就是全部必要条件。其余都是为了应对具体问题才加上的，不是门槛。
