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盘从其他已下载同学处拷贝过来 --- ### 配置—打开Settings Windows:File -> Settings; macOS:稍微有点不一样 .center[ <img width=550 src='open_settings.png'> ] --- ### 配置—Install Package 'atom-html-preview' 安装atom-html-preview包 .center[ <img width=600 src='install_atom_html_preview.png'> ] --- ### 使用—使用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>