class: center, middle, inverse, title-slide # Atom Editor 安装及配置 ## HTML网页编辑神器 ### 吴燕丰 ### 江西财大，金融学院 ### 2022-04-06 --- ### 下载 下载地址： [https://atom.io/](https://atom.io/) 或者 从我的服务器上下载：[AtomSetup-x64.exe](AtomSetup-x64.exe) 或者 用U盘从其他已下载同学处拷贝过来 --- ### 配置&mdash;打开Settings Windows：File -> Settings； macOS：稍微有点不一样 .center[ <img width=550 src='open_settings.png'> ] --- ### 配置&mdash;Install Package 'atom-html-preview' 安装atom-html-preview包 .center[ <img width=600 src='install_atom_html_preview.png'> ] --- ### 使用&mdash;使用HTML预览 创建一个HTML文件，并保存为‘xxx.html’，这样Atom编辑器可识别其为HTML文件，因为文件扩展名用了'.html'。 .center[ <img width=550 src='preview.png'> ] [代码自动补全提示](../autocomplete_keyboard_shortcut/autocomplete_keyboard_shortcut.html#5) --- ### 预览效果 .center[ <img width=900 src='preview_effect.png'> ] 此时编辑时，预览会同步更新。Enjoy your time! --- ### 使用Atom编辑器制作网页 <video width=800 height=450 controls> <source src="../../video/chapter05-Atom制作网页.mp4"> </video>