素材巴巴 > 程序开发 >

使用IDEA创建并编写一个HTML界面保姆级教程

程序开发 2023-09-04 08:00:16

使用IDEA创建并编写HTML代码

  1. 创建一个新项目，选择New Project

选择New Project

  1. 选择自己的jdk版本，点击Next

选择自己版本的jdk，点击Next

  1. 注意这里不要勾选从模板创建项目，然后点击Next

注意这里的从模板创建项目不要勾选

  1. 给自己的项目起名字是最难的事了，这里给我们宝起个HTML，然后点击Finish

输入我们项目的名字，点击Finish

  1. 出现这个界面，不习惯的同学可以把Project改到右边，直接拖动选项卡就好

出现这个界面，不习惯的同学可以把Project改到右边

  1. 在这里选择我们的src文件夹

在这里插入图片描述

  1. 然后右键New->Package，就是新建一个目录的意思

在这里插入图片描述

  1. 我们给这个目录命名为web，我们即将写的HTML界面和所需的资源文件（如图片）都在这个web目录下

在这里插入图片描述

  1. web目录生成好了，别害怕单击他

在这里插入图片描述

  1. 然后右键New->HTML File，这步是创建一个HTML文件

在这里插入图片描述

  1. 给他起个"注册界面"的名字，单击回车键

在这里插入图片描述

  1. 将下面的代码复制进去，我们做一个简单的注册界面
    在这里插入图片描述

 
 注册页面
 
 








注册详情
男         女        
音乐电影游戏
  1. 你会发现代码报错了，这是因为我们没有导入项目所需的图片，现在我们来进行导入，单击web，然后右键->New->点击Package，这步是生成一个存放图片的文件夹

在这里插入图片描述

  1. 给他起个img的名字

在这里插入图片描述

  1. 生成好了

在这里插入图片描述

  1. 把这张镁铝图片作为我们的背景，把他复制下来

在这里插入图片描述

  1. 点击img->右键->点击Paste，把他复制进我们的img文件夹

在这里插入图片描述

  1. 修改我们url的参数，这步是把我们的图片路径写进代码中去，.是回退的意思 /是代表下一层文件夹

在这里插入图片描述

  1. 晃一晃你的鼠标，你会发现右上角的四个浏览器，使用小公鸡点到谁就选谁的原则，点击一个你已经装好的浏览器，wow运行成功了，界面如下：

在这里插入图片描述
保姆级idea创建html教程，希望大家喜欢
这要学不会，听话，咱不学了，换一行吧
喜欢的话可以为我打赏1分钱支持一下，谢谢大家
在这里插入图片描述


标签：

上一篇： Layui第三方JS插件的模块化使用 下一篇：

相关文章

    无相关信息
素材巴巴 Copyright © 2013-2021 http://www.sucaibaba.com/. Some Rights Reserved. 备案号：备案中。