html的简介

*什么事html?
 -HyperText Markup Language:超文本标记语言,网页语言
 -超文本:超文本的范畴,使用html可以轻松实现这样操作
 -标记:html所有的操作都是通过标记实现的,标记就是标签<标签名称>
 -网页语言
 *第一个html程序。
 -创建java文件.java
 **先编译,然后再运行(jvm)
 -html后缀是.html .htm
 ** 直接通过浏览器就可以运行• 代码
 ** 这就是我的font size=“5” color=“red”>第一个html程序!</font
 *html的规范(遵循)
 1.一个html文件开始标签和结束的标签<html</html
 -定义一个java方法{}
 2.html包含两部分内容
 (1)<head 设置相关信息</head
 (2)<body 显示在页面上的内容都是写在<body里面</body
 3.html的标签有开始标签,也要有结束标签
 -<head </head
 4.html的代码不区分大小写的
 5.有些标签,没有结束标签,在标签内结束
 -比如 换行 br/> <hr/*html的操作思想(*****理解)
 网页中有很多数据,不同的数据可能需要不同的显示效果,这个时候需要使用标签把要操作的数据包起来(封装起来)
 通过修改标签的属性值实现标签内数据样式的变化。
 一个标签相当于一个容器,想要修改容器内数据的样式,只要改变容器的属性值,就可以实现容器内数据样式的变化。
 html中常用的标签
 1.文字标签和注释标签
 *文字标签:修改文字的样式
 - <font </font
 - 属性
 *size:文字的大小 取值范围 1-7,超出了7,默认还是7
 *color: 文字颜色
 - 两种表示方式
 **英文单词:red green blue black white yellow gray…
 **使用十六进制数表示 #fffff:RGB
 - 通过工具实现不同的颜色 #66cc66
 *注释标签
 -java注释几种? 三种
 -html的注释:<!-- html的注释 –
 2.标题标签、水平线标签和特殊标签
 *标题标签
 -<h1 </h1 <h2 </h2 <h3 </h3…<h6 </h6
 -从h1到h6,大小是一次变小,同时会自动换行
 *水平线标签
 -<hr/
 -属性
 **size:水平线的粗细 取值范围 1-7
 **color:颜色
 - 代码
 <hr size=“5” color=“blue”/
 *特殊字符
 需要对特殊字符进行转义
 * < & lt;
 * > & gt;
 * & & amp;
 * 空格 & nbsp;
 3.列表标签
 **<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
 -代码
 <ol
 <li 财务部</li
 <li 学工部</li
 <li 人事部</li
 </ol
<ul </ul :表示无序列表的范围
 属性:type:空心圆circle、实心圆disc、实心方块square、默认disc
 在ul里面 <li </li
 -代码
 <ul
 <li 财务部</li
 <li 学工部</li
 <li 人事部</li
 </ul
 4.图像标签()
 * < img src=“图片的路径”/
 -src:图片的路径
 -weidth:图片的宽度
 -height:图片的高度
 -alt:图片上显示的文字,把鼠标移动到图片上,停留片刻显示内容
 **有些浏览器下不显示(没有效果)
 5.路径的接介绍
 * 分类:两类
 ** 绝对路径
 -c:\users\Desktop\a.jpg
 ** 相对路径
 -一个文件相对于另一个文件的位置
 -三种:
 **html文件和图片在一个路径下,可以直接写文件名称
 -<img src=“a.jpg” alt=“这是一个美女”/
 **图片在html下层目录
 在html文件中,使用img文件夹下面的a.jpg
 **图片在html文件的上层目录
 …/表示上层目录6.案例1:列表标签的使用
 7.超链接标签(*********)
 * 链接资源
 -< a href=“链接到资源的路径”> 这是一个超链接</a
 **href:链接的资源地址
 **target:设置代打开的方式,默认是当前页打开
 -_blank:在一个新窗口打开
 -_self:在当前页打开 默认
 -当超链接不需要到任何的地址 在href里面加#
 - <a href="#" 这是一个超链接2</a
 *定位资源
 **如果想要定位资源,定义一个位置
 <a name=“top” 顶部</a
 **回到这个位置
 <a href="#top" 回到顶部</a
 **引入一个标签 pre:原样输出
 8.表格标签(*重要的标签)
 *可以对数据进行格式化,使数据显示更加清晰
 *<table </table :表示表格范围
 -border:表格线
 -bordercolor:表格线的颜色
 -cellspacing:单元格之间的距离
 -width:表格线的宽度
 -height:表格线的高度
 **在table里面<tr </tr
 -设置显示方式 align:left center right
 ***在tr里面<td </td
 -设置显示方式 align: left center right
 ***使用th也可以表示单元格
 -表示可以实现居中和加粗
 *代码
 <table border=“1” bordercolor=“blue” cellspacing=“0” width=“200” height=“150”
 *画图分析表格的写法
 -首先定义一个表格的范围使用table
 -定义一行使用tr
 -定义一个单元格使用td
 **操作技巧
 -首先数有多少行,数每行里面有多少个单元格
 **表格的标题
 <caption </caption
 **合并单元格
 -rowspan:跨行
 -colspan:跨列
 **<td colspan=“3” 人员信息</td
 9.表单标签
 *提交到网站服务器,这个过程可以使用表单标签
 *<form </form :定义一个表单的范围
 -属性
 **action:提交到地址,默认提交到当前的页面
 **method:表单提交方式
 -常用的有两种 get和post,默认是get
 **面试题目:get和post区别
 1.get请求地址栏会携带提交的数据,post不会携带(请求体里面)
 2.get请求安全级别较低,post较高
 3.get请求数据大小的限制,post,没有限制
 **enctype:一般请求下不需要这个属性,做文件上传时需要设置这个属性
 **输入项:可以输入内容或者选择内容的部分
 -大部分的输入项 使用 <input type=“输入项的类型”/
 ***普通输入项:<input type=“text”/
 ***密码输入项:<input type=“password”/
 ***单选输入项:<input type=“radio”/
 -在里面需要属性 name
 -name的属性值必须相同
 -必须有一个value值
 *****实现默认选中的属性
 -checked=“checked”
 ***复选输入项:<input type=“checkbox”/
 -在里面需要属性name
 -name的属性必须相同
 -必须有一个value值
 ***文件输入项(在后面上传时候用到)
 -<input type=“file”/
 ***下拉输入项(不是在input标签里面的)
 <select name=“birth”
 <option value=“0” 请选择</option
 <option value=“1991” 1991 </option
 <option value=“1992” 1992 </option
 <option value=“1993” 19 </option
 </select
 -默认选择
 ***selected=“selected”
 ***文本域
 <textarea cols=“10” rows=“10” </textarea
 ***隐藏项
 <input type=“hidden”/
 ***提交按钮
 <input type=“submit” value=“注册”/
 **?输入项name的值=输入的值&
 **参数类似于key-value形式
 ***使用图片提交
 <input type=“image”
 ***重置按钮 回到输入项的初始状态
 <input type=“reset” value=""/
 ***普通按钮
 <input type=“button” value=""/
 10.案例:使用表单标签实现注册页面
 -使用表格实现页面效果
 -超链接不想要其他效果href="#"
 -如果表格里面的单元格没有内容,使用空格作为占位符& nbsp;
 -使用图片提交表单<input type=“image” src=“图片的路径”/
 11.html中的其他常用标签的使用
 b:加粗
 s:删除线
 u:下划线
 i:斜体pre:原样输出
 
 sub:下标
 sup:上标
 p:段落标签 比br标签多一行css一直使用
 div:自动换行
 span:在一行显示
 12.html的头部标签的使用
html两部分组成head和body
 **在head里面的标签就是头标签
 **title标签:表示在标签上显示的内容
 **<meta 标签:设置页面的一些相关内容
 -<meta name=“keywords” content=“lipenghui”
 <meta http-equiv=“refresh” content=“3;url=01-hello.html”/
 -base标签:设置超链接的基本设置
 -可以统一设置超链接的打开方式
 <base target="_blank"/
 **link标签:引入外部文件
 13.框架标签的使用
<frameset
 -rows:按照行进行划分
 **<frameset rows="80,"
 -cols:按照列进行划分
 **<frameset cols="80,"
 *<frame
 -具体显示的页面
 -<frame name=“lower_left” src=“b.html”/
 ***使用框架标签时候,不能写在body里面,使用了框架标签,需要把body去掉

java 超链接样式 操作 javaweb超链接怎么设置_超链接