「每日一学」前端魔法王国：HTML与CSS奇迹创造者的冒险之旅

习总目标

本次学习目标

3. HTML

3.1 HTML概念

HTML是Hyper Text Markup Language的缩写。意思是『超文本标记语言』。它的作用是搭建网页结构，在网页上展示内容

3.1.1 超文本

HTML文件本质上是文本文件，而普通的文本文件只能显示字符。但是HTML技术则通过HTML标签把其他网页、图片、音频、视频等各种多媒体资源引入到当前网页中，让网页有了非常丰富的呈现方式，这就是超文本的含义——本身是文本，但是呈现出来的最终效果超越了文本。

3.1.2 标记语言

说HTML是一种『标记语言』是因为它不是向Java这样的『编程语言』，因为它是由一系列『标签』组成的，没有常量、变量、流程控制、异常处理、IO等等这些功能。HTML很简单，每个标签都有它固定的含义和确定的页面显示效果。

标签是通过一组尖括号+标签名的方式来定义的：

<p>HTML is a very popular fore-end technology.</p>

这个例子中使用了一个p标签来定义一个段落，<p>叫『开始标签』，</p>叫『结束标签』。开始标签和结束标签一起构成了一个完整的标签。开始标签和结束标签之间的部分叫『文本标签体』，也简称『标签体』。

有的时候标签里还带有『属性』：

<a href="http://www.xxx.com">show detail</a>

href=“http://www.xxx.com”就是属性，href是『属性名』，“http://www.xxx.com”是『属性值』。

还有一种标签是『单标签』：

<input type="text" name="username" />

3.2 HTML的入门程序

3.3 HTML的结构

文档声明: HTML文件中第一行的内容，用来告诉浏览器当前HTML文档的基本信息，其中最重要的就是当前HTML文档遵循的语法标准。这里我们只需要知道HTML有4和5这两个大的版本，HTML4版本的文档类型声明是：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
HTML5版本的文档类型声明是：
<!DOCTYPE html>
现在主流的技术选型都是使用HTML5，之前的版本基本不用了。

根标签:html标签是整个文档的根标签，所有其他标签都必须放在html标签里面。
头部:head标签用于定义文档的头部，其他头部元素都放在head标签里。头部元素包括title标签、script标签、style标签、link标签、meta标签等等。
主体:body标签定义网页的主体内容，在浏览器窗口内显示的内容都定义到body标签内。
注释:HTML注释的写法是：


注释的内容不会显示到浏览器窗口内，是开发人员用来对代码内容进行解释说明。

3.4 HTML语法规则

根标签有且只能有一个
无论是双标签还是单标签都必须正确关闭
标签可以嵌套但不能交叉嵌套
注释不能嵌套
属性必须有值，值必须加引号，单引号或双引号均可
标签名不区分大小写但建议使用小写

3.5 使用idea创建StaticWeb工程

3.6 HTML的各个标签的使用

3.6.1 标题标签

代码

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h1>这是一级标题</h1>
<h2>这是二级标题</h2>
<h3>这是三级标题</h3>
<h4>这是四级标题</h4>
<h5>这是五级标题</h5>
<h6>这是六级标题</h6>
</body>
</html>

页面效果

3.6.2 段落标签

代码

<p>There is clearly a need for CSS to be taken seriously by graphic artists. The Zen Garden aims to excite, inspire, and encourage participation. To begin, view some of the existing designs in the list. Clicking on any one will load the style sheet into this very page. The code remains the same, the only thing that has changed is the external .css file. Yes, really.</p>

页面效果

3.6.3 换行标签

代码

We would like to see as much CSS1 as possible. CSS2 should be limited to widely-supported elements only. The css Zen Garden is about functional, practical CSS and not the latest bleeding-edge tricks viewable by 2% of the browsing public. <br/>The only real requirement we have is that your CSS validates.

3.6.4 无序列表标签

代码

<ul>
<li>Apple</li>
<li>Banana</li>
<li>Grape</li>
</ul>

页面效果

3.6.5 超链接标签(重要)

代码

<body>


<a href="../01_html的入门/start.html">跳转到start.html页面</a><br/>

<a href="https://www.baidu.com" target="_blank">跳转到百度</a>
</body>

点击后跳转到href属性指定的页面

3.6.6 图片标签(重点)

准备图片文件

代码


<img src="../img/mm.jpg" width="409" height="292"/>

页面效果

3.6.7 块标签(重点)

