43.3 使用Notepad++制作简单网页方法 下面为大家讲解使用Notepad++做网页编辑的方法。
43.3.1 第1步:下载安装软件 软件的安装比较简单,我们这里就不说了,或者使用绿色版,直接解压出来就可以使用。安装后,软件的效果如下(安装时,我这里选择了中文,安装后可以设置中英文切换的):
43.3.2 第2步:设置中英文切换 点击Notepad++菜单栏中的设置,选择“首选项”: 在弹出的窗口中就可以设置语言: 大家根据自己的需要选择中文或者英文即可,我们教程里面使用中文。
43.3.3 第3步:安装插件(在线安装方式) (注意,有时候在线安装容易安装不上,因为连接google等无法登陆的外网,需要“梯子”,这个时候看本章43.3.4小节的离线安装方式即可) 像Notepad++这种编辑器,功能强大的地方就在于可以安装各种比较好用的插件,所以务必要掌握如何安装插件,我们这里就安装一个HTML编辑需要用的格式化插件Tidy2,使用这个插件可以将大家凌乱的代码按照HTML标准格式进行格式化。 点击插件->Plugin Manager->Show Plugin Manager。 弹出窗口后,等待插件更新完毕。 更新完毕后,效果如下: 这里我们选择插件Tidy2。 提示要更新PluginManager插件,下面就是更新此插件的过程(估计是因为Notepad++自带的PluginManager插件版本低了)。 更新完毕后,弹出如下窗口,点击“是”按钮即可。 跟前面一样,继续选择Tidy2,点击“Install”安装按钮。 点击“Install”按钮后会有一个如下的下载和安装进度。 之后弹出如下窗口: 点击“是(Y)”按钮,可以看到插件Tidy2已经安装上了。 至此,在线方式安装就完成了,如果要安装任何其它的控件,方法都是一样的。
43.3.4 第4步:安装插件(离线安装方式) 与第3步的功能相同,都是安装插件,只是这里采用离线的安装方式。 下面是存放了Tidy2.dll的效果: 如果Notepad++在打开状态,将其关闭,重新打开后,就可以看到安装的插件了:
43.3.5 第5步:编辑HTML内容点击新建按钮,效果如下: 新建后设置语言为HTML。 设置了语言格式后,Notepad会支持代码提示和HTML标签高亮。这个功能非常重要,会加速代码编辑。 编写一个简单的HTML代码。 要编写的内容如下: - <html>
- <body>
- <h1>我的第一个标题</h1>
- <p>我的第一个段落。</p>
- </body>
- </html>
复制代码在Notepad++上编辑后,效果如下: 可以看到,代码结构并不是层次分明的。这时,前面安装的Tidy2就派上用场了。点击插件->Tidy2->Tidy(config1)。 格式后的效果如下(格式化后新添加的代码不用管,也可以删掉),代码已经变的错落有致了,非常方便阅读。 最后一步,点击保存,这一步千万别忘记了。 点击保存后弹出如下窗口: 此时桌面就会多了一个HTML文件(我这里是Google浏览器,所以显示是这样的效果)。 大家使用浏览器打开这个文件就可以看到效果了: 至此,大家就完成了一个完整的HTML网页编辑和显示过程。
|