《网页设计.doc》由会员分享,可在线阅读,更多相关《网页设计.doc(16页珍藏版)》请在金锄头文库上搜索。
1、网页设计网页设计资管系 陈钜昌大纲Client-Server 架构网页程式语言网站建立步骤伺服器介绍CSS简介Client-Server 架构Client-Server 架构流程客户端(client)发送浏览网页的请求这个请求透过通讯协定传出去找到目标电脑的IP请求送到目标电脑(server)伺服器端作出处?处?结果透过通讯协定传出去找到客户端的IP客户端看到网页终止?接回到步骤一在伺服器端下载其他资讯网页程式语言HTML & MIMEClient 端语言Java ScriptVB ScriptServer 端语言CGIASP / ASP1.NETPHPJSP资料库HTML &
2、 MIMEMIMEMultipurpose Internet Mail Extension多用途的网?邮件扩充协定image/jpeg Jpeg图片 (*.jpg / *.jpeg) image/gif Gif图片 (*.gif) text/html 网页档案 (*.htm / *.html) text/plain 文字档案 (*.txt) MIME语法 档案?型 HTML & MIMEHTMLHyperText Markup Language超文字标记语言<标签主体 属性1=;?值1; 属性2=;?值2;>内容</标签主体>相关语法说明:/.powmo3/8a
3、e.html/.csie.nctu.edu.tw/jglee/teacher/content.htm/.iams.sinica.edu.tw/lab/wbtzeng/lifeinfo/html_use.htmClient 端语言在客户端执?直译的描述性高阶语言运作模式标签型态<script language=;JavaScript / VBScript;><!-JavaScript / VBScript 语法/-></script>Client 端语言 JAVA Script直译式的语言 描述性的高阶程式语言结构非常自由,各变?需明确定义在互动性能及动态控制
4、最简?快捷Client 端语言 JAVA Script 范例<script language=;javascript;>function ctdecp(num) if(isNaN(num) return 0; var str=new String(parseFloat(num); if(str.indexOf(;.;)=-1) return 0; str=str.substr(str.indexOf(;.;)+1); return str.length;</script><form onsubmit=;alert('共有 '+ctdecp(th
5、is.txtNum.value)+' 个小数位。');return false;><input type=text value=0 name=;txtNum; size=5> <input type=submit value=计算有多少个小数位></form> Client 端语言 VB Script直译式的语言 藉由 ActiveX? Scripting 和主应用程式 (host) 沟通 只能在IE执行 Client 端语言 VB Script 范例<script language=;VBScript;><!-e
6、say = DateSerial(2006,9,22)days = esay - date()MsgBox “ 到开学还有 ; & days & ; 天;,0,;提醒您.;-></script> Server 端语言在伺服器端运?的程式运作模式Server 端语言 - CGI?史最为悠久执?速?最慢比较著名的CGI程式编写语言是PerlServer 端语言 CGI 范例my file = &readfile(;mess.txt;);for (file) ($num,$username,$comment,$x_point,$y_point,$date,$
7、ip,$time) = split/;last if ($Tnum = $num);print<<HTML;<BODY bgcolor=#000000 topmargin=;0; leftmargin=;0;><table border='3' cellpadding='0' cellspacing='0' width='153' height='207' align='center' background='pic/b2.gif
8、39;><tr> <td height=;25; align=;center;><font color=;#808080;>祈愿者: <font color=;#808080;><b>$username</b></font></td> </tr><tr> <td align='center' bgcolor=#808080><table width=;145; cellpadding='0' cellspacin
9、g='0'><tr> <th width=;145;>$comment</th> </tr> </table></td> </tr><tr> <td align=;center; height='18'> <font color=;#808080; SIZE=2> $date$time </td> </tr></table></HTML><noscript><!-#
10、echo banner=;-></noscript>HTMLexit;Server 端语言 ASP / ASP.NETASP可使用Jscript、VBScript及PerlScript三种语法ASP.net可使用VB.net、C#.net及J#.NET的语法必须在微软视窗作业系统加上Internet Information Services (IIS) 的直译器才能运?ASP是包含在<%.%>中的,是一种物件导向的语言 Server 端语言 ASP 范例<HTML> <HEAD> <Title>ASP测试网页0501</T
11、itle> </HEAD> <Body> <% '以下是ASP程式码 text = ;这是第一支ASP程式。; Response.Write ;嗨!大家好!; 'Response.Write 会在画面上印出字元。 Response.Write text '印出变数 Response.Write ;我来自:; & REQUEST.servervariables(;REMOTE_ADDR;) '印出环境变数 %> </BODY> </HTML> Server 端语言 PHPPerson
12、al Homepage Program伺服器端执行(Server side)内嵌於HTML(HTML-embedded)免费、跨平台、易学、效率高新版已可使用物件导向Server 端语言 PHP 范例<HTML><HEAD><TITLE>PHP 测试范例</TITLE></HEAD><BODY><?php echo ;hello, worldn;?></BODY></HTML>Server 端语言 JSPJava Server Pages 设计目的是使得构造基於Web的应用程序更加容易和
13、快捷内嵌在传统的网页HTML文件中优点将内容的生成和显示进行分离 强调可重用的组件 采用标识简化页面开发Server 端语言 JSP 范例 <% page content Type=;text/html; charset=big5; %> <% String str1=;Hello World; %> <html> <head> <title>第一个程式</title> <meta http-equiv=;Content-Type; content=;text/html; charset=big5;> <
14、/head> <body> <% out.println(str1); %> <%=str1%> </body> </html> 分辨网页使用的程式语言cfm Cold Fusion cgi / pl CGI jsp JSPphp / php3 / php4 PHPaspx ASP.net asp ASPhtm / html 没有使用后端技术 网页副档名 后端技术 资料库 - SQLStructured Query Language 可以配合各种程式自动作大?的资?处?及运算常用的资料库ACCESSMS SQLMySQLPostGre SQLSQL指令分类资?定义语言 (Data Definition Language)开新资?表、设定?位、删除资?表、删除?位,管?所有有关资?库结构的东西资?查询语言 (Data Query Language)取回查询结果资?操作语言 (Data Manipulation Language)新增资?,删除、?新等工作资?控制语言 (Data Control Language)处?资?库权限及安全设定网站建立步骤