表单网页的制作及数据库创建和连接_第1页
表单网页的制作及数据库创建和连接_第2页
表单网页的制作及数据库创建和连接_第3页
已阅读5页，还剩8页未读， 继续免费阅读

下载本文档

版权说明：本文档由用户提供并上传，收益归属内容提供方，若内容存在侵权，请进行举报或认领

文档简介

1、学生实验报告课程名称电子商务网页制作实验成绩实验项目名称表单网页的制作及数据库创 建和连接批阅教师沈金实验者学号专业班级电商1111实验日期一、实验预习报告（实验目的、内容，主要设备、仪器，基本原理、实验步骤等）（可加页）实验内容：1、登录和注册网页的制作（截图展示），并说明两个网页中共使用哪些控件2、对应数据库的建立，分别使用 SQL server和ACCESS建立相应的数据库和数据表，并用截图+关系模式表示出来。二、实验过程记录（包括实验过程、数据记录、实验现象等）（可加页）1.新建站点，打开网页一，插入 div标记，并设置相关字体的标题，插入表单及表单中的相 应的选项，其中包括“字段集”

2、、“文本域”及按钮等选项，页面一中的代码如下图所示 ：<di.v id-H fatrwi?<h3）已淫M用户登Kf r rir -i n mf+ho3=,7posFtrJ rie = ,T pLoginw ic-* apLof in" ?' r-<fieldset>户彈录 </legend><dlv><label fcr=" UajiLeff>用户<ir.；iut :nunu?二"ext"" i 1 二"JLajiE” nime二"13" m

3、ay .'!=*30<br/><div><label 'fcr=<vpasswrd*> </labl>< r.put tl-'.n-= passvotd"pe二鸭orcT Ld = ,vpas3wrd"18 1二吧 lPl二"30"<br/></div>1<div elass'forfl+passXa聽意记密码丫没荷滕邑"<a</div></field.set></div>添加表单后

4、的效果图如下所示；巨注I勢=二二二给登录页面添加如下样式；st yle 土Eic土/ cmm*<1 body fcxrt-family:Helveticaj fans-setif.f oift-size: 12px eclor: S66C666:bacltground-color： #.PFt eirtalign: c erft er , *margin:0padding:0;Pa color： S1E7ACE:text-decorat ioTi： tmfLe:a：hover color! 5000:text-de co rat ion: underlinefont-size! iqp迂

5、 f OFitvrei gtit! boliftformwrapper text-align： left. margin:15px auto padding: 20px: width: 45Cpx: border: Ips soLil #A4CDF2: input 彳fant-siE6： 1 lp inargiri； 2px padding: lpx;fields e+ paddirt： lOps margin-top: 5px border:Ipx salid: back giound: iff ff fieldset legend font-wight: bold .padding： Sp

6、K ZOpjt 3ps : border;IpK solid:fieldet label t ext-align: right mar gin： Ipoc padding: 4pic： float: left: vidth； 12Dpx:fieldset div clear:Left. margin-batt on:.1” ent ertext-align:eent:* ?1 e ax cle ar: both,添加样式后效果图如下：用 用户容1iJ密码i|1 J1旦据囲應忘记密码字没有贩号,1翅 J预览该页面，会看到最终的登录页面的效果图如图所示:已注册用户登录用户登录您忘记密码？没肓除号，

7、注册单击登陆页面的“注册”超链接，将跳转到注册页面，新建HTML文档并保存为2-html ,切换至代码视图,在<body>和</body>间插入一下的代码：<div id-wfotm>rapp&t，fXh3未连册创建帐户</h3>1'ouiL _一 t 二!j：.-"" :il . . 1.丄二"pomt"' ut.uL p 5=mtil t ip art /f rM- dat a* i.r ；-* apFcrn i 1= apForm<fieldset><lege

8、nd>S 户決册 </legend><p><strong>®的电子挪箱不会據公布出去，但是必滇填写。</strong在倒建册之前済先认算阅读脈务榮款。</p> <div><label forsams用户</labtl>I put nau=ffNanef f.yt e-*textvaluer空込8="2：iz L. *30*； <br/></div><div><label foi=*Email*>电子0ffi</label>&l

