HTML-3-FORM了-WEB开发必须知道的

0201 js

table

<table>
</table>
bgcolor
border
bordercolor
bordercolorlight
bordercolordark
cellspacing
cellpadding
width
height

<tr>
</tr>
align
valign
bgcolor

<td>
</td>
width[用这个最好把<table>的width也设置一下]
height
align
valign
colspan
rowspan
nowrap

------
<caption></caption>标题 必须紧紧跟在 <table>后
<th></th>类似<td></td>就是黑体 居中而已
------

表可以 嵌入 表 等其他很多很多 元素
-------------
一个很少人知道的细节
在一个<td></td>里,
如果内容很长,它是不会拆分英文单词的,
如果一个单词10000个字母,他就把表格撑开,
遇到单词中间的 空格 '-' 等,它就会懂得拆分了.

当然,中文它不会考虑的,统统都是特殊字符,想怎么拆就怎么拆

如果我们不喜欢拆分 用nowrap属性就可以
这个属性不用设置值,写上就可以了
<td nowrap></td>

=========================
0202 js

frame

一般一个 窗口一个 HTML
用frame 可以 显示多个

而且每一个都是独立的
单独改变而不影响其他 frame

这个frame用的好的话,可以类似 *.chm文件
在一个 窗口里 显示 目录,旁边的窗口 显示 内容,
看上去很舒服

多个frame 组成 frameset

上 左 右 其实有四个文件,还有一个主文件的
主文件里再调用 其他三个HTML

----------
index.html :
<frameset rows="20%,*">
    <frame src="top.html" name="top">
    <frameset cols="30%,*">
       <frame src="left.html" name="left"
       <frame src="right1.html" name="right">
     </frameset>
</frameset>

要在left 目录里加name[用target]的东西
target 有四个内定 属性
_blank新的空的,不能控制什么,因为没有秒称
_self源网页窗口里显示[默认值]
_parent 当前frame的 父frame
_top 最顶层窗口
后面两个都需要在 frame 里才有效!!


<a href="xxx.html" target="right"></a>


记得用frame 就不要用 body了
他们两个不可以一起用

<noframes></noframes>
上面的标签里可以写 body
再往里面写些东西,可以显示出来
因为有些IE不支持frame
它忽略了frame
但是它认识 <noframes>
所以把里面的东西显示出来了

还有一个 tag iframe
可以显示 画中画的效果

<a href="http://www.xx.com target="iframe1">xx</a>

<iframe src="top.html" name="iframe1" frameborder="0">
</iframe>
效果不错的,早知道在以前的老公司用这个上网了
最好设置一下 frameborder="0" 隐藏的更好

这些都可以用VS来做
=============================
0203 js

form-1

最最重要的东西

<form></form>
这个里,最最起码要有一个submit
然后,还要有其他 元素
其他元素必须要有name属性
没有name属性的 元素 是不会被提交的
★submit 按牛的 name 属性就可以免了,你传过去干什么呢??
浪费资源??

还有,元素的 value 值我们也可以写好的 网页里
<input type=text name="name" value="bb" />
这时候,打开网页就可以看见 bb 了,
★这是[初始默认值],你一改,就改了
不改,就传 初始默认值 了,
当然name一定要有,否则不传,不知道怎么传啊

--------
IE有个好 功能 好让我们看 特殊字符的URL编码
写个最最简单的<form>
一个text
一个submit
GET方式
在text里写上 中文,提交,可以在IE地址栏里看到URL编码了
[但是GET传数据不可以>1K]

post传数据 很大,但是看不见

<form 也有target属性,用来说明你数据返回后在哪里显示
title 属性 任意表单元素上 停留 黄小浮标出现

enctype:
application/x-www-form-urlendoded[default]
multipart/form-data


--------------------
下面一个一个说说 表单 元素
1★<input type="submit">
这个其实功能很多
1 通常就不要设置name了,提交了也不用[value显示要设一下]
2 如果要用,可以设置name value值
3 如果要 save active
   完全可以设置多个[几百个都没有关系]
   每个都弄好name value
   这个 元素很特殊,只有点击的那个才会过去,不点的
   N-1 个是不过去的
   这样就可以判断user点的哪个了!!!

2★<input type="reset" >
把一起的所有 元素 设置为 初始默认值
这个 元素 怎么也不会被传到WWWserver的

