javaweb html

什么是html

超文本：使用html可以轻松实现超出文本的范畴的形式
标记：html所有操作都是通过标记实现的，标记就是标签 <标签名称>
是一种网页语言：
第一个html程序。
创建java文件.java
–先编译，然后运行 jvm
html后缀是.html .htm

• 直接通过浏览器就可以运行
  代码
  这是我的<font size =“5”,color= “red”>第一个html程序！< /font>
  规范

1. 一个html文件开始标签和结束的标签< html>< /html>
   定义一个java方法 {}

2. html包含两部分内容
   （1）< head> 设置相关信息< /head>
   (2) < body> 显示在页面上的内容都写在body里面</ body>

3. html的标签又开始标签，也要有结束标签
   < head> < /head>

4. html的代码不区分大小写的

5. 有些标签 没有结束标签，在标签内结束

6. 比如换行< br/>

html的操作思想

网页中有很多数据，不同的数据可能需要不同的显示效果，这个时候需要使用标签把要操作的数据包起来
通过修改标签属性值实现标签内数据样式的变化。
一个标签相当于一个容器，想要修改容器内数据的样式，只需要改变容器的属性值，就可以实现容器内数据样式的变化。

常用标签

1. 文字标签：修改文字的样式 < font> < / font>
   属性：size：文字的大小 取值范文1-7 超过了7默认还是7
   color 可以是英文单词 也可以是十六进制的数 #fffff :RGB 通过工具实现不同的颜色

2. 注释标签
   html的注释：< !–这是一个注释–>

3. 标题标签
   < h1>< /h1> < h2> < /h2>
   依次变小 同时自动换行

4. 水平线标签
   < hr/>
   属性 size ：水平线的粗细 取值范围1-7
   color：颜色
   代码< hr size=“5” color =“blue”/>

5. 特殊字符
   想要在页面上显示这样的内容 < html>:是网页的开始！`< < > > 空格 &nbsp；

6. 列表标签：
   ——信息技术学院
   计科
   软工
   信管
   <dl></dl>:表示列表范围、
   在dl里面 <dt></dt>：表示上层内容
   在dl里面 <dd></dd>：表示下层内容

<dl>
<dt> 信息技术学院</dt>
<dd>计科</dd>
<dd>软工</dd>
<dd>信管</dd>

</dl>

<ol></ol> 有序列表 也就是

属性type：设置排序方式 1 a i

<ol> 

 信息技术
<li>计科</li>
<li>软工</li>
<li>信管</li>

</ol>

<ol type="a"> 

 信息技术
<li>计科</li>
<li>软工</li>
<li>信管</li>

</ol>

想要在页面上显示这样的效果
特殊符号 计科
特殊符号 信管
使用的是 <ul></ul>空心圆 circle 实心圆 disc 实心方块 square 默认是disc
7. 图像标签
<img src=" 图片路径"/>
src 图片的路径
width图片的宽度
height 图片的高度
alt 文字
8.路径的介绍
分类：绝对路径 ‪F:\桌面文件\java\8-3.jpg 相对路径 ：一个文件相对于另外一个文件的位置
9 . 超链接标签<a href="链接" target="_blank">内容 </a> 在当前页面打开 target设置打开方式 默认是在当前页打开！
_blank ：新窗口打开 _self：当前页打开 默认
当超链接不需要到任何的地址 只需要在href里面加一个#号
可以定位资源：如果想要定位资源：定义一个位置 <a name="top">顶部</a>
回到位置 <a href= "#top">回到顶部</a>
原样输出 引入标签pre
10. 表格标签
tr表示行 td表示行的一个 外边要套一个table tr和td的一个属性就是algin th表示的是加粗
<table border="1" 线的宽度 bordercolor="blue"线的颜色 cellspacing ="0" 间距 width ="400"表格大小 height="150">
caption是表格标题定义表格的属性之后就可以用标题了
合并单元格 rowspan ：跨行
colspan ：跨列

11. 表单

<form></form>创建表单
method提交方式：常用的两种 get post（隐藏信息 存在于请求体里面）默认get 就是地址栏直接显示提交参数 get的安全级别低 post安全性高 get对数据大小有限制 post没有限制
action 将表单的数据提交到这个页面

大部分输入项<input type= "输入项的类型"/>
普通输入项<input type= "text"/>
密码类型<input type= "password"/>
单选输入项<input type= "radio"/>：

里面需要属性name

name的属性必须要相同

必须要有一个value值
实现一个默认选项 checked
复选输入项<input type= "checkbox"/> 里面需要属性name name的属性必须要相同 每一个选项都要有自己的value值
下拉输入项：<select name ="birth"> <option value ="1991" select="selected">1991</option> <option value ="1992">1992</option> <option value ="1993">1993</option> </select>>

默认选择就是加一个select 如果不加的话就是第一个
文本域 描述信息：<textarea name="description">此处是描述信息</textarea>
提交按钮：<input type="submit"/ vaule="注册"> 也可以使用图片提交
<input type= "image src="a.jpg "/>
当再输入项里面写了name 属性之后
file:///F:/javaweb%E8%B5%84%E6%BA%90/javawehtml?sex=on&love=on&love=on&love=on&birth=1993&description=12 //这里的sex love birth都是我命名的name得到的输入值
重置按钮 <input type= "reset"/> 恢复到初始状态
普通按钮<input type= "button"/> 产生一个点击事件
12. 案例：使用表单标签实现注册界面
使用表格实现界面效果
超链接不需要有效果 href=“#”
表格里面单元格没有内容 使用空格作为占位符
使用图片提交表单 <input type= "image src="a.jpg "/>

13. 其他的标签
b :加粗
s：删除线
u：下划线
i：斜体
pre：原样输出
sub：下标
sup：上标
p: 段落标签比br标签多一行
div：盒子自动换行 用在网络布局
span：在一行显示 用在输入密码提示那个地方
14. html的头标签作用
body head title： 名称
base：统一设置超链接
link 引入css文件
15. 框架标签：
使用框架标签不能卸载body里面 直接给body去掉

如果想要给左边的内容显示在右边 给 target设置成为右边的名称