1、Web技术(网站技术),编程语言乱纷纷,校园学子欲断魂。统一之王何所在,蒂姆近指超语村。,聚焦Web,第01章 绪论了解Web的定义、发展简史、应用现状第02章 HTTP协议第03章 HTML语言第04章 CSS语言第05章 JavaScript语言,第06章 服务器规划服务器安置选择、服务器主机选择、服务器操作系统选择、Web服务器的选择、带宽估算。,第07章 服务器配置Web服务器的基本配置。第08章 服务器编程node.js,第09章 Web安全Web攻击的种类、安全防范基本原则、Web服务器安全、Web客户端安全(ActiveX、Applet、JavaScript、Cookie的安全隐
2、患)、SSL和证书、侵入检测和恢复。第10章 Web新技术展望XML、XHTML、Web Service、SOAP、WSDL、UDDI,教材与参考,教材:本ppt,自己打印。参考:孙鑫 付永杰. HTML5、CSS和JavaScript开发. 北京:电子工业出版社,2012.http:/ 绪论,Web是 World Wide Web(WWW)的简称,译为万维网,它是因特网上的一种信息服务系统,已成为信息服务的门户。,1.1 Web是什么?,Web系统由4个部分构成:超文本传输协议HTTP(Hyper Text Transfer Protocol);超文本标记语言HTML(Hyper Text
3、Markup Language)。Web服务器;Web浏览器。,1.Web是多媒体化的:Web可以将数据、文本、图形、动画、视频和音频集成在一起。 2.Web是分布式的:Web可以使不同站点的信息在逻辑上一体化,让用户感觉这些信息就好像是放在一个站点上。,Web有以下特点:,3.Web是非线性的:想要了解网页上某一个主题的内容只要在这个主题上点击一下,就可以跳转到关于这一主题的网页上。文本不再象书一样是线性的,而是可以从一个位置跳到另外的位置。 4.Web是可以交互的:用户通过填写表单向服务器提交请求,服务器可以根据用户的请求返回相应信息。 5.Web是平台无关的:无论从Windows、Lin
4、ux、Unix还是别的什么平台,都可以通过浏览器(browser)访问Web。,1967年,Brown大学的Nelson首次起用Hypertext and Hypermedia一词。 1969年,美国国防部高级研究计划署(ARPA)建立ARPANET,这是Internet的雏形。 1969年,IBM 的 Charles Goldfarb 发明可用于描述超文本信息的GML ( Generalized Markup Language,通用标记语言) 。,1.2 发展简史,1974年,Cerf和Kahn提出TCP/IP协议。 1986年,美国国家科学基金网NFSNET取代ARPANET,成为Inte
5、rnet的主干网。 1986年,ISO在GML的基础上发布SGML(Standard Generalized Markup Language,标准通用标记语言)。由于过于复杂,没有被广泛采用。,1989年,欧洲粒子物理实验室(CERN)的Tim Berners-Lee(蒂姆伯纳斯-李)构思了Web(万维网),提出了HTTP协议和HTML语言。1990年,他编写了世界上第一个Web服务器HTTPD和第一个浏览器 World Wide Web。1991年,他将两个软件放在互联网上免费传播。,浏览器World Wide Web,Tim Berners-Lee 1955年6月8日(双子座)出生于英国伦
6、敦,1976年牛津大学女王学院物理专业毕业,八十年代任职于瑞士日内瓦的CERN。,http:/www.w3.org/People/Berners-Lee/,Berners-Lee当时面对的任务是:为从事粒子物理研究的各国研究人员提供一种快速查找论文和图片的方法。,Web使用HTML语言来组织文件。 HTML语言是从SGML语言导出的语言,它使用固定的标记集来定义文档的格式和超链接。,1993年,美国国家超级计算应用中心(NCSA)的Marc Andereessen发布图形界面的浏览器Mosaic(镶嵌物)。 1993年,NCSA 发布动态网页生成标准 CGI( Common Gateway I
7、nterface,公共网关接口)1.0 。 1994年,23岁的Marc Andereessen离开NCSA创建了Netscape通信公司。,1994年,欧洲粒子物理实验室(CERN)和麻省理工学院(MIT)签订协议成立World Wide Web Consortium (即W3C,网址是www.w3.org),由Tim Berners-Lee任主席。 如果我们说今天的万维网是Berners-Lee个人创造的结果,似乎与事实相去并不太远。但是,他并没有因此从事商业,而是加入了非营利机构W3C,全力维护Web的公平与公开性。,1994年,在校大学生 Rasmus Lerdorf 发明用于设计动态
8、网页的脚本语言 PHP(Personal Home Page)。 1996年,微软推出 ASP。 1996年, W3C 发布CSS(Cascading Style Sheets,层叠样式表单)1.0 标准。 1996年3月,Netscape 的Brendan Eich发明 JavaScript语言。 1996年,Macromedia 推出Flash。 1998年,Sun 推出 JSP。,1998年4月,W3C 发布 HTML4.0, 新增 标记用于嵌入 CSS ,新增标记用于嵌入 JavaScript。 1998年,W3C发布XML1.0标准,说明文档只有30页左右,比SGML 500页的文档
9、简明得多。XML保留了SGML 80%的功能,但只有SGML 20%的复杂性。,1999年,W3C发布XSLT(Extensible Stylesheet Language Transformation,可扩展样式表语言转换)标准,用于把XML文件转换为其他格式的文件。 2000年,W3C发布Web Service的 SOAP ( Simple Object Access Protocol,简单对象访问协议) 1.1 标准。 2001年,微软推出 ASP.NET。 2001年,W3C发布XSL(Extensible Stylesheet Language,可扩展样式表语言) 1.0标准。 20
10、08年,W3C发布 HTML5 草案。 2009年,node.js诞生。可以用JavaScript语言在服务器端开发动态网页了。浏览器端、服务器端和本机应用程序的开发语言统一于JavaScript 。,夫兵形象水。水之形,避高而趋下。兵之形,避实而击虚。 摘自 孙武孙子兵法 要想根据麦粒的化学成份去研究麦穗的形状,这无疑是错误的,因为要想知道麦穗的形状,只要到田野里去看一看就行了。 杰出的统帅从来不是来自知识渊博的军官,而大多数是那些环境不许可他们获得大量知识的人。 关于大问题的知识和思想能使人成大才,关于细小和枝节问题的知识和思想,如果不作为与己无关的东西而拒绝接受的话,那就只能使人成小材。
11、 摘自 冯克劳塞维茨战争论,1986年,英国出版了一本书名叫中国-发现和发明的国度,书中介绍了一百个中国发现和发明的世界第一。作者坦普尔指出:“现代社会赖以建立的基本的发明创造,可能有一半以上来自中国。” 爱因斯坦说:“希腊哲学家们通过逻辑体系发现的东西,中国的先哲们全都先做出来了。”,Web页面简单易用,推动了因特网的普及,加快了世界信息化的进程。 Web页面标准通用,简化了应用软件的开发,引起了软件业的革命。,1.3 应用现状,信息发布网上论坛搜索引擎电子邮件即时通信互动游戏应用软件文件下载,Web技术可以方便地集成:,Web已成为各类社会组织强化信息管理工作的有力工具。 Web也已成为个
12、人生活和娱乐的重要组成部分。,中国互联网络信息中心(CNNIC)每年发布新的中国互联网络发展状况统计报告。,,第02章 HTTP协议,Web系统采用“客户机/服务器” 工作模式。Client/Server, C/S也特称为 “浏览器/服务器” 工作模式。Browser/Server, B/S,客户端安装Web浏览器软件,用来解释显示超文本文件。,服务器端安装Web服务器软件,存放超文本文件(Hyper Text)。超文本文件由HTML语言(Hyper Text Markup Language)编写。,Web浏览器和Web服务器之间的通信,HTTP协议工作在TCP/IP协议层之上的应用层。 HT
13、TP协议通过请求消息和响应消息处理Web浏览器与Web服务器之间的数据交换。,在客户端浏览器中输入URL(Uniform Resource Locator)或点击页面的超链接。浏览器向DNS域名服务器询问URL中域名的IP地址。DNS返回询问的IP地址。,2.1 工作过程,通过三次握手法,浏览器和Web服务器的80端口建立一个TCP连接。浏览器向Web服务器发送HTTP请求消息(Request Message)。Web服务器向浏览器返回HTTP响应消息(Response Message)。浏览器解释显示页面文件。,一个典型的Web页面由许多网络文件组成,如HTML文件、GIF/JPEG图像文件
14、、音视频文件、ActiveX插件等,它们都用URL来标识。,当客户机接收到Web页面时,Web浏览器就解释显示该页面。 不同公司开发的浏览器解释页面时显示的格式可能会有所不同。 HTTP对如何在客户机上显示Web页面不做任何事情,它仅仅定义在客户机和服务器之间如何传送数据。,三次握手法(Three-Way Handshake): 假设主机A想与主机B建立TCP连接,主机A就发送一个特殊的“连接请求消息段(Connection Request Segment)”给主机B,这个消息段封装在IP数据包中,然后发送到因特网。 主机B接收到这个消息段之后就分配接收缓存和发送缓存给这个TCP连接,然后就给
15、主机A回送一个“连接允许消息段(Connection-Granted Segment)”。,2.2 TCP连接,主机A收到这个回送消息段之后也分配接收缓存和发送缓存,然后就给主机B回送“连接确认消息段(Connection Acknowledgement Segment)”,这时主机A和主机B之间就建立了TCP连接,它们就可在这个连接上互相传送数据。 由于主机A和主机B之间建立连接要连续交换3次消息,因此把这个TCP连接建立的方法称为三次握手法。,建立TCP连接使用三次握手法,传输等待时间(Timeout): 主机A和主机B之间建立一个TCP连接后,当主机A发送一个数据包时,就启动一个定时器,
16、期待在一定的时间内接收到主机B对这个数据包的确认消息。这个期待的时间称为传输等待时间。 当主机B接收到一个数据包时,就回送一个确认消息。 如果在等待时间之内没有接收到确认消息,主机A就重发数据包。 如果主机B收到的数据包是无顺序的,TCP软件会重新整理使数据流符合主机A的发送顺序,并去掉重复的数据包。,确认和重传,非持续连接(Non-Persistent Connection): 建立一个TCP连接只能传送一个网络文件。HTTP/1.0 默认设置是非持续连接。这时,如果打开一个内嵌10个图像的HTML网页文件,HTTP就要建立11次TCP连接才能把文件从Web服务器传送到客户机。 建立一个TC
17、P连接就要执行一次三次握手法,分配收发缓存,这都要占用CPU时间,所以非持续连接效率比较低。,持续连接(Persistent Connection): 建立一个TCP连接可以传送多个网络文件。 HTTP/1.1 默认设置是持续连接。这时,如果打开一个内嵌10个图像的HTML网页文件,HTTP建立1个TCP连接就能把文件从Web服务器传送到客户机。 HTTP/1.1也允许客户机在接收到服务器的响应消息之前发送多个请求消息,这叫做流水线式请求(Pipelined Request)。,当用户单击超链接以请求Web页面时,首先与Web服务器建立TCP连接,然后经TCP连接将HTTP请求消息发送给Web
18、服务器。请看下面的实例:,2.3 请求消息,GET /index.html HTTP/1.1User-Agent: Mozilla/4.5en(SunOS5.5.1)Accept: image/gif, image/jpeg,HTTP请求消息格式,方法:可以有以下几种方法:GET:表示请求一个Web页面,这时实体是空的。也可以向服务器端程序上传数据,方法是在URL后面跟一个“?”号,然后是参数对。,HEAD:表示请求一个Web页面,但不要求响应消息的实体中包含页面内容。常用来获取文件的信息,例如文件是否存在、文件的类型、文件的修改时间,等等。,POST:表示提交一个表单的内容,这时实体中就是用
19、户写入表单域中的内容。PUT:向服务器发送文档。DELETE:从服务器上删除文档。,但是在这里,URL是指/path/filename,http:/host.domain:port是系统自动设置的,不包含在此处的URL中。,http:/host.domain:port/path/filename。,URL的标准格式为:,URL:Uniform Resource Locator,统一资源地址,是用户请求访问的Web页面文件的路径和文件名。,版本:是客户机使用的HTTP协议的版本号。 1997年前使用的是HTTP/1.0(RFC1945)。 1998年开始使用HTTP/1.1(RFC2068),它
20、向后兼容HTTP/1.0。,题头名:通常有以下几种题头名Accept:说明客户倾向于接收的媒体类型Cookie:本机的Cookie信息(名称/取值对),If-Modified-Since: 用于进行条件GET请求。 当用户请求一个Web文件时,浏览器首先检查本机浏览器的缓存: a.如果文件已在缓存中,浏览器就发送一条带有If-Modified-Since题头的条件GET请求到Web服务器。例如: If-Modified-Since:Wed,27 May 1998 10:15:30,表示缓存中的文件的最后修改时间,当Web服务器接收到这个请求时: 如果文件未修改,就给客户机发送一条文件未修 改的
21、响应消息。 如果文件已修改,就发送这个文件的拷贝给客户 机。 b.如果请求的文件不在缓存中,浏览器就用标准的GET请求,即不包含If-Modified-Since题头。,Referer:允许客户端给出所点击超链接所在的页面的URL地址。User-Agent:说明用户使用的浏览器的类型。,服务器接收到客户的HTTP请求消息后进行分析,将分析和操作的结果返回给客户机,具体做法就是发送一条HTTP响应消息。请看下面的实例:,2.4 响应消息,HTTP/1.1 200 OKDate: Mon,04 Jan 1999 00:33:10 GMTServer: Apache/1.3.1(Unix)Last-
22、Modified: Tue,20 Oct 1998 21:00:39 GMTContent-Length: 25Content-Type: text/htmlhello,world!,HTTP响应消息格式,状态行 版本 空格 状态码 空格 解释 回车换行符 题头名1: 空格 题头内容 回车换行符题头 题头名n: 空格 题头内容 回车换行符 空行实体 实体,版本:是服务器使用的HTTP协议的版本号。状态码与解释:说明响应消息的状态。状态码由3位数字组成,第一位代表响应的类别:,1:表示请求已收到,正在进行处理。2:客户端的请求成功。3:客户端请求不能完成,客户端应重新定向。4:客户端的请求不完全
23、或不正确,无法完成。5:由于服务器的原因,请求未能完成。,最常见的状态码与解释: 200 OK 最常见的状态码,表示客户的请求成功,服务器也成功地返回所请求的资源。 204 No Content 请求成功,但未能返回要求的资源。这时,客户没有必要再继续。,301 Moved Permanently请求的URL不再有效,服务器返回新的位置。 304 Not Modified 对客户端条件GET请求的响应,表示服务器端文档未被修改。,400 Bad Request 服务器不明白请求是什么意思。 403 Forbidden 客户端请求的数据不允许访问。 404 Not Found 请求的资源在服务器
24、上找不到。,500 Internal Server Error 服务器出错。最常见的原因是服务器端的某个程序出了故障。,通常有以下几种题头名Server:Web服务器的有关信息。Set-Cookie:在客户端的浏览器上设置一个Cookie(小甜饼)。Content-Length:指明在实体中传送的数据的大小,单位是字节。Conten-Type:指明在实体中返回数据的MIME类型( Multipurpose Internet Mail Extensions ) 。,题头:,Expires:说明文档失效的日期和时间。此题头对缓冲文档很有用。如果浏览器知道文档改变的时间,就可以等文档发生改变后再去提
25、取,没必要在此之前提前进行。Last-Modified:说明文档最近一次被修改的日期和时间。Location:说明重定向的URL。实体:请求消息要求获得的对象,即文件。,MIME,MIME(Multipurpose Internet Mail Extensions,多用途网际邮件扩展协议) 最初是为电子邮件从文本扩展到多媒体而制订的媒体交换协议。由于它的成功,Internet上的其他服务,特别是Web,也在许多方面采用了MIME的规定。MIME可以在一个消息中包含多个信体,可以使用多语种和多字体。 MIME类型就是指文件的媒体类型,共有7种类型:text、image、audio、video、a
26、pplication、message、multipart。,服务器根据文件的扩展名确定MIME类型。 浏览器根据MIME类型确定显示文档的方法。 MIME类型以“媒体类型/子类型”的形式表示。 例如text/html,媒体类型是text,子类型是html,是对媒体类型的进一步描述。又例如image/gif,image/jpeg 。,第03章 HTML语言,Hyper Text(超文本):含有超链接的文本文件。,Hyper Link(超链接):是一个文件中指向另一个文件的指针。用URL来表示。,几个概念,URL:Uniform Resource Locator,中文译为“统一资源地址”,是用户请
27、求访问的Web页面文件的路径和文件名。,http:/:1234/pub/default.htm,协议 域名或IP地址 端口 目录和文件名,语法表示,HTML的最常用版本是HTML4.01。HTML的最新版本是HTML5。HTML页面是由许多元素组成的。HTML以标记标注及排列各元素。标记的一般格式为: 显示内容标记是大小写无关的,最好都用小写。属性的赋值一般都用双引号( )。,常用属性,1.id: 标识属性。在脚本编程中通过id引用页面元素。必须以英文字母开头,后可跟字母、数字、中划线(-)、下划线(_)、冒号(:)、圆点(.)。与name属性具有相同的功能。 2.class:样式属性。引用在
28、外部样式表或内部样式表中的自定义样式。 3.style:样式属性。在标记内定义内联样式表。,4.title: 提示属性。设置当鼠标移到元素上时显示的提示文字。 5.事件属性:用来启动脚本程序。例如 onclick 鼠标左键单击元素事件,基本结构,标题, 设置HTML文件的开始和结束。 设置HTML文件的一些信息,如标题、层叠样式表单、脚本程序等。 设置HTML文件的标题。可在浏览器窗口标题栏显示。可以添加到浏览器的收藏夹内。 设置HTML文件的主体内容。,HTML5 页面布局新新宇宙绿色游戏网,应用缓存,要使断网后网页仍能使用,应给html标记添加manifest属性。demo.appcach
29、e文件的内容:CACHE MANIFEST#2012-02-21 v1.0.0/theme.css/logo.gif/main.js试一试:http:/ 指定某一个特性的名称,例如 author。content 设置name所指定的特性的值。http-equiv HTTP协议的题头名。charset 字符编码集。,HTML文件的基本标记,例如:http-equiv 可以使Web服务器在HTTP响应时生成相应的HTTP题头。,02.设置层叠样式表单:,详细内容见 第04章 CSS。,03.设置脚本:,内容是一段脚本程序。如果是全局变量或函数的定义,最好放在之间。可设如下属性: 详细内容见 第05
30、章 JavaScript。,04.设置注释:,浏览器不解释显示其中的内容。例如:,05.设置主体:,所有要显示的页面元素都要包含在主体内。可设以下属性: bgcolor 设置页面背景颜色。HTML中的颜色值以6位十六进制数#rrggbb表示,分别表示红、绿、蓝三原色;或者用以下单词表示:aqua、black、blue、fuchsia、gray、lime、maroon、navy、olive、purple、red、silver、teal、white、yellow。以后不再解释颜色的表示法。 background 设置页面的背景图片的URL。,例如:,n的值可以取1到6,代表一级标题到六级标题。可设
31、以下属性:align 设置标题的位置,可取left、center、right。,06.设置标题:,例如:h1字体示例 h2字体示例 h3字体示例 h4字体示例 h5字体示例 h6字体示例,07.设置水平线:,hr是horizontal rule的缩写。可设以下属性: align 设置水平线的位置,align的参数有left、center 、right。 width 设置水平线的宽度,可以用百分数,也可以用像素数。 size 设置水平线的粗细。 color 设置水平线的颜色。,例如:,08.设置段落:,将标记间的文字设置为一个新的段落。可设以下属性:align 设置段落的对齐方式,可取left、
32、center、right。例如:段落示列这是第一段这是新的一段,09.设置换行符:,强制进行换行操作。例如:第一行新起一行,10.设置无序列表:,项目1项目2,11.设置有序列表:,项目1项目2,12.设置字体, 设置标记间文字为粗体(boldface) 设置标记间文字为斜体(italics) 设置标记间文字为上标(superscript) 设置标记间文字为下标(subscript),例如:普及绿色游戏编程普及绿色游戏编程 普及绿色游戏编程 普及绿色游戏编程普及绿色游戏编程,13.设置特殊字符,有一些ASCII码字符需要特殊表示: 用 的方式表示,ASCII码的取值范围为0-255。,14.设
33、置图像:,src 设置图像文件的URL。width 设置图像宽度height 设置图像高度align 设置图像相对于周围内容的对齐方式,可 取left、right、top、middle、bottom。,hspace 设置图像与周围其他内容的水平间距。vspace 设置图像与周围其他内容的垂直间距。例如:,15.设置超链接:,首尾标记之间可以是文本或用标记插入的图像。解释:a(anchor,锚),href(hypertext reference)。可设以下属性:,href 设置URL,格式为http:/hostname.domainname:port/path/filename。 http可以换
34、成其他协议,例如ftp、telnet等。 也可以使用相对路径(相对于本网页路径的文件路径)。 链接的目标可以为任何类型的文件(例如可以为音视频文件)。 目标文件如果不能显示,就会出现下载对话框。,target 显示链接的位置,可取以下值: _blank 在新选项卡中打开超链接 _self 在本选项卡中打开超链接例如:新新宇宙绿色游戏,16.设置插件:,可设以下属性: classid 设置插件的标识 codebase 设置插件的下载URL type 设置数据文件的MIME类型,align 对齐方式,可取left、right、 top、middle、bottomwidth 设置显示宽度height
35、 设置显示高度,设置外部控制参数。可设以下属性: name 参数名 value 对应的参数值,播放Flash文件: , 你的浏览器不支持audio 标记。,17.设置音频:, 你的浏览器不支持video标记。 ,18.设置视频:,创建页内区块。其中可以嵌入各种页面元素。可有以下HTML属性:align 设置区块对齐方式,可取left、center、right。,19.设置区块:,创建行内片段。常用来嵌入文本。,20.设置片段:,21.设置表格:,可设以下属性:align 设置表格位置,可以为left、 center、right。width 设置表格的宽度。height 设置表格的高度。bord
36、er 设置表格外框的粗细。bordercolor 设置表格外框的颜色。,cellspacing 设置两个单元格之间的间距。cellpadding 设置单元格内文字与单元格边框的 间距。background 设置表格的背景图像的URLbgcolor 设置表格的背景颜色, 设置表格标题。可设以下属性:align 可取top(标题在表格上方)、 bottom(标题在表格下方)。, 子标记,设置表格行。属性如下:bgcolor 设置表格行的背景色。align 设置一行中各单元格内容相对于单 元格的水平对齐方式,可取left、 center、right。valign 设置一行中各单元格内容相对于单 元格
37、的垂直对齐方式,可取top、 middle、bottom。, 子标记,设置单元格内容,属性 如下:width 单元格宽度。height 单元格高度。rowspan 单元格占用表格行数。colspan 单元格占用表格列数。,background 设置单元格背景图像bgcolor 设置单元格背景色。align 设置内容水平对齐方式,可选 left、center、right。valign 设置内容垂直对齐方式,可选 top、middle、bottom。,表格例子1: 电信学部学生名单, 姓名 性别 专业 王大鹏 男 电子工程, 李红艳 女 计算机科学与技术 张剑 男 自动化,表格例子2: 第一行第一
38、列 第一行之第二列及第三列 , 第二行及第三行之第一列 第二行第二列 第二行第三列 第三行第二列 第三行第三列 ,22.设置内嵌框架:,内嵌一个天气预报框架:,23.设置表单:,功能是向服务器端程序提交信息。可设以下属性: method 设置提交表单内容到服务器的HTTP方法,可以选get和post。get传送的数据量最大2KB,提交时表单域数值将在地址栏显示。post传送的数据量不受限制,提交时表单域数值将不会在地址栏显示。 action 设置表单处理程序的URL。,text 设置单行文本域 password 设置密码域 file 文件输入域,这时form应设属性method=post en
39、ctype=multipart/form-data hidden 隐藏域,用于发送不用浏览者填写,但是处理程序需要的数据。 checkbox 设置复选框 radio 设置单选按钮,同名单选按钮只允许选择一个。, 子标记,设置表单域,可设属性: type 可取如下值:,button 一般按钮 image 图像按钮,当被点击时,发送的是点击处的坐标,形式如name.x=x值,name.y=y值。 reset 设置重置按钮,点此按钮将把所有表单域的值恢复为默认值。 submit 设置提交按钮,这是每个表单都有的,表示开始提交信息,激活服务器端程序。,type的值还可以是 url email tel
40、search number range color datetime date month week datetime-local 。,name 表单域标识,作为“名称=取值”对的一部分传给服务器端程序。 value 输入的值。对text和hidden类型,是表单域的默认值。对checkbox和radio类型,是被选择后传给服务器端程序的取值。对reset和submit类型,是按钮上显示的文字。 checked 设置初始时被选中,无取值(适用于checkbox、radio类型),size 用字符数表示的输入框的几何宽度(适用于text、password类型) maxlength 能输入的最大字
41、符数(适于text、password类型) alt 输入域描述(适于text类型) src 图像的URL(适于image类型) tabindex tab键次序 required 无取值。表示必须填写。,例如 , 子标记,设置多行文本域。可设以下属性: name 标识 rows 文本域行数 cols 文本域列数 wrap 可取off(不换行)、 soft(软回车换行)、 hard(硬回车换行) tabindex tab键次序, 设置选择域。用 子标记设置选择项。可设属性:,name 选择域标识 可设属性: value 表示选择项对应的值,将提交给服务 器端程序 selected 无取值,表示初始
42、选择项, 表单测试电子邮件:,本站密码:您购买本书的途径: 从书店购买 从出版社邮购 从网站订购 您认为本书最大的特色在于:,内容新示例丰富有一定深度比较实用 是否需要在本书再版时立即通知您:是,否 其它意见和评论:,你的浏览器不支持 canvas标记。var c=document.getElementById(myCanvas);var cxt=c.getContext(2d);cxt.moveTo(10,10);cxt.lineTo(150,50);cxt.lineTo(10,50);cxt.stroke();,24.绘制图形:,第04章 CSS,CSS是Cascading Style S
43、heets(层叠样式表单)的缩写,可以辅助HTML更简易地设置页面元素的显示格式,并解决HTML无法解决的页面元素的精确定位、滤镜等效果。,例如,将以下内容保存到名为xxyz.css 的独立文本文件中,其中不能包含标记:,1. 外部样式表,body width:760px;margin:5px auto; background:url(images/background.gif);font-size:14px;h1 font-size:28px;color:#ff0000; /* html标记的样式 */h2 text-indent:2em;color:#0000ff;p text-inden
44、t:2em;a:link color:blue;text-decoration:none; /*平常状态*/a:visited color:blue;text-decoration:none; /*已被点击状态*/a:hover color:red; /*鼠标悬停状态*/a:active /*正被点击状态*/input,select,textarea border:1px solid #616178;font-size:12px;color:#005680;.title font-size:16px; /*自定义样式名*/.border border:1px solid #009933;margin:2px;#div1 font-size:50px;color:#0000ff; /*id为div1的元素的样式*/li float:left; padding:5px 50px; ,