一步一个脚印的教你使用eclispe开发web项目

.打开eclipse后，新建一个web项目：

new -- dynamic web project

点击Finish，新建项目完成！

调整字体大小：

window -- preferences

选择basic，

web.xml

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/javaee" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd" id="WebApp_ID" version="3.0">
 <display-name>QQ</display-name>
 <welcome-file-list>
 <welcome-file>index.html</welcome-file>
 <welcome-file>index.htm</welcome-file>
 <welcome-file>index.jsp</welcome-file>
 <welcome-file>default.html</welcome-file>
 <welcome-file>default.htm</welcome-file>
 <welcome-file>default.jsp</welcome-file>
 </welcome-file-list>
</web-app>

welcome-file-list表示项目的欢迎页。

2. 引入Tomcat服务器

在eclipse下方，有一个servers视图

如果没有，就去window选项卡中，点击 show view

如果还是没有servers，就点击other：

添加一个服务器：

找到Tomcat7.0版本：

如果是第一次添加Tomcat，则需要去引入一下：

选择你想要发布的web项目：

3. 在WebContent目录新建一个欢迎页 index.jsp

右键 WebContent , new , JSP File

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
 pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
</head>
<body>
</body>
</html>

可以看到JSP页面默认的编码格式为ISO-8859-1，这种编码不支持中文！所以，我们需要把它改为UTF-8

<%@ page language="java" contentType="text/html; charset=UTF-8"
 pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<body>
</body>
</html>

发现有一个报错信息：

因为还缺少web开发所需要的包，右键项目，Build Path -- Configure Build Path

现在，我们给index.jsp写上一句话：

<%@ page language="java" contentType="text/html; charset=UTF-8"
 pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<body>
 
 <h1>Hello web！</h1>
 
</body>
</html>

4. 启动项目

运行成功！

然后，查看该Tomcat的端口号：

发现端口号为8080。

4. 访问欢迎页面

打开浏览器，在地址栏输入：http://localhost:8080/QQ/

么是HTML / HTM文件？他们相差一个字母有什么区别吗，如何查看或编辑源代码以及如何转换成其他格式，例如DOCX，PDF，JPG 等，针对这些问题编程狮W3Cschool整理以下资料希望能对你有所帮助：

什么是HTM或HTML文件？

HTM / HTML 文件是超文本标记语言（Hyper Text Markup Language）文件，是 Internet 上的标准网页文件类型。

由于 HTM 文件是纯文本文件，因此它们仅包含文本（例如您现在正在阅读的内容）以及对其他外部文件的文本引用（例如本文中的配图）。

HTM 和 HTML 文件还可以引用其他文件，例如视频，CSS 或 JS 文件。

HTM与HTML的区别

HTM 与 HTML 没有本质意义的区别，只是为了满足 DOS 仅能识别 8+3 的文件名而已，因为一些老的系统 (win32) 不能识别四位文件名，所以某些网页服务器要求 index.html 最后一个 l 不能省略。MSIE 能自动识别和打开这些文件，但编写网页地址的时候必须是完全对应的，也就是说 index.htm 和 index.html 是两个不同的文件，对应着不同的地址。值得一提的是 UNIX 系统中对大小写敏感，不吻合的话就可能报没有文件或者找不到文件。

如何打开HTM或HTML文件？

任何 Web 浏览器，例如 Edge，Firefox，Chrome，Opera，IE，360 安全浏览器等，都可以打开并正确显示 HTM 和 HTML 文件。换句话说，在浏览器中打开这些文件并“解码（decode）” HTM 或 HTML 文件使其能正确显示。

现在有很多简化编辑和创建 HTM / HTML 文件的工具。一些著名的免费 HTML 编辑器包括 Eclipse ，Komodo Edit 和 Bluefish 。另一个流行的具有许多高级功能的 HTM / HTML 编辑器是 Adobe Dreamweaver ，不过它是收费的。

虽然 Windows 系统自带的记事本等简单的文本编辑器的功能不如专用的 HTM 编辑器那么丰富，但是对 HTM 或 HTML 文件进行简单编辑修改还是可以的。不过，W3Cschool还是建议大家使用专用的编辑器，如 WebStorm、VS Code 等，它具更多专业功能。

这是一个非常简单的 HTML 页面以文本形式显示的示例：

源码：

<!doctype html>
<html>

    
<head>
<meta charset="utf-8">
<title>什么是HTM或HTML文件？ - 编程狮(w3cschool.cn)</title>
</head>


<body>
    <h1>什么是HTM或HTML文件？</h1>
    <p>HTM / HTML 文件是超文本标记语言（Hyper Text Markup Language）文件，是 Internet 上的标准网页文件类型。</p>
    <p>由于 HTM 文件是纯文本文件，因此它们仅包含文本（例如您现在正在阅读的内容）以及对其他外部文件的文本*引用*（例如本文中的配图）。</p>
    <p>HTM 和 HTML 文件还可以引用其他文件，例如视频，CSS 或 JS 文件。</p>   
</body>

    
</html>

当 Web 浏览器呈现信息时，HTML 文件的源代码被“转换”为真实的网页（尽管源代码已很精简了）。

