1.首先再java里面创建一个project(可以创建java文件也可以直接创建HTML文件,如果创建java文件的话可以删掉src文件然后在默认的html文件里面开始编辑)

2.网页里面的注释 (浅蓝色的就是注释,这一块在csdn里面打不出来)快捷键ctrl+/

java代码 html 强制换行 java web换行标签_html

java代码 html 强制换行 java web换行标签_html_02

段落标签 :

可以输入p后再按tab键自动生成上面的标签

换行标签

这个是单标签,不需要两个标签

下面是段落标签和换行标签的效果

java代码 html 强制换行 java web换行标签_java代码 html 强制换行_03

水平线标签

java代码 html 强制换行 java web换行标签_html_04

粗体标签

666

斜体标签

123

空格

空            格

大于号

>

小于号

<
当需要两个<>时,我们在第二个里面/在后面结束

版权符号

©

常见的图片格式

1.JPG
2.GIF
3.PNG
4.BMP

img标签 (图片)

图片加载到网页

java代码 html 强制换行 java web换行标签_javascript_05

src里面输入文件路径 路径用 …/ 开头一直到图片出来 alt 里面的类容是当文件的地址有问题的时候表现出来(一旦找不到图片文件就会直接表达alt里面的类容)

java代码 html 强制换行 java web换行标签_a标签_06


在导入图片的代码里面添加

<img src=“…/resource/image/1.jpg” alt=“龚大为"title=“悬停文字”>

title在这个里面就是悬停文字

<img src=”…/resource/image/1.jpg" alt="龚大为"title="悬停文字"width="300"height=“300”>

width和height显示图片的大小

重点还是src和alt alt里面的类容是必填的

a标签(链接)

java代码 html 强制换行 java web换行标签_a标签_07

href里面的类容就是网页的网址,里面可以是自己的网页也可以是百度网页都可以,也可以是图片的网页链接,然后 里面的就是网页可以点击的然后跳转到href里面的链接 ,这里面的东西也可以是图片,然后效果就点击图片然后再进行跳转如下:

java代码 html 强制换行 java web换行标签_javascript_08


然后《》《》中间可以输入target="_blank"意思是在新网页里面打开,不在当前的页面刷新打开

_self 是被默认的,不需要写如target中

java代码 html 强制换行 java web换行标签_html_09

锚链接需要在你需要跳转的终点标记

代码是回到顶部,当网页比较长的时候可以直接点击返回

回到顶部

java代码 html 强制换行 java web换行标签_java代码 html 强制换行_10


这个代码就可以实现顶部和底部的换位子

记号的不是规定的代码 down 和top 它只是一个标记而已,

功能性链接

1.邮件链接 mailto: 1835547395@QQ.com

这个邮件链接的格式 也是 a标签里面的 如下
点击联系我

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>列表学习</title>
</head>
<body>

<!--有序列表
应用范围:试卷,问答。。。-->
<ol>
    <li>aaa</li>
    <li>bbb</li>
    <li>ccc</li>
    <li>ddd</li>
    <li>eee</li>
    <li>fff</li>
    <li>ggg</li>
</ol>
<hr>
<!--无序列表-->
<ul>
    <li>aaa</li>
    <li>bbb</li>
    <li>ccc</li>
    <li>ddd</li>
    <li>eee</li>
    <li>fff</li>
    <li>ggg</li>

</ul>
<dl>
    <dt>字母</dt>
    <dd>a</dd>
    <dd>b</dd>
    <dd>c</dd>
    <dd>d</dd>



</dl>



</body>
</html>

运行结果

java代码 html 强制换行 java web换行标签_html_11

有序列表 : ol

无序列表 : ul

这两个列表里面都用li进行

自定义列表 : dl

里面需要用dt表示列表名称

dd表示内容

用处:(可以用于网页里面的列表)

java代码 html 强制换行 java web换行标签_前端_12

