Web

发布日期：2021-05-07 15:25:42 浏览次数：25 分类：技术文章

本文共 8535 字，大约阅读时间需要 28 分钟。

web应用程序开发&网站规划综合实训

首先要新建站点，将文件都保存在一个站点中。引用外部样式表:<link rel = "stylesheet" href="1.css" type = "text/css"/>

一、不重要的综述

WWW（world wide web）万维网
- 基于HTML（超文本标记语言），通过超链接，任何web页面可以相互访问；
- 网站是多个网页及资源的一个集合。

URL（统一资源定位器），用于完整描述Internet上网页和其他资源的地址。

域名：Internet上某一台计算机或计算机组的名称。

静态网页

用HTML语法构造的，无法与使用者产生互动的网页，被称为静态网页。静态网页只能够单纯地显示网页内容，而无法针对不同的网页浏览状况做出实时响应.

动态网页

动态网页包含HTML标记和程序语言(ASP,JSP, PHP)，是在得到页面请求之后动态生成页面，可以根据用户的请求生成不同的内容，以实现和用户的交换.

动态网页开发技术
- ASP : 是微软公司推出的用于Web应用服务的一种编程技术.采用的脚本语言：VBScript 和JavaScript。(简单易学，应用广泛）
- PHP : 是一种跨平台的服务器端嵌入式脚本语言，支持目前绝大多数数据库，并且是完全免费的。
- JSP : 开放的，跨平台的结构，可以运行在所有的服务器上，使用java编程语言。

网页布局
- ∏型布局
- T型布局
- “三”型布局
- 框架布局
- Pop布局
- Flash布局

Web前端开发技术
- HTML
- CSS
- JavaScript
- HTML DOM(HTML Document Object Model)
- BOM

DreamWeaver操作界面
- 代码、拆分、设计、实时视图

二、HTML基本标记

body标记属性

HTML常用标记
- <P></P> 段落
- <table> </table>表格,包含行<tr>和单元格<td>
- <h1></h1>h1是标题标签中字体最大的
- <a></a>超级链接例如：<a href=“http://zjnu.net”> 浙江师范大学</a>
- <b>加粗
- <font></font> 字体例如：<font face=“黑体”color=“#0000ff” size=“5”>你好
- <img>图片例如：<img src=“img/p1.jpg”>

三、常用头部标记

<title> 设定显示在浏览器标题栏中的内容

<meta>定义文档的字符集、关键字等

<style>设定CSS层叠样式表的内容

<link>设定对外部CSS文件的链接

<script>设定页面中程序脚本的内容

<meta>
- http-equiv
生成一个HTTP标题域，它的实际取值由content属性确定。
- name
以关键字/值的形式来规定元信息内容，其中name确定“关键字”的内容，“值”由content属性确定。
- keywords
确定关键字/值中”值”的内容。

设定自动刷新
<meta http-equiv="refresh" content=“3">

设定自动跳转
<meta http-equiv="refresh" content=“3;url=http://www.sina.com.cn">

四、主体标记

一是对页面的各种属性的进行设置；

二是包含所有需要在浏览器中显示的内容

body标记的属性：
- 正文颜色<body text="#0000ff"></body>
- 背景颜色<body bgcolor="#336699" text="white"></body>
- 背景图像<body background=img_file_url></body>
- 背景图像固定属性bgproperties<body background=img_file_url bgproperties=fixed></body>
- 链接颜色<body link="#99CCCC" alink="#00FF00" vlink="#FF6600"></body>

五、表格和框架布局

表格的属性
- 填充（cellpadding）指的是单元格里面的内容和边框的距离
- 间距（cellsapcing）指的是单元格之间的距离

和表格相关的部分html标记
- 表格:<table>
- 行:<tr>
- 单元格:<td>
- 背景颜色:bgcolor
- 边框粗细:border
- 边框颜色：bordercolor
- 单元格间距：cellspacing
- 填充：cellpadding

框架集用<frameset>标记，框架窗体用<frame>标记，其中<frame>必须嵌套在<frameset>中使用。

frameset基本格式:

frameset属性
- rows定义上下分割的框架的大小；
- cols定义左右分割的框架的大小。

frame属性
- src:设定网页中要显示的文档的URL
- name:设置框架的名称
- 超链接的目标位置设置，新窗口、当前窗口、哪个框架。
六、浮动帧

【例】调用QQ天气预报代码显示本地天气预报

设置背景透明的浮动框架
- 一、标记的allowTransparency属性值为true，即<iframe allowTransparency=“true”>;
- 二、浮动框架链接的源文档的标记的bgcolor属性值为transparent,<body bgcolor="transparent">

七、文字和图片的编辑

文字编辑

输入空格：按下（ctrl+shift+space)可以输入多个空格；

