var sogou_ad_id=731545;
var sogou_ad_height=90;
var sogou_ad_width=980;.NET开发（9）
&& (1).简单介绍
HTML(HyperText&Markup&Language)就是描述网页长什么样子、有什么内容的一个文本。查看网页的描述内容（HTML）的方式：使用IE浏览器的话，在网页上点击右键，选择“查看源文件”。HTML之所以能展现出各种各样的效果，是浏览器的功能。
浏览器兼容性问题：描述文件是一个统一的，但是就像口语翻译一样，不同的翻译翻译出来的东西也是不一样的。不同浏览器品牌对HTML的支持是有差异的，所以同一个网页在IE上和FireFox上看起来可能长得不一样，最明显的就是以前QQ空间上的页面在FireFox上显示就有问题，甚至有的页面在IE6、IE7、IE8上长的也不一样。因此Web开发过程中的一个重要的也是最头疼的问题就是浏览器的兼容。测试FireFox（简称FF）、Chrome等浏览器安装各自的软件就可以，测试不同版本的IE可以用IETester、IECollection(使用IE
Collection浏览页面时，最好通过http://的方式浏览，否则部分版本浏览器会报错。)
CSS、JavaScript都存在浏览器兼容问题，CSS尤甚，我们只考虑JS的兼容。
&&(2).页面的类型
网站页面分为静态页面（请求资源直接返回）和动态页面（先执行代码再返回）两种
静态页面：后缀名为html或htm都是静态页面。有一个html页面文件保存在服务器上，浏览器要这个页面的时候服务器就把这个页面文件发给浏览器；
动态页面：动态页面中会包括一些脚本代码。服务器上没有浏览者要看的页面，而是服务器动态生成的HTML页面发给浏览器，动态语言的服务器端可以用C#、VB.Net、PHP、Java、C等编写。
htm、html都是静态页面，asp、aspx、jsp、php等都是动态页面
(3).访问一个网页，永远都是请求与响应
(4).HTML结构说明
&& 所有内容都在&html&&/html&标签之内；&head&&/head&内放的是头部信息，是对页面的描述，不会直接显示在页面中，&head&内的&title&中设置的是页面的标题，&title&只能放在&head&中；&body&是页面的主体，大部分显示内容都定义在这里。
所有页面都应该至少包含这些部分，由于浏览器容错性强，所以即使不包含也能正常显示，但是最好还是写完全了。
HTML注释：&!--&& --&&。
易错：title标签的结束标签，如果忘记 / ,则整个页面都不显示。
注意：title中的文字内容要有意义，不要写成&欢迎光临&、&我的网站&、...之类的文字，title中的文字必须是对本页面内容的准确描述。在SEO中title有重要作用、加入收藏夹等也会用到title中的内容。
（5）.颜色体系
& 计算机中的颜色：红、绿、蓝三种颜色组成。
body标签的bgcolor属性可以设定网页的背景颜色。
bgcolor的取值可以是英文单词red、blue、yellow……，也可以是十六进制的颜色#00FF69、#23AEFF。(#000000黑色、#FFFFFF白色)。
#00FF69这就是HTML中表示颜色的方式，每两个是一组，三组分别就表示R、G、B的值，是16进制表示。关于RGB见备注1。
取色工具：ColorPic、PicPick、VS自带的颜色选择对话框、FastStone Capture。 （见备注2）
（*）知道即可：bgcolor=“rgb(10,125,200)”或bgcolor=“rgb(10%,125%,20%)”也可以但存在浏览器兼容性问题FF、Opera、Chrome不支持
二：基本语句（乱码的原因存储的形式不对，另存为一下下啦）
(1).基本网页结构
&&&&& &&html&
&&&&&& &head&
&&&&&&&&&&&&& &&& &&&&&title&洋仔的第一个网页&/title&
&&&&&& &/head&
&&&&&& &body&
&&&&&& &&&& &&&& &h1&哈哈&/h1&
&&&&&& &/body&
(2).注释语句
&&&&&&!--哈阿文--&
(3).为网页添加背景的属性（要加双引号）颜色的英文对应即可
&&&& &html&
&&&&&& &head&
&&&&&&&&&&&&& &title&洋仔的第一个网页&/title&
&&&&&& &/head&
&&&&&& &bodybgcolor=&yellow&&&!--在body后面加颜色属性，最好用双引号--&
&&&&&& &&&&&&&& &&&& &h1&哈哈&/h1&
&&&&&& &/body&
&bodybgcolor=&#ff0000&&&!-- 用16进制表示颜色，前加#号才可，ff为255，00，00表示的为红色 --&//用这个方法可以配出所有颜色，若想使用不知名颜色，用屏幕取色器找到所对应得16禁止数即可
&&&&&&(4).计算机的三原色：rgb&&red green blue
&&&&&&(5).方向&
&&&&&&&&&&&&&&&& 上，中，下：top,middle,bottom
&&&&&&&&&&&&&&&& 左，中，右：left,center,right
三：doctype(声明，文档类型的意思)
&& 1.简介：
&doctype介绍：doctype的由来，主要是因为html有不同的版本，不同浏览器对html解析也不尽相同。用来告诉浏览器应该按照html那个版本来解析当前html页面并显示。html草图、html+、html2.0、html3.2、html4.0、html4.01、xhtml1.0、....、html5。
doctype声明，DocumentType的缩写，一般放在第一行内容，最好是所有的回车、换行、空格等之前。因为HTML也有很多的版本，而doctype的作用就是告诉浏览器当前使用html的版本。浏览器可以基于此信息决定如何在屏幕中呈现各种信息。
建议所有的页面都是用doctype来标记，否则不同的浏览器默认展示html的方式可能不同。
doctype无需记忆，完整列表：http://www.w3.org/qa/2002/04/valid-dtd-list.html
&& 2.代码：(在每个代码的最前面加上)
&&&&&&&&文档类型定义：&!DOCTYPE html PUBLIC&-//W3C//DTD XHTML 1.0 Transitional//EN& &http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd&&
指明当前的html页面是符合某种规范的。类似于各种合同书上面注明当前条款是根据国家某某法律规定来制定的。
doctype的主要作用是告诉浏览器或其他软件当前页面所使用的语言版本信息，以便更精准的解析与呈现页面。
四：XML与HTML
html与xml相同点：
都是标记语言、注释都是：&!--&&& 内容、内容&&& --&
都可以通过dom编程方式来访问
都可以通过CSS来改变外观
html与xml的不同点：
&xml语法要求更严格。
有开始标签必须有结束标签、大小写一致、属性用双引号等。
xml侧重于数据存储，html侧重于数据展示。趋势：数据存储与数据表现相分离(html中只有要显示的页面内容，样式都有CSS来控制,html页面中不再有&font&等标签，控制样式都用CSS)。
五：发展趋势
&xhtml：可扩展超文本置标语言（eXtensible&HyperText&Markup&Language，XHTML），更符合xml语法规范的html。xhtml的出现主要是为了向xml过度，通过xml+css也能实现很好的页面。【xhtml要求：全部小写、有开始结束标签、属性用双引号】
dhtml： Dynamic HTML的简称，就是动态的html。 HTML、样式表和JavaScript的组合
六：HTML常用标签
&& 1.简介：
&h标签（标题），HTML定义了&h1&&/h1&到&h6&&/h6&六个h标签，分别表示不同大小的字体。h1最大，h6最小。
&br/&只是回车，&p&是分段。&p&前后会有比较大的空白，而&br/&则没有。
&center&传智播客&/center&居中显示.
&b&a&/b&粗体，推荐&strong&。&i&b&/i&斜体。&u&c&/u&带下划线。&em&强调，斜体&/em&
&sub&2&/sub&下标，如：H&sub&2&/sub&O
&sup&2&/sup&上标，如：10&sup&2&/sup&
&font&&/font&字体标签，&font color=“red“ size=“7” face=“隶书”&红色&/font&。color（设置颜色）& size（1-7）& face（设置字体,设置字体是注意用户计算机中必须有该字体才能正常显示）
&hr& &color&size（厚度）&width（长度）&align=left/center/right （默认为剧中显示）
&pre& 预格式化& 保持本色&
&& 2。代码
&&&& &body&
&&&&&& &!--center居中标签，写在center内部的都居中--&
&&&&&& &center&
&&&&&&&&&&&&& &!--h1-6变大标签越来越小 --&
&&&&&&&&&&&&& &h2&中华人民共和国&/h2&
&&&&&&&&&&&&& &h5&中华人民共和国&/h5&
&&&&&&&&&&&&& &h6&中华人民共和国&/h6&
&&&&&&&&&&&&& &!--p段落标签paragraph，上下距离大 --&
&&&&&&&&&&&&& &p&床前明月光&/p&
&&&&&&&&&&&&& &p&疑是地上霜&/p&
&&&&&&&&&&&&& &p&==============&/p&
&&&&&&&&&&&&& &!--/br自关闭段落标签，上下没有距离 --&
&&&&&&&&&&&&& 床前明月光&/br&
&&&&&&&&&&&&& 疑是地上霜&/br&
&&&&&&&&&&&&& &!--strong加粗强调标签 --&
&&&&&&&&&&&&& &strong&哈哈哈&/strong&
&&&&&&&&&&&&& &!--b仅加粗标签，不常用 --&
&&&&&&&&&&&&& &b&嘿嘿嘿&/b&
&&&&&& &/center&
&&&&&&&&&&&&& &!--斜体标签，em即强盗又斜体推荐，i仅斜体 --&
&&&&&&&&&&&&& &em&加油！&/em&
&&&&&&&&&&&&& &i&好滴&/i&
&&&&&&&&&&&&& &!--u下划线标签 --&
&&&&&&&&&&&&& &u&李洋样&/u&
&&&&&&&&&&&&& &!--sub下标标签sup上标标签 --&
&&&&&&&&&&&&& 10&sup&2&/sup&&!--10的平方 --&
&&&&&&&&&&&&& H&sub&2&/sub&O&!--水的化学式 --&
&&&&&&&&&&&&& &!--font对字体进行设置的标签 --&
&&&&&&&&&&&&& &!--有三大常用属性，颜色，尺寸1-7小到大，字体 --&
&&&&&&&&&&&&& 大家好！我是&font color=&red& size=&7& face=&宋体&&李阳&/font&
&&&&&&&&&&&&& &!--hr自关闭分割线标签,斜线在后面，有三大属性长度，宽度，颜色,对齐方式--&
&&&&&&&&&&&&& &p&窗前买那个月光&/p&&&
&&&&&&&&&&&&& &hrwidth=“300” size=“10” color=“blue” align=&left&/&
&&&&&&&&&&&&& &!--pre预格式化标签 --&
&&&&&&&&&&&&& &!--在HTML中，没有预格式化时，许多空格和换行在显示时都会变为一个空格 --&
&&&&&&&&&&&&& &!--加上预格式化后，会原样显示 --&
&&&&&&&&&&&&& &pre&
&&&&&&&&&&&&& 你好&& 啊！& 还 可&&& 以哈。
&&&&&&&&&&&&& &&& 嗯嗯& ！
&&&&&&&&&&&&& &/pre&
&&&&&& &/body&
&&&&&&&在编写html页面选用标签时，要根据语义来选用标签。比如：本来应该是一个列表项就用ul或ol，而不要用&br/&；本来需要&h1&标签的地方不能为了让字变小点而是用&h3&,而因该是用css来控制大小。尽量避免使用&font&、&b&、&i&等只用来修改展示样式的标签，使用更具有语义的标签+CSS样式。
如果明明设置了字体，但是就是在客户计算机上不显示，可能是客户的计算机没有安装对应的字体。字体的文件夹在：C:\WINDOWS\Fonts
如果没有安装则拷贝一个进去就可以了
七:html编码（特殊符号）
用于显示一些特殊字符，有特殊含义的(&、&)以及键盘上无法输入的字符。
HTML编码以&开头，以;结尾。
在网页上显示hello&welcome&China，hello&welcome&China
特殊字符：HTML中&、&是有特殊含义的、空格是不会被显示的（输入一个带空格的字符串看看），所以需要特殊符号，相当于C#中的‘\n’转义符。&（小于号，less than）；&（大于号，greater than）；&（空格，Nonbreaking space ）。见备注。
上网搜：ISO Latin-1 Character Set 或ISO Latin-1 字符集，查看所有。
& 2.几种特殊符号的表示
&& &&&&→ &
& 就是 &的“转义符”。
HTML不把“ ”当成空格，因为HTML中经常有缩进，如果把缩进的空格在浏览器中以空格形式展现的话，排版会很麻烦。“&”表示空格。
为什么&&要用&&代替？就是因为&&有特殊含义：标签的定义。
常用的几个html编码：
空格& &
&& 3.简单代码;
&&&& &body&
&&&&&& &&& &!-- html特殊字符--&
&&&&&& &&& &!--greater than大于号小于号 --&
&&&&&& &&& &p&a&b&c&/p&
&&&&&& &&& &!-- &地址符的转义--&
&&&&&& &&& &p&今天学了&表示小于号&/p&
&&&&&& &&& &!-- 版权符号 --&
&&&&&& &&& &p&&&/p&
&&&&&& &&& &!-- 空格，可以表示多个空格，若不用此东西，只会显示一个空格 --&
&&&&&& &&& &p&大家&&好&/p&
&&&&&& &&& &!-- 商标符号 --&
&&&&&& &&& &p&&&/p&
八：超链接
&& 1.简介;
&&&&&&URL：URL表示资源在网络中的地址，比如 http://127.0.0.1:80/html/pages/a.htm、ftp://192.168.88.128/b.zip。还有URI的概念，比URL大，有的类中使用URI这种说法，可以暂时看成和URL一样就行。
超级链接：&ahref=&&&如鹏网&/a&。
target属性的一些取值：
&&&&&& _blank:在新窗口中打开
&&&&&& _self:在自己的窗口中打开
&&&&&& _parent:父窗口中打开
&&&&&& _top:表示在顶级窗口打开
&&&&&& 框架名称：在指定框架中打开。
&&&&&&&&&自己给窗口起个名字：mywin,则此后凡是target=mywin的都在该窗口打开
a标签的一些常用属性：href、title、target、name（锚记时用）
&a&中还可以嵌套图片，这样就是点击图片打开连接&a href=&&&&imgsrc=&/forum/templates/uchome/images/logo.gif&/&&/a&
&相对URL：相对URL表示相对于当前文档的资源，“/”表示网站根目录，“../”表示父目录，“../../”表示父目录的父目录，“./”或者不写任何斜线表示相对于当前路径的目录。站内引用最好用相对URL，这样域名改变了、目录改变了都不受影响。&ahref=&a.htm&&&img src=&a.jpg&/&&/a&
&imgsrc=&../images/csharp1.jpg& /&
&img src=&/images/csharp1.jpg&/&
不要再出现c:\aa\aa.jpg这种绝对路径了。
将&a&的target属性设定为&_blank&就可以在新窗口中打开超链接。国情：国内的网站很多都是默认在新窗口中打开。
锚记（两种用法）：
1.用name属性为&a& 起名字：&aname=&Last&&这里是最后&/a&。这样可以通过&a href=&#Last&&转到平台&/a&来跳转到超链接的部分。
2.直接使用其他元素的Id作为锚。&a href=&#Id&&go to Id&/a&
3.连接到其他文档的某个部分直接href=&a.html#mao&
&& 3.简单代码;
&&& &body&
&&&&&& &!--a超链接 --&&&&&&&
&&&&&& &!--将原网页覆盖,target的默认值为self --&
&&&&&& &!--href为超文本引用的意思，Hypertext Reference的缩写 --&
&&&&&& &!--标签中间放什么都可以，文字，图片 --&
&&&&&& &!--网址必须加http --&
&&&&&& &ahref=&&&去百度啦&/a&
&&&&&& &ahref=&& target=&_self&&去百度啦&/a&
&&&&&& &!--未将原网页覆盖，新打开选项卡 --&
&&&&&& &!--target目标的意思，blank类、空白的意思 --&
&&&&&& &ahref=&& targrt=&_blank&&去百度啦&/a&
&&&&&& &!--当鼠标放在超链接上面时。弹出的提示用title，许多东西都是加一个title就可以显示提示了--&
&&&&&& &ahref=&& title=&百度一下，你就知道啦！&&去百度啦&/a&
&&&&&& &!--超链接为一个图片，img自关闭标签表示图片 --&
&&&&&& &!--src为所引用的该图片的路径，当在一个文件夹时，只写名字即可 --&
&&&&&& &!--alt表示当图片因为某种原因没显示时代替的文本 --&
&&&&&& &ahref=&&&
&&&&&&&&&&&&& &imgarc=code.PNG alt=&普通的图片&title=“Microsoft”/&
&&&&&& &/a&
&&&&&& &!--超链接寻找本地文件夹下的文件显示在网页上，需写清楚路径 --&
&&&&&& &ahref=&图片/code.PNG&&去找一个图片&/a&
&&&&&& &!--父目录../ --&
&&&&&& &ahref=&../code.PNG&&找图片&/a&
&&&&&& &!--！！在同一个页面内部超链接的使用 --&
&&&&&& &!--第一步，在要切换到的位置建立一个空超链接，起一个名字 --&
&&&&&& &!--第二步，在切换的位置，href引用到‘#名字 ’--&
&&&&&& &aname=&ZT&&&/a&&!-- 此语句写到回到的指定位置上--&
&&&&&& &ahref=&#ZT&&回到猪头位置&/a&
& 1.图片格式简单介绍：
&&&&&&web常用的3中图片格式介绍：
1&jpg:有损压缩，适合照片，带渐变色的图片。不建议反复将jpg图片”另存为“jpg,损失“不可恢复”。对于示意图、标识图等清晰的由线构成的图片显示不够精细。
2&gif:更适合示意图、标识图、公司logo等拥有较大单色的区域，但不适合照片，因为gif标准色只有256色。可透明。
3&png,最清晰，无损压缩。能处理多个级别的透明度，而gif只能打开、关闭透明度。PNG(Portable Network Graphics)的原名称为&可移植性网络图像&，是网上接受的最新图像文件格式。PNG能够提供长度比GIF小30%的无损压缩图像文件。它同时提供 24位和48位真彩色图像支持以及其他诸多技术性支持。由于PNG非常新，所以目前并不是所有的程序都可以用它来存储图像文件，但Photoshop可以处理PNG图像文件，也可以用PNG图像文件格式存储。
　&& 　优点：
　　&& PNG支持高级别无损耗压缩。
　　&& PNG支持 alpha 通道透明度。
　　&& PNG支持伽玛校正。
　　&& PNG支持交错。
　　&& PNG受最新的 Web 浏览器支持。
　　&& 缺点：
　&&&&较旧的浏览器和程序可能不支持 PNG 文件。
　　&& 作为 Internet 文件格式，与 JPEG 的有损耗压缩相比，PNG 提供的压缩量较少。
　　&& 作为 Internet 文件格式，PNG 对多图像文件或动画文件不提供任何支持。GIF 格式支持多图像文件和动画文件
&&imgsrc=“a.jpg” alt=&说明文字&/&注意图片是链接的，不是插入的，所以如果src指向的文件不存在了，就看不了了。alt属性为图片无法显示时的显示文本，鼠标方式去也会有悬浮提示“点击查看大图”；title用来显示当鼠标放到图片上时显示的文字；border属性指定边框，border=&0&不显示边框；width、height属性指定图片的显示大小，如果不指定则是图片的原始大小。（秒杀抢购，节约流量“设置不显示图片”）
最好指定width、height，哪怕是原始尺寸大小，因为如果不指定大小，图片会不占位置，图片下载后才调整大小，会造成页面很乱、降低效率。如果指定了width、height哪怕图片没有加载完成，也会先把位置占上。
如果网页上要显示小图（比如缩略图），不要仅仅是把大图设定一下width、height来缩小，因为仍然会下载大图，会使得加载速度很慢。要使用画图工具中的重新调整大小重新作一个小图，并另存为即可。
易错，不要以为把bmp后缀改为jpg就是改文件格式了！一定要另存为才可！
有很多小图标可能要使用，将他们做在一个大图片上，可以减少访问服务器次数，提高性能，用css将改显示的显示出来
注意：img一般情况下都要设置alt值，除非该图片仅仅用来装饰，没有实际意义，则可将alt=&&设置为空，但不能不设置alt。
浏览器每次遇到img则向服务器发送一次请求，除非img的src路径一样则用缓存。
3.简单代码：
&&& &&&&&!-- title后面跟什么就是什么，“”也会显示 --&
&&&&&&&&&&&&& &!--border 为边框的意思 --&
&&&&&&&&&&&&& &ahref=&&&
&&&&&&&&&&&&& &imgwidth=&300& size=&300& border=&0&src=&1.jpg& alt=&登陆界面& title=哈哈哈 &
&&&&&&&&&&&&& &/a&
px (Pixel)单位名称为像素，相对长度单位，像素（px）是相对于显示器屏幕分辨率而言的（随着屏幕分辨率而变化）,国内推荐； QQ截图也是使用PX作为长度宽度单位。
em单位名称为相对长度单位。相对于当前对象内文本的字体尺寸，国外使用比较多；如当前对行内文本的字体尺寸未被人为设置，则相对于浏览器的默认字体尺寸。行间距、宽度等，见备注。
&5.简单代码：
&&& &&&&&&!-- 20px为20像素，5em为20px的五倍 --&
&&&&&&&&&&&&& &!--一个整体用；来连接 --&
&&&&&&&&&&&&& &divstyle=&font-size:20boder:2height:5em&&中国你好&/div&
十：列表（嵌套重要）
&& 1.简介：
dl→definition list(定义列表)，见代码
一般可用于名词解释之类。类似于“字典”
ul→unordered list(无序列表)，注意多个ul嵌套时的写法。见代码
ol→ordered list(有序列表)，见代码
用嵌套ul或ol来模拟二级菜单。见代码
&ol&与&ul&都有一个type属性，用来设置序列的显示样式。type属性（十分重要）的取值可以是：A、a、1、i、I、disc、circle、square。(可用CSS控制ul、ol的type样式)
&& 2.代码：
&&&& &&&& &!-- 定义列表(definelist)：dl dt dd为一个词后面跟解释的意思，下面这种形状 --&
&&&&&&&&&&&&& &!--中国 --&
&&&&&&&&&&&&& &!--&&&&& 很美的啦啊啦啦啦 --&
&&&&&&&&&&&&& &dl&
&&&&&&&&&&&&&&&&&&&& &dt&中国&/dt&
&&&&&&&&&&&&&&&&&&&& &dd&很美的啦啊啦啦啦&/dd&
&&&&&&&&&&&&&&&&&&&& &dt&菏泽&/dt&
&&&&&&&&&&&&&&&&&&&& &dd&很赞哈哈哈哈哈哈&/dd&
&&&&&&&&&&&&& &/dl&
&&&&&&&&&&&&& &!--无序列表(unorder list)ul 有无序都是li--&
&&&&&&&&&&&&& &!--type属性为改变列表前面标志 --&
&&&&&&&&&&&&& &ultype=&square&&
&&&&&&&&&&&&&&&&&&&& &li&你&/li&
&&&&&&&&&&&&&&&&&&&& &li&好&/li&
&&&&&&&&&&&&&&&&&&&& &li&啊&/li&
&&&&&&&&&&&&& &/ul&
&&&&&&&&&&&&& &!--有序列表:(order list) --&
&&&&&&&&&&&&& &!--type属性会改变排序所用类型，数字，罗马字。。 --&
&&&&&&&&&&&&& &oltype=&a&&
&&&&&&&&&&&&&&&&&&&& &li&起床&/li&
&&&&&&&&&&&&&&&&&&&& &li&吃饭&/li&
&&&&&&&&&&&&& &/ol&
&&&&&&&&&&&&& &!--嵌套一个 --&
&&&&&&&&&&&&& &dl&
&&&&&&&&&&&&&&&&&&&& &dt&中国&/dt&
&&&&&&&&&&&&&&&&&&&& &dd&描述一下：
&&&&&&&&&&&&&&&&&&&&&&&&&&& &oltype=&I&&
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& &li&人美&/li&
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& &li&物美&/li&
&&&&&&&&&&&&&&&&&&&&&&&&&&& &/ol&
&&&&&&&&&&&&&&&&&&&& &/dd&
&&&&&&&&&&&&&&&&&&&& &dd&
&&&&&&&&&&&&&&&&&&&&&&&&&&& &ul&
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& &li&哈哈&/li&
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& &li&嘿嘿&/li&
&&&&&&&&&&&&&&&&&&&&&&&&&&& &/ul&
&&&&&&&&&&&&&&&&&&&& &/dd&
&&&&&&&&&&&&& &/dl&
十一：表格
表格：&table&&/table&为表格，在内部通过&tr&（trade）创建行，&tr&内部通过&td&() 创建单元格。可以将table的border属性设为0来隐藏表格线，平常都将其设置为1。演示表格。
cellpadding（填充）、cellspacing（间距）。这两个属性都是属于table标签的属性。见备注1.cellpadding：用来统一设置表格中每个单元格的填充大小。cellspacing：用来统一设置表格中每个单元格与单元格之间的间距。
&tr&的属性：align，水平对齐，可选值left、right、center；valign，垂直对齐，可选值top、middle、bottom。
&td&也有align和valign。&tralign=&right&&&td&tom&/td&&tdalign=&left&&20&/td&&td&男&/td&&/tr&：子标签默认继承父标签的属性，如果自己单独指定了属性，则会覆盖父标签的属性。
还可以使用rowspan(合并行)、colspan（和并列）进行单元格的合并。rowspan、colspan是td的属性。Span为跨度的意思，注意合并后将多余的删除
一个完整的表格。table、caption、thead、tbody、tfoot、tr、th、td。见备注2. (查找vs2008msdn(目录-web开发-))
&&&&2.代码：
&&& &&&&&&&&&&&&& &!—不是说所有的表格都要有这几部分，可以只有body部分&
&&&&&&&&&&&&& &!--创建表table,thead,tbody,tfoot完整表--&
&&&&&&&&&&&&& &!--结合上述描述观看哈 --&
&&&&&&&&&&&&& &tableborder=1 width=300 cellpadding=5 cellspacing=5&
&&&&&&&&&&&&&!-- caption在表格下方(或上方，默认)显示的内容，不在表格内 --&
&&&&&&&&&&&&&&&&&&&& &captionalign=”bottom”&A TEST TABLE&/caption&
&&&&&&&&&&&&&&&&&&&& &thead&
&&&&&&&&&&&&&&&&&&&&&&&&&&& &tr&
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& &thcolspan=2&信息统计表&/th&
&&&&&&&&&&&&&&&&&&&&&&&&&&& &/tr&
&&&&&&&&&&&&&&&&&&&&&&&&&&& &tr&
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& &th&姓名&/th&&&&& --th在哪个部分都可以使用，为居中和加粗
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& &th&年龄&/th&
&&&&&&&&&&&&&&&&&&&&&&&&&&& &/tr&
&&&&&&&&&&&&&&&&&&&& &/thead&
&&&&&&&&&&&&&&&&&&&& &tbody&
&&&&&&&&&&&&&&&&&&&&&&&&&&& &tralign=&center&&&td colspan=2 &个人信息统计表&/td&&/tr&
&&&&&&&&&&&&&&&&&&&&&&&&&&& &tr&&td&李阳&/td&&td&18&/td&&/tr&
&&&&&&&&&&&&&&&&&&&&&&&&&&& &tr&&tdrowspan=2&花花&/td&&td&19&/td&&/tr&
&&&&&&&&&&&&&&&&&&&&&&&&&&& &tr&&td&14&/td&&/tr&
&&&&&&&&&&&&&&&&&&&& &/tbody&
&&&&&&&&&&&&&&&&&&&& &tfoot&
&&&&&&&&&&&&&&&&&&&&&&&&&&& &tr&
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& &th&name&/th&
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& &th&age&/th&
&&&&&&&&&&&&&&&&&&&&&&&&&&& &/tr&
&&&&&&&&&&&&&&&&&&&& &/tfoot&
&&&&&&&&&&&&& &/table&
&&&&&& 3.登陆界面练习：
& &&&&&&&&&& &!-- from表单元素为将内部的数据提交，table表格元素为布局，两者嵌套使用 --&
&&&&&&&&&&&&& &formaction=&& method=&get&&
&&&&&&&&&&&&&&&&&&&& &!--用css来控制形式，不要用属性修改 --&
&&&&&&&&&&&&&&&&&&&& &tableborder=1 cellspacing=2 cellpadding=2&
&&&&&&&&&&&&&&&&&&&&&&&&&&& &tr&
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& &td&用户名：&/td&
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& &td&&inputtype=&text&/&&/td&
&&&&&&&&&&&&&&&&&&&&&&&&&&& &/tr&
&&&&&&&&&&&&&&&&&&&&&&&&&&& &tr&
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& &td&密码：&/td&
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& &td&&inputtype=&password&/&&/td&
&&&&&& &&&&&&&&&&&&&&&&&&&& &/tr&
&&&&&&&&&&&&&&&&&&&&&&&&&&& &tr&
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& &td&验证码：&/td&
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& &td&&input/&&img src=&code.PNG& size=20&&/td&
&&&&&&&&&&&&&&&&&&&&&&&&&&& &/tr&
&&&&&&&&&&&&&&&&&&&&&&&&&&& &tr&
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& &td&&/td&
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& &!--为了让人点击文字时就可以选定，用label标签for这个checkbox的id --&
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& &td&&inputtype=&checkbox& id=&chk&/&&labelfor=&chk&&记住密码&/label&&/td&
&&&&&&&&&&&&& &&&&&&&&&&&&& &/tr&
&&&&&&&&&&&&&&&&&&&&&&&&&&& &tr&
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& &td&&/td&
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& &!--重置按钮type为reset --&
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& &td&&inputtype=&submit& value=&登陆&&&input type=&reset& value=&重置&&&/td&
&&&&&&&&&&&&&&&&&&&&&&&&&&& &/tr&
&&&&&&&&&&&&&&&&&&&& &/table&
&&&&&&&&&&&&& &/form&
十二：表单元素
&& 1.能采集用户信息并将其提交到服务器的元素叫做表单元素，文本框，是或否按钮。。。表格不为表单元素
&& 2.网站表单与填表。
&form&标签为表单标签。如果要把数据提交到服务器，则需要将&input&、&textarea&、&select&等表单元素放到form中。
&input&是主要的表单元素，type的可选值：submit（提交按钮）、button（普通按钮）、checkbox（复选框）、file（文件选择框）、hidden（隐藏字段）、image（图片按钮）、password（密码框）、radio（单选按钮）、reset（重置按钮）、text（文本框）。&input type=&file&/&
&& 3.去银行里边开户，你需要到柜台去填一张表，然后递给银行工作人员，由银行工作人员根据你填的信息来进行后续的处理，你本人不能直接去操作银行的系统去自己开户。
对于网站同样是这样的原理：163邮箱注册来说，你在注册页面里也是填一张表：用了什么用户名、密码是什么。点击【注册账号】按钮以后，IE浏览器会将这个表格提交给163的后台服务器进行处理。表单一般要和服务端程序进行交互才能起作用，暂时不涉及服务端编程。
&form action=“url” method=“”enctype=“”&
method取值：post,get,put,delete
enctype取值：当上传文件时，需要设置为：multipart/form-data，并且 把method设置为post。
Enctype一般不需要手动设置。
& 4. form标签，该标签不能嵌套。
submit：点击submit按钮表单就会被提交给服务器，中文IE下默认按钮文本为“提交查询”，可以设置value属性修改按钮的显示文本
text：size属性为宽度，value为值，maxlength为可以输入的最大长度，readonly只读。&input type=&text&readonly/&（只写属性名，不写属性值）或者&inputtype=&text& readonly=&readonly& /&（推荐）
checkbox：checked属性表示是否被选中，&input type=&checkbox& checked /&或者&input type=&checkbox& checked=&checked&/&(推荐)checked、readonly等这种一个可选值的属性都可以省略属性值。
radio：相同name属性的为一只有组，不同radio设定不同的value值，这样通过取指定name的值就可以知道谁被选中了，不用单独的判断。【radio、checkbox一般控件都显示在文字之前。】
file：使用file，则form的enctype必须设置为multipart/form-data、method属性为POST（*）
image：使用src属性指定图片的地址，用来实现美化的“登录按钮”。用图片实现的submit按钮，同时提交了用户点击图片的坐标。
&& 5.get提交方式的特点：数据量小，能在地址栏看到，可以添加到书签中，搜索引擎一般用的都是get方式。
客户输入的数据要想发送的服务器必须使用表单（form）
=======================实现一个表单：============================
用户名（邮箱）
所在地：省---市
兴趣标签：多个checkbox（加groupbox效果）
提交，重置 【提交按钮可用image实现。】
&&6.select标签
用来创建类似于WinForm中的ComboBox或者ListBox
如果size属性大于1就是ListBox（size的值为显示出来的列表数量），否则就是ComboBox。&select& multiple&或者&select& multiple=&multiple&&（推荐），那么就是可以多选的ListBox。
select中的项是&option&，&option&北京&/option&还可以设定项的值&option value=&1&&北京&/option&。
将一个option设置为选中：&optionselected&333&/option&或者&optionselected=&selected&&333&/option&(推荐)就可以将这个项设定为选择项
如何实现“不选择”，添加一个&optionvalue=&-1&&--不选择--&option&，然后编程判断select选中的值如果是-1就认为是不选择。
select分组选项，可以使用optgroup对数据进行分组，分组本身不会被选择，无论对于下拉列表还是列表框都适用。见备注。
7.其他标签
&&&&&& &textarea&多行文本（也是表单元素）：&textarea&文本&/textarea&，cols=“50”、rows=“15”属性表示行数和列数。
&label&：在&inputtype=“text”&前可以写普通的文本来修饰，但是单击修饰文本的时候input并不会得到焦点，而用label则可以，for属性指定要修饰的控件的id，&label for=“txt1”&asdfad&/label&；”txt1”为被修饰的控件设置一个唯一的id。(label的accesskey=“r”属性指定快捷键，FF不支持)
&label for=&ma&&婚否&/label& &input id=&ma& type=&checkbox&/&
另一种写法，直接包含：&label &婚否：&input type=&checkbox& /&&/label&
fieldset：GroupBox效果，将控件划分一个区域，看起来更规整
&fieldset style=“设置样式”&
&&&&legend&常用&/legend&
&&&&input type=&text& /&
&/fieldset&
submit(提交)、reset(恢复为默认值)
*滚动文字 &marquee&（知道就行）
*播放声音（dw中添加媒体→插件）、显示flash，见备注
& &&&&&&direction:left、right、up、down &&&
behavior:scroll、slide、alternate
scrolldelay:滚动的速度。单位为毫秒数，默认为85。
&&& &&&--&
&& &&&&marqueedirection=&left& behavior=&alternate& scrolldelay=&1&&
&& 8.在网页嵌入一段MP3,只需将地址修改即可
&&&&&& &&&&&& &!-- loop是否循环播放 autostart是否自动启动 name名字 宽度和长度 --&
&&&&&&&&&&&&& &embedsrc=&coder.mp3& loop=&true& autostart=&true& name=&bgss&width=&460& height=&40&/&
&& 9.插入flash
&&&&&&&&&&&&& &!-- 插入flash，只要修改两个地址即可，在01的位置 --&
&&&&&&&&&&&&& &objectclassid=&clsid:D27CDB6E-AE6D-11cf-96B8-&codebase=&/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0&width=&760& height=&700&&
&&&&&&&&&&&&& &paramname=&movie& value=&01.swf& /&
&&&&&&&&&&&&& &paramname=&quality& value=&high& /&
&&&&&&&&&&&&& &embedsrc=&01.swf& quality=&high&pluginspage=&/go/getflashplayer&type=&application/x-shockwave-flash& width=&760&height=&700&&&/embed&
&&&&&&&&&&&&& &/object&
&& 8.简单代码：
&&&&&&&&&&&&& &body&
&&&&&&&&&&&&& &!--所有表单元素都要放在form里面 --&
&&&&&&&&&&&&& &formaction=&/s& method=&get& &
&&&&&&&&&&&&&&&&&&&& &!--文本框text,readonly设定为只读，不能修改--&
&&&&&&&&&&&&&&&&&&&& &inputtype=&txet& name=&aaaa& value=&&readonly=&readonly&/&
&&&&&&&&&&&&&&&&&&&& &!--图片按钮image --&
&&&&&&&&&&&&&&&&&&&& &inputtype=&image& src=&yzk.png& alt=&图片连接&/&
&&&&&&&&&&&&&&&&&&&& &!--提交按钮submit&--&
&&&&&&&&&&&&&&&&&&&& &inputtype=&submit& value=&百度一下啦&&
&&&&&&&&&&&&&&&&&&&& &/br&
&&&&&&&&&&&&&&&&&&&& &!--密码框password，需显示的信息，可以直接写 --&
&&&&&&&&&&&&&&&&&&&& 密码：&input type=&password&&
&&&&&&&&&&&&&&&&&&&& &/br&
&&&&&&&&&&&&&&&&&&&& &!--单选按钮radio，需要起一个相同的名字才可--&
&&&&&&&&&&&&&&&&&&&& 性别：&input type=&radio& name=&gender&value=&male&&男
&&&&&&&&&&&&&&&&&&&& &inputtype=&radio& name=&gender& value=&female&&女
&&&&&&&&&&&&&&&&&&&& &!--框住一个区域fieldset --&
&&&&&&&&&&&&&&&&&&&& &fieldset&
&&&&&&&&&&&&&&&&&&&&&&&&&&& &!--legend声明类似名称 --&
&&&&&&&&&&&&&&&&&&&&&&&&&&& &legend&兴趣赛好&/legend&
&&&&&&&&&&&&&&&&&&&&&&&&&&& &!--多选按钮：checkbox --&
&&&&&&&&&&&&&&&&&&&&&&&&&&& &inputtype=&checkbox&&羽毛球
&&&&&&&&&&&&&&&&&&&&&&&&&&& &!--disabled属性为禁止选定 --&
&&&&&&&&&&&&&&&&&&&&&&&&&&& &inputtype=&checkbox& disabled=&disabled&&哈哈球
&&&&&&&&&&&&&&&&&&&&&&&&&&& &!--checked属性为默认选中 --&
&&&&&&&&&&&&&&&&&&&&&&&&&&& &inputtype=&checkbox& checked=&checked&&黑恶球
&&&&&&&&&&&&&&&&&&&& &/fieldset&
&&&&&&&&&&&&&&&&&&&& &!--下拉菜单选择select，里面的option为选择项 --&
&&&&&&&&&&&&&&&&&&&& 省份：
&&&&&&&&&&&&&&&&&&&& &select&
&&&&&&&&&&&&&&&&&&&&&&&&&&& &optionvalue=&1&&山东省&/option&
&&&&&&&&&&&&&&&&&&&&&&&&&&& &!--selected属性为默认选择 --&
&&&&&&&&&&&&&&&&&&&&&&&&&&& &optionvalue=&1& selected=&selected&&河南省&/option&
&&&&&&&&&&&&&&&&&&&&&&&&&&& &optionvalue=&1&&湖北省&/option&
&&&&&&&&&&&&&&&&&&&& &/select&
&&&&&&&&&&&&&&&&&&&& 市：
&&&&&&&&&&&&&&&&&&&& &select&
&&&&&&&&&&&&&&&&&&&&&&&&&&& &!--optgroup标签为将其内部的数据分为一组，不可选中，label属性为组名 --&
&&&&&&&&&&&&&&&&&&&&&&&&&&& &optgrouplabel=&山东省&&
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& &option&花花&/option&
&&&&&&&&&&&&&&&&&&&&&&&&&&& &/optgroup&
&&&&&&&&&&&&&&&&&&&&&&&&&&& &optgrouplabel=&湖南省&&
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& &option&哈哈哈&/option&
&&&&&&&&&&&&&&&&&&&&&&&&&&& &/optgroup&
&&&&&&&&&&&&&&&&&&&& &/select&
&&&&&&&&&&&&&&&&&&&& &!--选择电脑中的文件 --&
&&&&&&&&&&&&&&&&&&&& &inputtype=&file&&
&&&&&&&&&&&&&&&&&&&& &/br&
&&&&&&&&&&&&&&&&&&&& &!--大文本框textarea，可以显示数据,最好只读 --&
&&&&&&&&&&&&&&&&&&&& &textareacols=&100& rows=&5& readonly=&readonly&&
&&&&&&&&&&&&&&&&&&&&&&&&&&& 哈哈哈哈哈哈哈哈
&&&&&&&&&&&&&&&&&&&& &/textarea&
&&&&&&&&&&&&& &/form&
&&&&&& &/body&
十三：meta标签
&1.简介：meta标签包括在head标签中。主要用来描述页面自身信息,元信息。
&meta&标签，&meta&有指定name和指定http-equiv两种用法：
&meta name=“名字”content=“值” /&关于网页的描述信息。
&meta http-equiv=&名字& content=&值& /&模拟http响应头信息。这个信息主要是给浏览器软件来识别使用的。
&meta name=“keywords” content=“新闻,娱乐,八卦”/&
&meta name=“description” content=”中国最全的八卦新闻”/&
&meta http-equiv=“Content-Type”content=“text/charset=utf-8” /&指定网页编码告诉浏览器用什么编码，类utf-8类型需要统一
&meta http-equiv=&Refresh&content=&3& /& 三秒钟后刷新此网页。
&meta http-equiv=&Refresh&content=&3;url=& /& 三秒钟后重定向到新网页。发帖成功后提示“发帖成功，即将转向帖子查看页面”。
&meta http-equiv=“Cache-Control”content=“no-cache” /& 禁止浏览器缓存页面。
若想直到更多用法在MSDN中输入meta。
&&&&&& &!--提示浏览器用utf-8解读代码 --&
&&&&&& &metacharset=&UTF-8&&
&&&&&& &!--网页面3秒刷新一次 --&
&&&&&& &metahttp-equiv=&Refresh& content=&3& /&
&&&&&& &!--网页三秒后前往百度网址 --&
&&&&&& &metahttp-equiv=&Refresh& content=&3;url=&/&
&&&&&& &!--关键字，用户搜索时，首先匹配的字眼 --&
&&&&&& &metaname=&Keywords& content=&java培训，C#培训&&
&&&&&& &!--用户搜索后页面主题目下面的描述 --&
&&&&&& &metaname=&Description& content=&这是一个很厉害的网站&&
&&相关文章推荐
参考知识库
* 以上用户言论只代表其个人观点，不代表CSDN网站的观点或立场
访问：22038次
积分：1013
积分：1013
排名：千里之外
原创：80篇
(4)(5)(4)(2)(1)(5)(1)(12)(2)(3)(14)(21)(9)