表格

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>表格练习</title>
</head>
<body>
<!--表格table
行tr
列td
-->
<table border="1px">
  <tr>
    <td colspan="4">11</td>

  </tr>
  <tr>
    <td rowspan="2">21</td>
    <td>22</td>
    <td>23</td>
    <td>24</td>
  </tr>

  <tr>     
    <td>31</td>
    <td>32</td>
    <td>33</td>
  </tr>


</table>


</body>
</html>

table表示表格

tr表示行

td表示列(在行里面创建)

border表示边

colspan表示跨行

rowspan表示跨列

运行结果如下

java代码 html 强制换行 java web换行标签_前端_13

加强练习

java代码 html 强制换行 java web换行标签_html_14

视频

video导入路径之后不一定能播放,需要有控制的东西

controls 可以开关视频

autoplay 自动播放 (打开网页就会自动播放)

java代码 html 强制换行 java web换行标签_javascript_15

音频

andio 和video 是一样的需要开关和自动播放等开能播放

页面结果分析(使用和p一样)

header 标题头部区域的内容 (用于页面或者页面的一块区域)
footer 标记脚步区域的内容(用于整个页面或页面的一块区域)
section Web页面的一块独立的区域
article 独立的文章类容
aside 相关内容或应用 (常用于侧边栏)
nav 导航类辅助内容

iframe

可以在网页里面加入百度等网页或者视频

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>


<iframe src="地址" name="111" frameborder="0"  width="1000px" height="800px"></iframe>

<a href="wangzhan" target="111">点击跳转</a>
<!--上面的代码为在这个网页里面-->
</body>
</html>

src:地址
w-h 宽度高度
a标签里面 在网站111 里面打开wangzhan

表单(登录输入的账号密码等)

action:表单提交的位子,可以是网站,也可以是一个请求处理地址
method : post ,get 提交方式
get 方式提交:我们可以在url中看到我们提交的信息,不安全,但是高效
post 提交账号密码的话网页上面不显示账号密码,比较安全,传输大文件
value : 输入框里面的默认值
maxlength:长度限制(字符)
size: 文本框的长度
input type=“button” 按钮
input type=“image” src=“…/resource/image/1.jpg” 图片按钮
input type=“submit” 提交按钮
重置按钮
value 是定义默认值的 ,基本上能表示小标签的地方都可以用value

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>登录注册</title>
</head>
<body>

<h1>注册</h1>
<!--表单form-->
<form action="我的第一个网页.html" method="get">
  <!-- 文本输入框: input type ="text"-->
  <p>名字:<input type="text" name="username" value="11111" maxlength="8" size="30"></p>
  <!--密码框: input type="password"-->
  <p>密码:<input type="password" name="pwd" ></p>
  <p>
    <input type="submit">
    <input type="reset">
  </p>
</form>
</body>
</html>

下拉框(注释里面有讲解)

<!--我顶我顶我顶-->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>



<p>下拉框:
<!--中国和美国等这些东西才被显示出来
列表名称china等会在网址上显示
 selected是默认选择的是什么(checked也可以作为默认选中的,下拉框只能用selected)
 -->
    <select name="列表名称">
        <option value="china">中国</option>
        <option value="us">美国</option>
        <option value="eth" selected>日本</option>
        <option value="ruis">瑞士</option>
    </select>



</p>
</body>
</html>

java代码 html 强制换行 java web换行标签_a标签_16

文本域

<!--我顶我顶我顶-->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>





<p>
    反馈:
    <textarea name="textarea"  cols="30" rows="10">文本类容:</textarea>
</p>


</body>
</html>

java代码 html 强制换行 java web换行标签_java代码 html 强制换行_17

文件域

<!--我顶我顶我顶-->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

<p>


    <input type="file" name="files">
    <input type="button" value="上传" name="upload">
</p>


</p>
</body>
</html>

java代码 html 强制换行 java web换行标签_java代码 html 强制换行_18

所有的input标签,表达元素 都需要有name 不然表达不了

滑块 (可以调节音量)step表示一格为多少

<p>音量:
    <input type="range" name="voice" min="0" max="100" step="1">
</p>

java代码 html 强制换行 java web换行标签_html_19