分段：按回车键或加<p></p>标记；

换行：插入—html—特殊字符—换行符或shift+回车键;

设置行距：在样式中设置line-height属性;

插入项目符号：插入面板—文本—项目列表.

插入水平线和日期

设置水平线的颜色<hr color=“#ff0000” />

插入音乐

//背景音乐
<body>
<bgsound src="76ch34.mid" loop="-1" />
</body>
//音乐文件
<body>
<embedsrc="stream.mid" width="218" height="156” hidden="true">
</embed>
</body>

八、超链接

页间链接

页内链接（锚记链接）

email链接

空链接及脚本链接，允许用户附加行为至对象或创建一个执行javascript代码的链接，例<a href=“javascript:alert(‘非法操作！！’)”>关闭</a>

超链接设置
- 超链接颜色设置链接颜色（a:link)
- 已访问链接(a:visited)
- 变换图像链接(a:hover) 指定当鼠标（或指针）位于链接上时应用的颜色。
- 活动链接(a:active) 指定当鼠标（或指针）在链接上单击时应用的颜色
- 超链接下划线显示

九、表单及动态网页制作基础

静态网页

用html语法构造的，无法与使用者产生互动的网页被称为静态网页。静态网页只能单纯的显示网页内容，而无法针对不同的浏览状况作出实时响应。

动态网页

动态网页包含HTML标记和程序语言（ASP、JSP、PHP、ASP.NET），是在得到页面请求之后动态生成页面，可以根据用户的请求生成不同的内容，以实现和用户的交换。

表单

提供给访问者填写信息的区域，从而收集客户信息，使网页更加具有交互功能。
表单内的信息被提交到服务器后，服务器的asp等程序能处理这些数据，例如将这些数据写到数据库里面。
用户也可以提交查询，服务器的处理程序会检索数据库，把用户需要的信息传送到浏览器显示。

表单标记
form id="form1" name="form1" method="post" action="liuyan.asp"//action：表示提交内容到liuyan.asp处理

表单对象
- 文本域
- 文本区域
- 单选按钮
- 下拉列表
- 提交按钮

【例】网页表单

1.ASP内置对象

Request：接受客户端web页面提交的数据。
- 集合：querystring,form,cookies,serveriable

Response:向浏览器输出文本、数据和cookies以及控制传送网页中的每个阶段。
- 方法：write,redirect,end,flush

Server:创建com对象和scripting对象
- 方法：CreatObject

Application:用于多个用户的共享信息

Session:为单个用户保存信息

2.ADO对象

Connection对象：用于建立数据库的连接

Command：用于操作数据库的命令

Recordset:用来存储数据库操作返回的数据集

连接各数据库可以使用驱动程序(OLEDB)，也可以使用数据源(ODBC),相对来说使用OLEDB较为方便、简单。同时尽量使用字符串的连接方式。

3.OLEDB连接

①和ACCESS数据库连接

<%dbpath=server.MapPath("db/user.mdb")set conn=server.CreateObject("adodb.connection")'创建连接对象connstr="Provider=Microsoft.jet.oletdb.4.0;data source=" & dbpathConn.open connstr%>

