phpstorm怎么用html

1. 新建 HTML 文件
   打开 PhpStorm 后，在左侧项目目录中选中你要放文件的文件夹，右键点击，选择「新建」→「HTML 文件」。如果右键菜单里没有，也可以点顶部菜单「文件」→「新建」→「HTML 文件」。输入文件名，比如 index，扩展名会自动补成 .html，然后回车。新建后编辑器会自动打开这个文件，并生成基本的 HTML 骨架，包括 、、、 等标签。如果你看到的是空白文件，可以手动输入这些基础结构，或者使用快捷键 Ctrl+J 调出代码模板，选择 html 模板快速生成。
2. 编写 HTML 代码
   在 HTML 文件里直接输入标签名，比如输入 div 后按 Tab 键，PhpStorm 会自动补全成
   并让光标停在中间。输入属性时，比如 class，按空格后会自动弹出属性列表，选择后按回车即可。PhpStorm 会实时检查标签是否闭合，如果标签不匹配，会在行号处显示红色波浪线，鼠标悬停可以看到提示。写代码时常用的快捷键有：Ctrl+Z 撤销，Ctrl+Y 重做，Ctrl+D 复制当前行，Ctrl+Shift+上下箭头移动当前行。这些快捷键和大多数编辑器一致，能提高写 HTML 的效率。
3. 在浏览器中预览 HTML
   写完 HTML 后，想查看效果，可以直接在 PhpStorm 里打开浏览器预览。方法一：在编辑器右上角找到浏览器图标（通常是一个小地球或显示器形状），点击后选择你已安装的浏览器，比如 Chrome、Firefox 或 Edge，页面就会在新标签页打开。方法二：使用快捷键，Windows 上默认是 Alt+F2，Mac 上是 Option+F2，按下后会弹出浏览器列表，选择即可。如果快捷键没反应，检查是否被其他软件占用，可以到「设置」→「键盘映射」里搜索「在浏览器中打开」来查看或修改。预览时 PhpStorm 会生成一个临时预览地址，代码改动后刷新浏览器即可看到更新。
4. 利用代码提示和自动补全
   PhpStorm 的 HTML 编辑体验很强，输入标签名时会有智能提示，比如输入 < 后，会列出所有可用的标签，选择后自动补全。输入属性时，也会提示常用属性，比如 class、id、style 等。对于 CSS 样式，如果在 标签或外部 CSS 文件中写样式，PhpStorm 会提示颜色选择器、字体属性等。如果你在 HTML 中引用了外部 CSS 或 JS 文件，按住 Ctrl 键并点击文件名，可以直接跳转到对应文件。这些提示默认是开启的，如果没有出现，检查「设置」→「编辑器」→「常规」→「代码补全」是否勾选了「自动显示」选项。
5. 格式化与检查 HTML
   写好的 HTML 如果缩进混乱，可以使用格式化功能让代码整齐。选中代码后按 Ctrl+Alt+L（Windows）或 Option+Cmd+L（Mac），PhpStorm 会自动调整缩进和换行。格式化前可以在「设置」→「编辑器」→「代码样式」→「HTML」里设置缩进大小、属性换行等规则。PhpStorm 还会实时检查 HTML 的错误，比如标签未闭合、属性值缺引号等，错误会以红色波浪线标出，警告以黄色标出。鼠标悬停可查看具体问题，按 Alt+Enter 可以快速修复。这些检查能帮你减少低级错误，让页面更规范。

软件页面：PhpStorm。