『块』并不是为了显示文章内容的，而是为了方便结合CSS对页面进行布局。块有两种，div是前后有换行的块，span是前后没有换行的块。

把下面代码粘贴到HTML文件中查看他们的区别：

<div style="border: 1px solid black;width: 100px;height: 100px;">This is a div block</div>
<div style="border: 1px solid black;width: 100px;height: 100px;">This is a div block</div>
<span style="border: 1px solid black;width: 100px;height: 100px;">This is a span block</span>
<span style="border: 1px solid black;width: 100px;height: 100px;">This is a span block</span>

3.6.8 HTML实体(了解)

在HTML文件中，<、>等等这样的符号已经被赋予了特定含义，不会作为符号本身显示到页面上，此时如果我们想使用符号本身怎么办呢？那就是使用HTML实体来转义。

3.7 路径介绍

在我们整个Web开发技术体系中，『路径』是一个贯穿始终的重要概念。凡是需要获取另外一个资源的时候都需要用到路径。要想理解路径这个概念，我们首先要认识一个概念：『文件系统』。

3.7.1 文件系统

我们写代码的时候通常都是在Windows系统来操作，而一个项目开发完成后想要让所有人都能够访问到就必须『部署』到服务器上，也叫『发布』。而服务器通常是Linux系统。

Windows系统和Linux系统的文件系统有很大差别，为了让我们编写的代码不会因为从Windows系统部署到了Linux系统而出现故障，实际开发时不允许使用物理路径。

物理路径举例：
D:\aaa\pro01-HTML\page01-article-tag.html
D:\aaa\pro01-HTML\page02-anchor-target.html

幸运的是不管是Windows系统还是Linux系统环境下，目录结构都是树形结构，编写路径的规则是一样的。

所以我们以项目的树形目录结构为依据来编写路径就不用担心操作系统平台发生变化之后路径错误的问题了。有了这个大前提，我们具体编写路径时有两种具体写法：

相对路径
绝对路径

3.7.2 相对路径

相对路径都是以『当前位置』为基准来编写的。假设我们现在正在浏览a页面，想在a页面内通过超链接跳转到z页面。

那么按照相对路径的规则，我们现在所在的位置是a.html所在的b目录：

z.html并不在b目录下，所以我们要从b目录出发，向上走，进入b的父目录——c目录：

c目录还是不行，继续向上走，进入c的父目录——d目录：

在从d目录向下经过两级子目录——e目录、f目录才能找到z.html：

所以整个路径的写法是：

3.8 使用表格标签展示数据(重要)

3.8.1 目标页面效果

3.8.2 第一版代码


<table>

<tr>

<th>姓名</th>
<th>属性</th>
<th>级别</th>
<th>忍村</th>
</tr>
<tr>

<td>漩涡鸣人</td>
<td>风</td>
<td>下忍</td>
<td>木叶</td>
</tr>
<tr>
<td>宇智波佐助</td>
<td>雷&火</td>
<td>下忍</td>
<td>木叶</td>
</tr>
<tr>
<td>我爱罗</td>
<td>沙</td>
<td>影</td>
<td>砂隐村</td>
</tr>
</table>

如果只有上面的代码，页面显示效果是：

没有表格边框。想要显示好看的表格边框可以把下面的style标签代码复制粘贴到head标签里,CSS还没讲，不必在意语法细节，整体照搬即可。

<style type="text/css">
table,th,td {
border-collapse: collapse;
border: 1px solid black;
padding: 5px;
}
</style>

我们发现，相较于目标效果而言，还未实现横纵向合并单元格

3.8.3 合并单元格

① 横向合并单元格(列合并)

使用colspan属性将两个横向相邻的单元格跨列合并：

<tr>
<td>宇智波佐助</td>
<td>雷&火</td>
<td colspan="2">下忍</td>
</tr>

注意: 『被合并』的单元格要删掉。

② 纵向合并单元格(行合并)

使用rowspan属性将两个纵向相邻的单元格跨行合并：

<tr>
<td>宇智波佐助</td>
<td rowspan="2">雷&火</td>
<td colspan="2">下忍</td>
</tr>
<tr>
<td>我爱罗</td>
<td>影</td>
<td>砂隐村</td>
</tr>

注意: 『被合并』的单元格要删掉。

3.9 表单标签(最重要)

3.9.1 表单标签的作用

在项目开发过程中，凡是需要用户填写的信息都需要用到表单。它的作用是接收用户的输入信息，并且将用户输入的信息提交给服务器

3.9.2 form标签的介绍