9、t;.input namE二"Email" id=*Em.ailw type=*-teHt"' size="20* iiasleingth* 150"* /><br/><7 di><div>ilabl fQxpassvo 匕订*密码/label)-<zLnpu+ n ajne= Pas sv ot d-* i d= * T as sword* "type=*pass,word* s ize= 18* iLaslength 15 n -Cbr/)-</dl.v> <

10、;div><label fotcdinfirjh-passitford"重设密码</label>< input najne=* conf irmpassiord* 1 != * conf i r m_p as swo rtype=*p as sword* size=w 18* rLaiclen/. L-* 15* /. <br/></div><div><label性别：</Lnbal>m女保5簡"radio"1""e尿已藍_1""radio&

11、quot;I "2"-17 sex，vsex_2，T17 radio""3"</ div><di 寸<label Mt8( : </label>密 fl女保2纸视第报电网i ：ipu+ r.rmR=" sex" id= s&x_0radi, inpyt nana= ssx idp sex_l .radio valuer 2丄：屮丈 i ,_lj-.'.- "sex'" id-" sex_2"typ- * radio"

12、 v il jl- "3" C/div><iiv>匚1呂21知适本网站途径：</label>-injiirt r.Lirift-'f rojB*" i -i_*froni_0" typecheckbox" 亍i Cinput "f rcn" i i-"from_l" r iTe-'checkbos* value Cinput namf ron* id="froim_2' l； "checkbox" i i C/div>

13、;<ii><label for="Ifyimage11'>头椽團片二 </labelsi:】Trrttyp尸二"filx"</ div><1V><label f">头像图片：</label>-if-i '.t n 二i l二"lyijn：age" t；Tl>i=/vf ile* . ></div><div><label for=*likeBlo(">frt网站的虜觉；</labe

14、l>jl L-. u . :u'Le- likeBlogv rd w likeBLo£A，Kept ion value=fl 1 丰 fltJfG opt im< action ¥/lue="2"瞩矗/oplin> i?t-. q?i gh：="3" 般 心prig.、option value=*4，T 徊差 oprtion>Qselect ></div><diu><label f01="textshtnme>MI®ift明：</lab

