html是什么?
超文本标记语言 (html命令 + 文本)
互联网的三大基石:
url 访问的地址
协议 通信的规定
html 网页的展示
form表单HTML5、CSS3标签及属性、属性值
form表单HTML标签、属性、属性值：
（单行文本输入框） （密码输入框） （单选框） （多选框） （提交按钮） （重置按钮） 或者按钮（空按钮） （下拉框选） （多行文本框）
（1） 是表单的标签，所有的需要写在form里面才进行提交；
1：name=”” form中的name属性主要是对这个form进行标记；
2：methood=”get/post” 其中
这里照搬别人的很生硬，建议和http详解一起观看
get/post 之间的区别：
- get是从服务器上获取数据，post是向服务器传送数据。
- get是把参数数据队列加到提交表单的ACTION属性所指的URL
中，值和表单内各个字段一一对应，在URL中可以看到。post是通
过HTTP post机制，将表单内各个字段与其内容放置在HTML
HEADER内一起传送到ACTION属性所指的URL地址。用户看不到
这个过程。 - 对于get方式，服务器端用Request.QueryString获取变量的值，
对于post方式，服务器端用Request.Form获取提交的数据。 - get传送的数据量较小，不能大于2KB。post传送的数据量较大，
一般被默认为不受限制。但理论上，IIS4中最大量为80KB，IIS5中
为100KB。 - get安全性非常低，post安全性较高。但是执行效率却比Post方法
好。
3： action=”” action=url用来指定处理提交表单的格式.它可以是一个
URL地址(提交给程式)或一个电子邮件地址.
4：enctype=cdata指明用来把表单提交给服务器时(当method值为”post”)
的互联网媒体形式.这个特性的缺省值是”application/x-www-form-
urlencoded”
5：target=”“指定提交的结果文档显示的位置： _blank ：在一个新的、
无名浏览器窗口调入指定的文档； _self ：在指向这个目标的元素的相同
的框架中调入文档； _parent ：把文档调入当前框的直接的 frameset
框中；这个值在当前框没有父框时等价于_self； _top ：把文档调入原来
的最顶部的浏览器窗口中(因此取消所有其它框架)；这个值等价于当前框
没有你框时的_self.
（2）type=”text”是定义表单里面的单行文本框；value=”“文本框里默认的文字；size=”“单行文本框的宽度；maxlength=”“单行文本框所能输入的字节；
（3）type=”password” 定义密码框；
（4）type=”radio” 单选勾选框；
（5）type=”checkbox” 多选勾选框；
（6）type=”submit” 提交按钮；
（7）type=”reset” 重置按钮；
（8）type=”button”或者 两种方式都可以实现空按钮；
（9） 多行文本框，是一个双标签；
（10）
————————————————
版权声明：本文为CSDN博主「CAINIAOQIANDUAN」的原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/CAINIAOQIANDUAN/article/details/81591300
html基本标签用法：
<!DOCTYPE html>
<head>
设置html编码格式
<meta charset="utf-8">
<title>我的标题</title>
<meta http-equiv="content-type" content="text/html" charset="utf-8" />5s后转入百度首页
charset(编码):这个网页的编码是UTF-8,需要注意的是这个是网页内容的编码,而不是文件本身的.
编码不用说,content常见的还有xml等类型.meta,网页html语言里head区重要标签之一.
http-equiv类似于http的头部协议,他回应浏览器一些有用的信息,以帮助正确和精确地显示网页内容.
<!--
<meta http-equiv="refresh" content="5;URL=http://www.baidu.com "/>
-->
<meta name="author" content="zhangsan" />
<meta name="description" content="java" />
<meta name ="keywords" content ="java,music" />
</head>
<body>
<br />
<b>我是</b>
<br />
<strong>jiacu</strong>
<b><i>加粗斜体</i></b>
<font color="green" size =7>我是大爷</font>
<sup>上标</sup>
<sup>下标</sup>
<br />
显示真实格式
<pre>
public voidstatic haha
sysotem.out.println
}
</pre>
< 小括号
> 大括号
<hahah>
& &符号
图片：
<!--
图片标签是 img
属性 src 图片路劲
相对路劲
绝对路劲(网络路径)
height 高
width 宽
title 鼠标悬停的文本提示
alt 图片加载失败后的文字提示
\\ 双斜杠 第一个是转义符
/ win / linux 中反斜杠
-->
//回到上级目录有的是../ 我的是./
<img src="./img/timg.jpg" width="200px" height="200px" title="123类型"/>
<img src=" timg.jpg"width="200px" height="200px" title="乔碧萝类型" alt="乔"/>
多媒体标签插入视频
<!--
<embed src="./video/aa.mp4" autostart="true"
loop='true' hidden='false'
width="300px" height="300px" />
<video src="./video/aa.mp4" width="300px" height="300px" controls="controls"></video>
-->
//这个没搞定（网上获取视频链接有问题）-----------------------------------------------
<iframe height=498 width=510 src='http://player.youku.com/embed/XNDI5OTA2NjkyMA==' frameborder=0 'allowfullscreen'></iframe>
<iframe height="=500px" width="500px" src="https://vd4.bdstatic.com/mda-jg1guaxruq5jruz3/sc/mda-jg1guaxruq5jruz3.mp4?auth_key=1567166538-0-0-fd1839e97982763704d60c9adb120770&bcevod_channel=searchbox_feed&pd=bjh&abtest=all"></iframe>
<!--
a 连接标签
href 链接地址 (可以是本地 、网络)
target 属性
_blank 在一个新的窗口打开 （新建一个窗口）
_self 在本窗口打开(覆盖本窗口)
-->
<a href="http://www.baidu.com" target="_blank"> baidu </a>
<br />
锚链接: 点击 回到制定的锚点
<!--
锚链接: 点击 回到制定的锚点
设置锚点a中name的属性
-->
<a name ="myTop">top</a><br />
<img src="./img/HBuilder.png" width="400px" height="600px"/><br />
<img src="./img/HBuilder.png"width="400px" height="600px"/><br />
<a href="#myTop">回到锚点</a>//回到83行的位置 如果你想设置置顶的话 将往上数三行的锚点放在首行即可
其他基本的标签类：
列表标签：
<!--
描述：列表标签
-->
有序的列表：(A:显示ABC... 1:显示123...)
<ol type="1">
<li>benchi</li>
<li>benchi2</li>
<li>benchi3</li>
</ol>
无序列表
<ul>
<li>阿里巴巴</li>
<li>阿里巴巴</li>
</ul>
自定义列表
<dl>
<!--列表项-->
<dt>游戏部门</dt>
<dd>王者荣耀</dd>
<dd>lol</dd>
<dt>开发部门</dt>
<dd>java</dd>
<dd>python</dd>
</dl>
效果图：
table
<!--table 定义一个 表格
tr 行
td 列
border 边框
-->
<table border="1px" cellspacing="0px" width="300px" height="200px">
<tr align="center" >
<td>name</td>
<td>age</td>
<td>address</td>
</tr>
<tr valign="top">
<td>mr.ma</td>
<td>50</td>
<td>shenzhen</td>
</tr>
<tr>
<td>dinglei</td>
<td>45</td>
<td>wenzhou</td>
</tr>
</table>
注意：这里只有第一行的数据是居中的 第二行的数据是顶格写的
表格的合并
colspan是列合并（成躺着的长方形） rowspan是行合并（站着的长方形）
cols：长 rows宽
//目标：将第一行的前两个合并（列合并），将第二行的第一列和第三行的第一列合并（行合并），将最后的小正方形合并
colspan是列合并（成躺着的长方形） rowspan是行合并（站着的长方形）
<table border="1px" width="400px" height="300px" cellspacing="0px">
<tr>
<td colspan="2">1.1</td>
<td>1.3</td>
<td>1.4</td>
</tr>
<tr>
<td rowspan="2">2.1</td>
<td>2.2</td>
<td>2.3</td>
<td>2.4</td>
</tr>
<tr>
<td>3.2</td>
<td colspan="2" rowspan="2"> 3.3</td>
</tr>
<tr>
<td>4.1</td>
<td>4.2</td>
</tr>
</table>
formeset展示网页：
（将三个网页同时系那是在一个页面上，设置中间的页面占比为60%，上下面的页面占20%）
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>frameset 标签的使用</title>
</head>
<frameset rows="20%,60%,20%">
<!--三个模块,展示三个网页在该页面上-->
<!--head-->
<frame src="upmp4.html" name="head"/>
<!--body-->
<frame src="index.html" name="body" />
<!--foot-->
<frame src="foot.html" name="foot"/>
</frameset>
</html>
简单的表单提交（重要）
<form>
username:<input type="text" name="username" value="axing" placeholder="请输入"/>
pwd:<input type="password" />
<br />
pwd:<input type="hidden" />
</form>
用户名栏默认有axing 当删除后显示请输入
隐藏域：pwd
在form表单中：
<input type="file" />
<input type="button" value="按钮"/>
综合案例：
<!--以 k -v形式 把数据提交到 制定的 action 中
name属性是 数据提交的k
value 属性是 输入框的值
type text 文本输入
password 密码
hidden 隐藏
file 文件
submit 提交 默认有提交 文本
button
单选按钮: radio 需要给 name 分组属性
checked 选中
没有给value属性 提交的是 on 需要给value属性
多选 checkbox
下拉框:
select 下面有选择框 option
selected选中
多行文本:
textarea
-->
一般用于提交会有三个属性： type name value
<form>
username:<input type="text" name="username" value="axing" placeholder="请输入"/>
pwd:<input type="password" />
<br />
pwd:<input type="hidden" />
<br />
<br />
<br />
默认选择了男<br />
性别：
<input type="radio" name="sex" value="nan" checked="checked" />男
<input type="radio" name="sex" value="nv" />女<br />
爱好：
<input type="checkbox" name="fa" value="movie" />movie
<input type="checkbox" name="fa" value="read" />read
<input type="checkbox" name="fa" value="demo" checked="checked" />demo
<br />
家乡：
<select name="localtion">
<option value="qqhe">qiqihaer</option>
<option value="wh">wuhan</option>
<option value="xian">xian</option>
</select>
<br />
<br />
个人说明：
<!--
描述：rows宽 cols长
-->
<textarea rows="6" cols="40"></textarea> <br /><br />
<br />
<!--
选择文件：<input type="file" />
input的按钮是无效的按钮
<button>有效按钮</button>这个是有效的
-->
<input type="button" value="无效按钮"/>
<button>有效按钮</button>
<input type="submit" />
<br />
<br />
</form>
扫一扫
467
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