在HTML中我们使用form标签来定义一个表单。而对于form标签来说有两个最重要的属性：action和method。

<form action="/aaa/pro01-HTML/page05-form-target.html" method="post">

</form>

① action属性

用户在表单里填写的信息需要发送到服务器端，对于Java项目来说就是交给Java代码来处理。那么在页面上我们就必须正确填写服务器端的能够接收表单数据的地址。

这个地址要写在form标签的action属性中。但是现在暂时我们还没有服务器端环境，所以先借用一个HTML页面来当作服务器端地址使用。

② method属性

『method』这个单词的意思是『方式、方法』，在form标签中method属性用来定义提交表单的『请求方式』。method属性只有两个可选值：get或post，没有极特殊情况的话使用post即可。

什么是『请求方式』？

浏览器和服务器之间在互相通信时有大量的『数据』需要传输。但是不论是浏览器还是服务器都有很多不同厂商提供的不同产品。

常见的浏览器有：

Chrome
Firefox
Safari
Opera
Edge

常见的Java服务器有：

Tomcat
Weblogic
WebSphere
Glassfish
Jetty

这么多不同厂商各自开发的应用程序怎么能保证它们彼此之间传输的『数据』能够被对方正确理解呢？

很简单，我们给这些数据设定『格式』，发送端按照格式发送数据，接收端按照格式解析数据，这样就能够实现数据的『跨平台传输』了。

而这里定义的『数据格式』就是应用程序之间的『通信协议』。

在JavaSE阶段的网络编程章节我们接触过TCP/IP、UDP这样的协议，而我们现在使用的『HTTP协议』的底层就是TCP/IP协议。

但是在HTML标签中，点击超链接是GET方式的请求，提交一个表单可以通过form标签的method属性指定GET或POST请求，其他请求方式无法通过HTML标签实现。除了GET、POST之外的其他请求方式暂时我们不需要涉及（到我们学习SpringMVC时会用到PUT和DELETE）。至于GET请求和POST请求的区别我们会在讲HTTP协议的时候详细介绍，现在大家可以从表面现象来观察一下。

3.10 表单项标签

表单中的每一项，包括: 文本框、密码框、单选框、多选框等等，都称之为表单项，一个表单中可以包含多个表单项

3.10.1 name和value属性

在用户使用一个软件系统时，需要一次性提交很多数据是非常正常的现象。我们肯定不能要求用户一个数据一个数据的提交，而肯定是所有数据填好后一起提交。那就带来一个问题，服务器怎么从众多数据中识别出来收货人、所在地区、详细地址、手机号码……？

很简单，给每个数据都起一个『名字』，发送数据时用『名字』携带对应的数据，接收数据时通过『名字』获取对应的数据。

在各个具体的表单标签中，我们通过『name属性』来给数据起『名字』，通过『value属性』来保存要发送给服务器的『值』。

但是名字和值之间既有可能是『一个名字对应一个值』，也有可能是『一个名字对应多个值』。

这么看来这样的关系很像我们Java中的Map，而事实上在服务器端就是使用Map类型来接收请求参数的。具体的是类型是：Map<String,String[]>。

name属性就是Map的键，value属性就是Map的值。

有了上面介绍的基础知识，下面我们就可以来看具体的表单项标签了。

3.10.2 单行文本框

代码

个性签名：<input type="text" name="signal"/><br/>

显示效果

3.10.3 密码框

代码

密码：<input type="password" name="secret"/><br/>

显示效果

3.10.4 单选框

代码

你最喜欢的季节是：
<input type="radio" name="season" value="spring" />春天
<input type="radio" name="season" value="summer" checked="checked" />夏天
<input type="radio" name="season" value="autumn" />秋天
<input type="radio" name="season" value="winter" />冬天
<br/><br/>
你最喜欢的动物是：
<input type="radio" name="animal" value="tiger" />路虎
<input type="radio" name="animal" value="horse" checked="checked" />宝马
<input type="radio" name="animal" value="cheetah" />捷豹

显示效果

说明:

name属性相同的radio为一组，组内互斥
当用户选择了一个radio并提交表单，这个radio的name属性和value属性组成一个键值对发送给服务器
设置checked=“checked”属性设置默认被选中的radio

3.10.5 多选框

代码

你最喜欢的球队是：
<input type="checkbox" name="team" value="Brazil"/>巴西
<input type="checkbox" name="team" value="German" checked="checked"/>德国
<input type="checkbox" name="team" value="France"/>法国
<input type="checkbox" name="team" value="China" checked="checked"/>中国
<input type="checkbox" name="team" value="Italian"/>意大利