15、els<1 ext are 3 TL3jne=*t exlShuwMe* id=，*t e(xt ShovfleH col s=*35* rows=*5*X/t ext stf</div><div><label for='vAgreeToTerBEF>H意服务棗H</label>il ,j'_L ilAgreeToTerjns i AgreeToTerns L ；p checkbos*' 上_二"1" / /<a h"£="#“您是否同意册务条隸"先看

16、香杀隸吗？ </a>*</div>-dxv das ent er"ii niur-crea-t &79V'；q- e=(Tsubmit c3ar?'-(r'but-toniw = 提交"<uput ii'iju creat 8 79117 reset1 i." butt om 'j-lI "重弟"<7di>的MflfliW臭时，起们讪为您己竝画总了戢fl的眼袴案67、*谊里的ftSTfI®Zl： 10fittSfc- </rtrMiE>

17、;</j)></f irlif5et>C7torjiy</div>添加样式后的效果图II:未注AB创建帐户i : fflpES，但星恵须审号。在您土册之前诸先认真闻请廉!I；:如匾子arw不莹被处布出去:丙琢'''用户名电子邮箱-1i :彗哼于甥愛警.口廻纸口包规.2四欝'：r嘉亦丘孑门IT一饰对直因站的感觉1其他说明;；立怖提交您的连珊信息时套们认妁奁已经同意了复til的喝劳棊謊。 ;宠里的条款可驭在修未同意之前进行棒改 I点击预览该网页，会看到最终的注册页面的效果图，如图所示:未注册创戦户用户需r晨备字用电刊隴* （舷十五

18、亍宇荷=）重设钙恤；男女 1杲密吏拠稠站逸径：I抿维鬥邑视网络头嚴片；II边宣幅过本网站的恶觉；非常好冋其他说明：同創臍荼款先看看荣和吗厂:髓翳鲫離翳査鹦瞬鉀盲卸的叱丸添加spry样式，点击菜单栏中的"插入”-“spry ”，选择相应的选项进行添加未注册创建帐户用户注JB魅的审韦ir箱栄会被公布出去，但是! 匹EB斓务薊二 二 匪負I ，电壬起箱二】彗殳皙码 * . * . . 4.匚;'性别；® s ® ® 1L利這*耐圈空冃砌百电视I；头像凰片：匚二加寸圭融的感 -车菁毎；貞矗曲；预览该页面，会出现如下的效果图:“创启动access，选择“文

19、件” | “新建”命令，再选择“空数据库”选项，输入文件名“登录表”，单击建”按钮即可完成新建登录数据库，此时Access程序就会弹出登录数据库的窗口，如图所示：n ame双击“使用设计器创建表” 选项，弹出创建表的输入界面， 在界面填入name和password两个字段，将 设为主键，单击“保存”命令，弹出“另存为”窗口，在表名称中输入“登录表”，点击确定_J登聂衷:表0侖注F柯宮蹲ord数宇双击“登录”表并打开，在表中添加相应的数据豊录：衷皿那0pissiY?r i123456012345701234580咅予航雁1234590.01按照同样的方法创建“注册”数据库，将name设为主键，如

20、图所示:-I注册栄宁段宕称豊卜 iiairsl#Emailpsword coufi rm_passwei dMyimAg* liLeBlogi双击“注册”表，在表中填入相关的数据:V注册；表ziaimeEmaj.1passwordc3n£irm p as ewotfflyimageLikeSlo g万聪54765376612345601234560女null龙洁琼454656T6Y12345701234570女null非常蚪42565876E1234560123458口女null非當蚪7舒航雁3566739991234501234550女null非常好1在站点的下方会出现一个web.

21、c onfig网页，打开网页会出现如下的代码:Dreamweaver中选择“新建”命令，在弹出的“新建文档”中选择“空白页”选项，然后再选择ASP单击“确定”按钮新建一个ASP文档，如图所示:页面类型,£空臼页空欖板一直示例中的页|樹協|樹|MTHL板能口 1整页）能口（片断）Acti orScriptCSSJavaScript£NLJSP JavaScriptASF ScriptASP.NET C# ASF NET VICcl4Jusi anColdJMlsi QTL 组件JSFPHP（2）单击“数据库”面板上的“添加”图标，选择“自定义连接字符串”选项，在弹出的对话框中

22、输入 连接名称和连接的字符串：点击“测试”按钮，会弹出如下的对话框:J连接宕称：皿昭逹接宇苻串诣Dr earn weaver摟： 使® ISII翻姻竝葩益鄆肖1则试确定1点击“确定”，系统自动创建名为 cong的数据库连接，如图：%交档类密：以 VE5anpt C日匕呼I由一翹登录I I s B注册田£观图田*预存过程启动SQL Server服务，然后启动“ SQL Server Management Studio ”，输入连接用户名和密码，单击“连 接”按钮，进入主界面，右击“数据库”一“新建数据库”，在弹出的对话框中输入所建的数据库的名称，修改路径名称，点击“确定”，会看到左边的栏目下多出了一个“wan”的数据库：-QB83B F也F圧加库快曜ReportServerReportServerTemp-DBtest训an言全性n ame在数据库 wan的下方找到表，点击右键中的新建表，在表中编辑字段和填入相关的数据类型，并将 设置为主键:列塔教据类型冗诈Null值. i Uli . 1 1 BIUB 1 IUI dill IIU II同

人人文库> 全部分类> 教育资料 > 课件下载

温馨提示

  • 1. 本站所有资源如无特殊说明，都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等，如果需要附件，请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸，网页内容里面会有图纸预览，若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间，仅对用户上传内容的表现方式做保护处理，对用户上传分享的文档内容本身不做任何修改或编辑，并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容，请与我们联系，我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

最新文档

评论

0/150

提交评论