②和SQL数据库连接

<%dbpath=server.MapPath("db/user.mdb")set conn=server.CreateObject("adodb.connection")'创建连接对象connstr="Provider=SQLOLEDB;data source=localhost;UserID=***;Password=***;initial Catalog=" & dbpathConn.open connstr%>

4.Conn.asp文件

<%'连接数据库开始dbpath=server.MapPath("db/userm.mdb")set conn=server.CreateObject("adodb.connection")'创建连接对象connstr="PROVIDER=Microsoft.jet.OLEDB.4.0;data source=" & dbpathconn.open connstr%>

Web应用程序开发@29-106

1、一个层的回顾

复习1

.all{
       height: 200px;    width: 200px;}.top{
       height: 50px;    width: 200px;    background-color: aquamarine;   }.left_bottom{
       height: 150px;    width: 80px;    background-color: aqua;    float: left;}.right_bottom{
       height: 150px;    width: 120px;    float: right;}.right_bottom_top{
       height: 75px;    width: 120px;    background-color: beige;}.right_bottom_bottom{
       height: 75px;    width: 120px;    background-color: darkgray;}

4.7小测前复习

①个人主页设计

个人主页界面设计

补充

line-height:设置行高控制字体位置，text-align:center;仅居中

一条分割线 .border{ border:inset 2px #FFC;}

图片插入<img src="1.jpg" width="200" height="300" />

<marquee>字体滚动</marquee>

②商城主页布局

补充

position

小结

margin：层的位置

float：层的浮动

clear：不允许浮动

在设置层的宽度和高度时要把层的边框所占的宽度值考虑进去

width和height指的是内容区域的宽度和高度增加了padding的值后，实际的总高度会相应增加。

③简易BBS

讲JS的略过

④student

student

string user;        string pswd;        string sex;        string realname;                    string email;        string adress;        string phone;        user = Request.Form["txtName"];        pswd = Request.Form["txtPsswd"];        sex = Request.Form["rblSex"];        realname = Request.Form["txtRname"];        email = Request.Form["txtMail"];        adress = Request.Form["txtAdress"];        phone = Request.Form["txtPhone"];        //建立数据库连接                string constr = "Data Source =.; Initial Catalog = userdata; Integrated Security = True";        string strsql = "select count(*)from UserInfo where userName like '" + user + "'";        SqlConnection conn = new SqlConnection(constr);         SqlCommand com1 = new SqlCommand(strsql,conn);         conn.Open();         int flag = (int)com1.ExecuteScalar();           conn.Close();         if (flag == 0)         //向数据库添加一条记录         {
                string strinsert = "insert into UserInfo (UserName,Pwd,Name,Sex,Email,Phone,Adress) values('" +                user + "','" + pswd + "','" + realname + "','" + sex + "','" + email + "','" + phone + "','" + adress + "')";             SqlCommand com2 = new SqlCommand(strinsert, conn);             conn.Open();             com2.ExecuteNonQuery();             conn.Close();             Response.Write("注册成功！");            logb.Visible = true;         }         else         {
                lbMessage.Text = "对不起该用户名已经存在，请选择其他用户!";             txtName.Text  = "";             txtPhone.Text ="";             txtPsswd.Text  = "";             txtAdress.Text  = "";             txtRname.Text  = "";             txtMail.Text  = "";                     }

连接MySQL

string constr = "Data Source =.; Initial Catalog = userdata; Integrated Security = True";string strsql = "select count(*)from UserInfo where userName like '" + user + "'";SqlConnection conn = new SqlConnection(constr);SqlCommand com1 = new SqlCommand(strsql,conn);conn.Open();

上一篇：Typora使用小手册

下一篇：C#程序设计经典教程

发表评论

关于作者

喝酒易醉，品茶养心，人生如梦，品茶悟道，何以解忧？唯有杜康！

-- 愿君每日到此一游！

	填写个人资料
用户名
密码
确认密码
性别
真实姓名
电话
e-mail
地址