显示效果

说明:

设置checked=“checked”属性设置默认被选中的checkbox

3.10.6 下拉框

代码

你喜欢的运动是：
<select name="interesting">
<option value="swimming">游泳</option>
<option value="running">跑步</option>
<option value="shooting" selected="selected">射击</option>
<option value="skating">溜冰</option>
</select>

显示效果

说明:

下拉列表用到了两种标签，其中select标签用来定义下拉列表，而option标签设置列表项。
name属性在select标签中设置。
value属性在option标签中设置。
option标签的标签体是显示出来给用户看的，提交到服务器的是value属性的值。
通过在option标签中设置selected=“selected”属性实现默认选中的效果。

3.10.7 按钮

代码

<button type="button">普通按钮</button>或<input type="button" value="普通按钮"/>
<button type="reset">重置按钮</button>或<input type="reset" value="重置按钮"/>
<button type="submit">提交按钮</button>或<input type="submit" value="提交按钮"/>

显示效果

说明:

普通按钮: 点击后无效果，需要通过JavaScript绑定单击响应函数
重置按钮: 点击后将表单内的所有表单项都恢复为默认值提交按钮
提交按钮: 点击后提交表单

3.10.8 隐藏域

代码

<input type="hidden" name="userId" value="2233"/>

说明:

通过表单隐藏域设置的表单项不会显示到页面上，用户看不到。但是提交表单时会一起被提交。用来设置一些需要和表单一起提交但是不希望用户看到的数据，例如：用户id等等。

3.10.9 多行文本框

代码

自我介绍：<textarea name="desc"></textarea>

显示效果

说明:

textarea没有value属性，如果要设置默认值需要写在开始和结束标签之间。

3.10.10 文件表单

代码

头像:<input type="file" name="file"/>

显示效果

说明:

不同浏览器显示的样式有微小差异

DEA简介

IDEA全称是IntelliJ，是JetBrains公司推出一个集成开发工具，是Java开发工具中的翘楚，基于这个开发工具可以快速开发我们的Java相关项目。相对于其它开发工具，IDEA提供了更加强大的提示功能，全面的快捷键操作，模板代码以及快速的资源整合。

下载与安装

准备工作

硬件(Hardware)要求1)内存8G或以上
2)硬盘磁盘空闲空间大于5GB，最好有一块固态硬盘。
软件(Software)要求1)Microsoft Windows 8 or later
2)macOS 10.13 or later
3)Any Linux distribution
4)Set Up and Config JDK1.8

IDEA工具下载

IDEA官网下载地址如下：

https://www.jetbrains.com/idea/

基于操作系统的不同，可以选择不同平台下的IDEA，例如：

说明:至于社区版(功能受限的免费版)/还是商业版(可试用)自行决定。

IDEA工具安装

IDEA 下载以后需要进行安装进行使用。假如只是下载的解压版本，则可以将其拷贝到非中文目录，然后直接解压进行应用。假如下载的可执行程序（例如windows平台下的.exe文件)则直接启动可执行程序，然后按照提示，一步一步安装即可。

IDEA官方帮助文档文档参考如下：

https://www.jetbrains.com/help/idea/discover-intellij-idea.html

IDEA工具启动

找到解压或安装好的idea根目录，然后进入bin目录找到idea.bat或者idea64.exe文件，然后直接双击进行启动，第一个启动欢迎界面如图所示：

在第一个界面呈现过程中，其实是IDEA底层在进行启动初始化，假如是第一次启动，稍等片刻会进入第二个界面，例如：

在第二个界面中，我们先选择创建新项目（New Project)，然后进入创建项目的界面，这里我们先选择创建空项目，如图所示：

选择好Empty Project以后，点击next进入项目的设计，如图所示：

在上面图中，点击Finish按钮完成项目的创建，进入IDEA的项目工作窗口，如图所示：

IDEA 基本配置

Appearance(显示)主题配置

KeyMap(快捷键)配置

Editor(编辑区)配置

General 配置

滚轮滑动，改变字体大小配置,如图所示：

包导入配置，如图所示：

行号与方法分隔符配置，如图所示：

代码提示配置，如图所示：

代码补全配置，如图所示：

Font 配置

代码编辑区字体配置，如图所示：

控制台字体配置，如图所示：

Color 配置

代码中的注释颜色配置，如图所示：

File 编码配置

Build 执行配置