3★ <input type="text" name="name" value="bb" size="5">
单行文本输入框
size 是字符个数
maxlength=5 最多让输入几个
readonly 可以获得focus 但是不可以改[JS可以改变它]
          提交的时候,会提交值
disabled 不可以获得focus,就当是这个 元素不存在了
         提交的时候,也不会提交了

4★<input type="checkbox"> 复选框 [和边上文字没有关系的]
属性 checked 初始状态的设置
这个元素如果不选 , 就相当于不存在这个元素
name肯定要设置,不设置怎么都不会提交
value值可以不设置,默认是'on'
也可以自己设置value值,设置了就传设置的值了

<input type="checkbox" name="chk1">

5★<input type="radio"> 单选按牛[和边上文字没有关系的]
属性 checked 初始状态的设置
这个话都是 一组一组的,而且要把name都弄一样才有意思
IE只允许一个name对应一个value,所以就有单选按牛的效果了

注意,一组的每个 单选按牛的值 肯定要设置不一样,★
这样就可以有 同一个name 不同的value的效果了

6★★<input type="hidden">
很多人特别喜欢用
这个不会任何显示
但是 提交 会把这个东西提交

7★<input type="password">
这个就是text 只是显示为 * 号而已
其他都一样的

8★<input type="button">
这要和JS连用的
这个没有 submit reset 按牛的功能
============================
0203 js

form-2

★2-1
<input type="file" name="file1">
这是上传东西的
有一个text 一个button

普通submit
只是提交一个 mane 和 文件路径名称,文件实体不上传
要上传:
必须:
<form action="" method="post"
enctype="multypart/form-data"

这样实体内容也可以上去了

★2-2
<input type="image" name=map src="pic.gif">
这个是图片代替 提交 按牛了
所有的元素都会提交
★还会多两个值:
两个坐标:
map.x=102&map.y=
map是name里的,xy是内定的,用点隔开

★2-3
<select ></select > 属性size 看得见的数目 默认1
multiple 是不是可以多选
<option></otion>
      属性 value selected
       value不写就把<option></otion>显示的值传过去★
         name 是参照<select ></select > 里的

<option></otion> 里的第一条 通常是
<option value="">--no chioce--</otion>
否则user一旦选了,就只能选一个了

----下面是设置了multiple 后多选的结果
可以看到,连第一个空的都选了[希望可以明白我的意思]
temp.html?gx=&gx=1&gx=2&gx=3&gx=4
---还是把source 贴一下吧
<form action="" >
<select name="gx" size=3 multiple >
<option value="">--no choice--</option>
<option value="1">hb</option>
<option value="2">mxy</option>
<option value="3">hyh</option>
<option value="4">hyr</option>

</select>

<input type="submit" value="submit">
---------over

★2-4
<textarea></textarea>
多行文本的输入框
cols rows [字符个数为单位的]

<textarea name="suggestion" cols="20" rows="5">
这里就是value值了
</textarea>

还有好玩的,做个类似WINDOW的 alt+xxx
username(n):
就是alt+n就focus到
password(p):

-----
<form action="" >
<label for="usr" accesskey="a">username(<u>a</u>):</label>
<input type="text" name="user" id="usr"><br>
<label for="pas" accesskey="b">password(<u>b</u>):</label>
<input type="password" name="pass" id="pas"><br>


<input type="submit" value="submit">
---------------不错不错!!
user 会非常喜欢的

所有 表单元素都必须和WWW 服务器交互 才有意义
==============================
0205 js

<meta> tag [最好放head里]

<meta>标签要知道的只有二种name  http-equiv
content是补充说明

<meta name="某个设置值" content="对该值补充说明"/>
<meta http-equiv="某个设置值" content="对该值补充说明"/>

name属性主要用来 描述网页信息
     关键字[供机器人查找，等]

http-equiv属性用于在HTML中模拟HTTP协议响应消息头,
e.g. 告诉浏览器是否缓存该网页
使用什么样的字符集来显示网页内容
隔开多长时间来自动刷新网页等

这个只是模拟,WWW返回的东西不仅仅是网页,
除了网页还有其他东西,
其他东西查看源文件是看不到的
其他东西也很难人为去设置
所以,用这个模拟一下,反正效果也有的

好,看name的详细东西:
1★keywords 给机器人[搜索引擎]用的
e.g. <meta name="keywords" content="hb,java,ajxa">
注意,后面都是 content 内容,详细说明,这个名字非常好