如何转换HTML和HTM文件？

HTM 文件以特定的语法（规则）构成，以使其中的代码和文本在浏览器中打开时能够正确显示。因此，将 HTM / HTML 文件转换为另一种格式可能会丢失页面上的所有功能。

如果你想要做的是将一个 HTM / HTML 文件转换为方便离线查看的文件，这时图片或 PDF 格式会方便很多。

在 Chrome 中，鼠标右键单击网页，出现的选项菜单中进入 “打印(P)...”(快捷键：CTRL + P) ，在打印选项中选择另存为 PDF，以将窗口中的页面转换为 PDF 文件。Chrome 浏览器的扩展功能也称为“全屏截屏”，可将 Chrome 浏览器中所有打开的 HTM / HTML 文件转换为 PNG 文件。

其他浏览器具有类似的功能，例如 Firefox 的 “另存为 PDF” 加载项。

您也可以使用专门用于 HTM / HTML 进行图像文件转换的网站，例如iWeb2Shot 或Web-capture 。

一个免费的文件转换器可以用来转换并保存 HTM / HTML 文件到您的计算机。如 FileZigZag 是一个免费的文档转换器网站，可将 HTM 转换为RTF，EPS，CSV，PDF 和许多其他格式。

HTM / HTML 文件不能转换为文本文件格式以外的任何格式。例如，HTML 文件永远不能转换为 MP3 音频文件。

文件打不开？

HTML / HTM 文件应该很容易打开，因为它们只是任何 Web 浏览器都可以查看的文本文件。如果您的文件没有从上面建议的任何程序打开，则很有可能正在打开的这个文件并非超文本标记语言文件。

某些文件格式使用的文件扩展名与 HTML / HTM 非常相似，但实际上并非相同。一个主要的示例是用于压缩 HTML 电子书文件的 HTMLZ 文件扩展名。有 HTML 文件在内的 HTMLZ 文件，但整个包的格式为 ZIP，不会在 Web 浏览器或文本编辑器打开。

在此示例中，您需要特定的 HTMLZ 文件查看器，例如Caliber 。或者，由于此文件格式实际上是存档，因此您可以使用 7-Zip 之类的文件解压缩器将其打开，然后您可以使用网络浏览器或上述任何其他 HTML 查看器/编辑器打开任何单独的 HTML 文件。

TMLANGUAGE 是另一个可能与 HTML / HTM 文件混淆的文件扩展名。这些实际上是TextMate 用于 macOS 的 TextMate 语言语法文件。

以上就是编程狮W3Cschool为你整理的关于《什么是HTM或HTML文件？如何打开、编辑和转换HTM和HTML文件？》的全部内容，现希望可以帮到你~

这个瞬息万变的时代，创新是推动进步的源动力。而Eclipse IDE 2023，正是您实现创新梦想的强大工具。作为全球知名的Java集成开发环境（IDE），Eclipse IDE不仅拥有C/C++、JavaScript/TypeScript、PHP等众多优秀IDE，更在默认包中轻松实现多语言支持和功能组合。Eclipse Marketplace为您提供了无限的定制和扩展可能，让您的创意无处不在。

无论身处何地，Eclipse IDE都能陪伴在您身边。通过浏览器，您可以使用托管工作区进行云端开发；或者安装桌面打包，体验专为Java、JavaScript、CSS和HTML打造的现代化开发环境。Eclipse IDE 2023，为您的快速创新提供强大支持。

【平台升级，创新加速】——Eclipse IDE 2023

剪贴板支持HTML格式，让文本处理更加便捷；
Java执行框架和JobManager API优化，提升显示效果；
丰富的平台插件，助您轻松添加新功能；
Maven工具链增强，内置Maven注解处理器支持，全面兼容各类核心Maven插件；
免费开源，遵循Eclipse Public License 2.0，让您无拘无束地发挥创意。

【Java支持，技术领先】——Eclipse IDE 2023

支持Java 19，为您提供最先进的开发工具；
XML和Web工具链升级，RELAX NG验证和编辑支持，TypeScript 4.9等最新Web语言和框架一应俱全。

【无限可能，创造未来】——Eclipse IDE 2023

打造下一代开发者工具，释放想象力，构建服务和工具，组装成专属于您的IDE或包；
提供多种平台，打造桌面工具插件、云IDE分布式服务以及浏览器界面；
将您的插件发布至Eclipse Marketplace，与千万开发者共享创新成果。

【一站式解决方案，助力开发】——Eclipse IDE 2023

一键安装丰富的工具集，包括GUI构建器、模型设计、图表报告、测试等；
使用Eclipse Marketplace Client，从庞大的生态系统中寻找、安装并投票支持新的插件；
通过Plug-in Development Environment（PDE）编写自己的插件，或混合功能，打造属于您的梦幻Web IDE。

Eclipse IDE 2023，让您的创新之翼翱翔在编程之巅！

在线咨询

上一篇：杭州Web前端前景怎么样？现在参加Web前端培训还来
下一篇：EAdmin - 基于js和原生html的纯粹后台开

您的项目需求

*请认真填写需求信息，我们会在24小时内与您取得联系。