Compiler(编译配置)

自动编译配置(可选),选上了可能会比较慢，如图所示：

Build Tools 中的Maven配置

Maven 初始化配置(假如已有配置好的，可以使用已有的配置）

找到你磁盘中的maven根目录下的conf目录，并打开conf目录下的settings.xml文件，然后进行如下配置：

配置maven本地库(从maven远程服务器下载的资源存储到的位置)

<localRepository>${user.home}/.m5/repository</localRepository>

配置maven私服(配置到mirrors标签内部)。

   <mirror>
    <id>aliyun</id>
    <name>aliyun for maven</name>
    <mirrorOf>*</mirrorOf>
    <url>https://maven.aliyun.com/repository/public</url>
   </mirror>

配置maven中的profile（配置到profiles标签内部）,设置JDK编译和运行版本。

<profile>
   <id>jdk-1.8</id>
   <activation>
    <activeByDefault>true</activeByDefault>
      <jdk>1.8</jdk>
   </activation>
   <properties>
       <maven.compiler.source>1.8</maven.compiler.source>
       <maven.compiler.target>1.8</maven.compiler.target>
       <maven.compiler.compilerVersion>1.8
       </maven.compiler.compilerVersion>
   </properties>
 </profile>

IDEA 中集成Maven配置

找到Build Tools/Maven选项，然后在IDEA中集成本地maven配置。如图所示：

Version Control 配置

安装gitee插件

Gitee 安装成功以后，检查是否在Version Control中有Gitee选项，如图所示：

点击Version Control的Gitee选项，进入Gitee配置，如图所示：

在Gitee配置界面，选择添加账户(Add Account)，进入账户配置界面，如图所示：

在Gitee账户配置界面，进行连接Gitee平台的账户配置（要事先注册好Gitee平台账户），然后点击Log in进行登陆，登陆成功以后会呈现如下界面，如图所示：

总结(Summary)

本小节主要是对IDEA开发工具进行了一个简单介绍，然后基于我们后续要做的应用，做了一个初步配置，基于这个配置我们后续可以更好的展开项目的创建、测试等。

DEA 全称 IntelliJ IDEA，是java编程语言开发的集成环境。IntelliJ在业界被公认为最好的java开发工具，尤其在智能代码助手、代码自动提示、重构、JavaEE支持、各类版本工具(git、svn等)、JUnit、CVS整合、代码分析、创新的GUI设计等方面的功能可以说是超常的。IDEA是JetBrains公司的产品，这家公司总部位于捷克共和国的首都布拉格，开发人员以严谨著称的东欧程序员为主。它的旗舰版本还支持HTML，CSS，PHP，MySQL，Python等。免费版只支持Java,Kotlin等少数语言。

俗话说：＂工欲善其事必先利其器＂，今天准备和大家一起分享一下实际工作中能提升幸福感和工作效率的IDEA插件。

废话不多说，let's go ！！！

1Alibaba Java Coding Guidelines

【阿里巴巴代码规范检查插件】

在你需要检查的代码上面，点击右键，选择编码规约扫描

将会出现如下所示的检查结果，并会给出编码规范和提示：

2GsonFormat

【jsonToBean】

在平时的开发中，将json转为Bean

3A8Translation

【翻译的插件】

选中你要翻译的汉语或英文，点击鼠标右键，选择Translate, （快捷键是Alt+T）就会实现翻译，不用再去切换屏幕使用翻译软件翻译了。

4Maven Helper

【分析依赖冲突的插件】

此插件可用来方便显示maven的依赖树，和显示冲突，在我们梳理依赖时帮助很大。

5Free Mybatis plugin

【增强idea对mybatis支持的插件】

生成mapper xml文件快速从代码跳转到mapper及从mapper返回代码 mybatis自动补全及语法错误提示集成mybatis generator gui界面这个插件超级实用，可以从mapper接口跳转到mybatis的xml文件中，还能找到对应地方

6Grep Console

【日志高亮显示插件】

可以Ctrl + Alt +S Other Settings进行配色（颜色参考请搜索：电脑最护眼的色彩、显示屏亮度亦如此）

7Lombok

当我们创建一个实体时，通常对每个字段去生成GET/SET方法，但是万一后面需要增加或者减少字段时，又要重新的去生成GET/SET方法，非常麻烦。可以通过该插件，无需再写那么多冗余的get/set代码。

注意：需要在pom引入依赖

<dependency>
<groupId>org.projectlombok</groupId>
<artifactId>lombok</artifactId>
</dependency>

8Nyan progress bar

基于Idea使用的漂亮进度条。把你的加载进度条全都变成彩虹和猫咪

9FindBugs-IDEA

【Bug检查插件】

在文件上或文件里面点击鼠标右键，选择FingBugs

简单的bug能给你快速找回来，什么NPE啥的，小儿科！推荐！！（嗓门大就说一遍）

10Key Promoter X

你还在为记不住快捷键烦恼吗，Key Promoter X可以帮助你快速记住常用的快捷键。当你在idea中用鼠标点击菜单，它可以显示对应的快捷键以及点击次数。使用一段时间后有助于过渡到更快、无鼠标的开发。

11JavaDoc

在项目中经常要求写代码注释，否则不能通过代码门禁，JavaDoc工具可以一键生成注释。

插件安装成功后在菜单栏 code -> JavaDocs可以找到

自动生成注释效果如下：

12ignore

项目开发中通常会使用到git进行版本管理，在提交代码时经常有人将本地的不必要的文件提交到代码仓库中，使用.ignore插件可以很好解决这个问题。插件安装完成后会在项目中生成一个.ignore文件，编辑该文件忽略一些动态生成的文件，如class文件，maven的target目录等。

13RainbowBrackets

彩虹括号，代码中有多个括号会显示不同的颜色。

14Activate-power-mode

在敲代码时有抖动酷炫的特效，非常适合给前端小姐姐表演特技。（坏笑）

15CodeGlance

16GenerateAllSetter

通过alt+enter对变量类生成对类的所有setter方法的调用
当两个对象具有相同的字段时生成一个转换器
当returnType为List Set Map时生成默认值
在所有getter方法上生成对assertThat的调用

17RestfulToolkit

根据 URL 直接跳转到对应的方法定义 ( 快捷键搜索 Ctrl + Alt + N 或者 Ctrl + \ ); —这个个人感觉非常好用，和Ctrl + F一样重要。
提供了一个 Services tree 的显示窗口;
一个简单的 http 请求工具;
在请求方法上添加了有用功能: 复制生成 URL;,复制方法参数…
其他功能: java 类上添加 Convert to JSON 功能，格式化 json 数据 ( Windows: Ctrl + Enter; Mac: Command + Enter )。

18JRebel

热门部署插件，让你在修改完代码后，不用再重新启动，很实用！但是，不是免费的，需要大家发挥下聪明才智自行百度破解！

19Json Parser

厌倦了打开浏览器格式化和验证JSON?为什么不安装JSON解析器并在IDE中使用离线支持呢?JSON解析器是一个用于验证和格式化JSON字符串的轻量级插件。

20aiXcode & codota

aiXcoder是一个强大的代码完成器和代码搜索引擎，基于最新的深度学习技术。它有可能向您推荐一整套代码，这将帮助您更快地编写代码。aiXcoder还提供了一个代码搜索引擎，以帮助您在GitHub上搜索API用例。

类似功能的插件还有codota，codota基于数百万个开源Java程序和您的上下文来完成代码行，从而帮助您以更少的错误更快地进行编码。新版本的codota提供以下功能：

全线AI自动完成
内联和相关代码示例
根据用户自己的编码实践进行编码建议
不用担心你的代码会被公开。codota不会将你的代码发送到codota服务器，它只会从当前编辑的文件中发送最少的上下文信息，从而使codota能够根据你当前的本地范围进行预测。

比如我想知道list.stream.map(…)方法的参考使用,只需要光标定位在map上，然后右键选择菜单“Get relevant examples”或者使用快捷键“Ctrl + Shift + O”就可以快速搜索出来很多示例，非常方便。

来源：blog.csdn.net/CSDN_SAVIOR/article/details/122505538

在线咨询

上一篇：uniapp中scroll-view局部滚动的各种场景
下一篇：什么手机浏览器自带翻译插件？分享5个网页翻译方法

您的项目需求

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

整合营销服务商

「每日一学」前端魔法王国：HTML与CSS奇迹创造者的冒险之旅

DEA简介

下载与安装

准备工作

IDEA工具下载

IDEA工具安装

IDEA工具启动

IDEA 基本配置

Appearance(显示)主题配置

KeyMap(快捷键)配置

Editor(编辑区)配置

General 配置

Font 配置

Color 配置

File 编码配置

Build 执行配置

Compiler(编译配置)

Build Tools 中的Maven配置

Version Control 配置

安装gitee插件

总结(Summary)

您的项目需求