2★description 给机器人[搜索引擎]用的
有这个显示这个,没有显示网页开头的东西

3★robots
这时,content 设置值可以为
index[让你机器人检索我]
noindex[不让,浏览次数10,有可能5次是机器人]
follow[让机器人顺着这网页中的URL往下去]
nofollow
all[让你顺,让你搜索]
none[机器人别来了,私有的东西,不乐意共享]

4★generator

5★author

6★copyright

好,不玩无聊的了
玩好玩的:
http-equiv

IE看见了,会用处理HTTP协议信息头的处理方式一样处理此网页
信息头非常多
所以这个属性的也非常多,
高级人员要好好玩玩,一般的看懂即可

★1
Content-Type[还有大写的,上面也不知道对不对了,问IDE吧,懒得记]
mime类型
用什么字符集显示
e.g.
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>



★2
Refresh [告诉IE隔多少时间刷新一下,或者跳哪里去!]

<meta http-equiv="Refresh" content="1">隔一秒刷新一下
<meta http-equiv="Refresh" content="1;url='http://www.g.cn'">隔一秒跳GOOGLE去
[上面一条可以 恶作剧哦,所以要把 特殊 符号屏蔽掉]

★3
Expires
设置网页到期时间
[有时候IE不会去访问WWW,而去访问内存缓存]
<meta http-equiv="Expires" content="Mon,12 May 2001 00:00:33 GMT"/>
如果设置0,就不缓存了

★4
Windows-Target
可以防止自己的网页被人当一个frame调用,
<meta http-equiv="Windows-Target" content="_top"/>
告诉IE,你给我在最外的窗口显示我!!!

★5
Pragma
可以禁止IE缓存此页
<meta http-equiv="Pragma" content="no-cache">

有更新的了,用这个更好
<meta http-equiv="Cache-Control" content="no-cache">

★6
Page-Enter & Page-Exit
用于设置进入此页 或者 推出此页 的一些视觉效果
什么 百叶窗之类的,
花哨的
<meta http-equiv="Page-Enter" 
content="revealTrans(Transition=23,Duration=1.000)"/>

把23改改,看看多种花样[browers的版本有很大因素]
8好看
10
12 最好看
21 也不错
22

要看到效果,还有配合JS CSS的

================================

0206 js

<head> tag

刚刚还说了
<meta>最好放<head>里
那么<head>里还有哪些东西呢???
<title></title> //不用说
<base>
<link>
<meta>

都是说明文档信息的

<base>指所有网页里的 基准地址 主要改变网页里相对URL地址的
有两个属性 href target
一般是这样些的
<base href="http://www.xx.com/fold" target="_blank"/>

这时,如果网页里有<a href="index.html">cc</a>
不会再去找当然网页目录下的index.html,
而是指向了:
http://www.xx.com/fold/index.html

其中的target属性是说,统统给我在新窗口里打开,
省得每次写 URL 都写target属性了

base里页可以单单使用target,告诉IE这页的所有URL都用新窗口
[脑子要活!!!不是一定要指定href]

那么这个base到底有什么实用性呢??
你们肯定是想不出的

大家都知道,在网站上,一般都是相对路径,不会用绝对的
好,
现在有人把一个网页保存下来了,保存的本地DISK
然后它打开,由于是相对的,点里面的URL时,IE会去本地DISK上找,
当然是找不到的,如果给了这个BASE,就可以去WWW上找了,
就可以找到要的内容了

<link>
定义某文档 和另一文档 或者 资源的关联
href[必要的]
rel
rev
[必须二选一][此文档 和另一文档的关系]
title[可是关系,可是描述关系,没有最好,可有可无]
type[目标资源的MIME类型]
    type="text/css" type="text/javascript"
    type="text/html"
     type="image/jpeg"

media [指定此网页输出到什么 煤体上 才用你的资源]
         计算机屏幕
打印机

screen[默认] print projection aural braille[xiazi] tty tv all

rel
连接源是当前稳当定义的
这时的href指 连接目标[此文档要用你]

rev
连接源是当前稳当定义的
这时的href指 连接源[我供你们用,好象就是这样]W3C去吧

这个rel rev 属性非常多,有两个记得一下就好了
stylesheet
<link rel="stylesheet" type="text/css" href="url">

shortcut icon
<link rel="shortcut icon" href="favicon.ico">
16*16 pix

============================
0207 js

<div> tag

<div></div>
<span></span>

这两个东西都懒得说了