python与web前端设计实践_第1页
python与web前端设计实践_第2页
python与web前端设计实践_第3页
python与web前端设计实践_第4页
python与web前端设计实践_第5页
已阅读5页，还剩14页未读， 继续免费阅读

下载本文档

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

文档简介

python与web前端一、实践目的1.素养提升（1）心智训练（2）思维锻炼掌握技能掌握HBuilder软件了解CSSweb前端Python互联网相关知识二、实践内容1.素质提升（1）心智训练通过两周的实践，我学到了很多知识，但学到最多的是心智提升，在别人已经放假回家的时候我们在学校学习对我们有益的知识，在别人在家吹着空调时，我、在教室流着汗水，但我们收获了很多，在这段经历中我们在炎炎夏日沉下心中的焦躁与烦躁，把他们化作学习的动力，化为对学习的渴望，经过两周的学习，我的心智在不断的提升，相信对我以后的生活会有着很大的帮助的。思维训练两周的时间，说长不长说短不短，但学习的知识却是十分充足的，在两周的时间里让我体会到了程序员的辛苦，也初步培养了程序员应有的编程思维，在对今后的生活中，这种思维会对我有很大的帮助，做事一步接一步，一层套一层，逻辑分明，细心仔细，让我在今后的生活中做事有规矩有纪律。在对一件复杂的事情中，细分各个模块逐个击破，既能把复杂的问题化为简单问题，在有规矩的进行做事，也能更好的减少错误，做事仔细细心.2掌握技能掌握HBuilder的使用方法掌握技能(1)HBuilder的使用方法：HBuilder是常用在支持web开发的IDE与在JAVA、C++、C、和ruby的编辑语言是Dcloud公司所发明的一个支持HTML5的编程软件.运行速度快、占用面积小、简单容易上手操作,并且使用了许多完整的语法提示和代码输入法等,大幅各类编程语言的的开发效率这是HBuilder的优势所在，也因为使用HBuilder使得能让我们这类新手更加容易上手编程,用较短的时间进入编程的世界,在两周的实践中,学习的知识都在此软件上体现,所以说使用HBuilder是一切实践的根本的基础。CSS:CSS称层叠样本表这是一款表示在HTML和HTML5、XLML等文件样本的计算机编程语言。CSS的特点是可配合各类语言动态地对网页中的各个元素进行总体格式化修改、并且也可以在静态的情况下设计和修饰网页,特点：:CSS在Web前端设计领域是一个重大突破。可以利用它来实现修改较小的样本更新和它相关的所有页面元素。是设计与修饰网页常用的软件之一、几乎能适应全部字体、字号、而且还为HTML提供了一个样本性的描述

总地来说,CSS具有以下几个特点:丰富的样本定义了CSS提供了丰富的文档样本,并且设置文本和背景的功能;允许为所有元素创建文本边框,以及元素边框与其他元素间、内容间的距离,;能任意的改变文本的大小写、修饰以及其他页面展示效果。方便的使用和修改CSS可以将样本定义在HTML的style模块中,也能使之定义在HTML的header模块,而且也可以将样本的声明在一个专门的CSS文档中,以方便HTML的引用。总之,CSS样本使所有的样本声明统一存放在文档中,进行管理。此外,CSS将相同的元素进行归纳,让其使用同一样本进行定义操作,也能将其中样本应用到同名的HTML标签中,而且也能将一个CSS样本指派到某个网页页面元素中。如果我们需要要修改样本时，应在所对应样本列表中找到样本进行修改、因为拥有多页面的应用所以能将样本表存在一个独有的文件中使得样本表可以应用在任何页面文件中、等待被引用因此达到了多个页面的风格一致性。层叠,层叠是对元素的多次设置同一个样本。例如使用同一套CSS样本表可对一个站点中的多个页面,而某些页面中的某些元素想使用其他样本,就可以针对这些样本单独定义某个样本表应用到页面中。而之后定义的样本将会对之前的样本设置进行重新改写,所以最后的设置样本效果将会在游览器中所展现。而定义了效果的网页的网站中会产生大量的标签、会让页面的文件大小大大的增加，这是因为在使用了HTML后、需要大多数FONT形成的大小内容不一样的文字样本和许多重复的表格，如果想要大大的减小页面的体积，那需要将样本的声明独立的放在一个CSS的样本表中,因此在加载页面时所浪费的时间也会大大的缩小。此外,CSS样本表的使用会更大程度的缩小页面的所占空间,缩短了下载的等待时间。Web前端的应用<1>常用的标签：标题标签：h1h2...h6h7换行标签：bradb斜体标签：a/em水平线：hr加粗：abc/strong/空格符：a/ /a;段落标签：<p>123123123123</p>块元素：<div>独占一行行内元素<div>所有的标签内容在一行列表标签：有序列表ol>li超链接:a表示可以跳转到指定的路径图片：imgspan标签：可以将文本中的某些字体突出显示<2>表单标签：/action:表示提交的服务器地址/method：提交到服务器的方式http://localhost:63342/实践/form表单/res.html?username=abc&pwd=123456?表示后面跟着的是我们输入的表单里面的参数=左边是参数的类型名称右边是参数的值也是我们输入到表单里面的内容&表示链接多个参数。get方式提交参数：（安全性差）地址栏上直接显示相关参数。action:服务器地址。method：表示数据提交到服务器的方式。查看参数方式：浏览器右键》检查或者键盘F12（谷歌浏览器）<3>常用的表单元素:type表示输入框的类型name表示服务器介绍参数的依据password密码radio单选按钮select下拉框checkbox复选框reset重置submit提交表单<4>表格:<table>表格标签<tr>表示行<td>表示列<th>表头标签<align="center">表示居中显示加边框：粗细是1px虚线绿色例如border:9pxdashed#e16055;Python3.Python环境配置：（1）环境变量：Anaconda：点击计算机---右键----点击高级设置----选择环境变量----path选项：编辑----新建选项：E:\anaconda\Anaconda\wwwwin键+R打开黑窗口：输入命令：condalistscrapy（2）pycharm安装：64bit.py勾选。启动之后：配置configer----settings--python语法：此次学习python语法主要学习：了解python、了解python的变量定义、了解运算符了解python的变量数据类型、了解字符串的表示方法、（1）变量数据类型:int、char、浮点型、布尔、日期型等日期类型：获取当前时间的三种方法：日期类型获取当前时间引入时间类库字符串常用方法：拼接字符型str3=str1+str2+strprint(str3)去除首尾相同字符str4="asdssdsfsdfdsfdsfaza"print(str4.strip('a'))大小写的转换print(str4.upper())str5="ASDSADASDSA"print(str5.lower())计算字符串长度print(len(str5))流程控制语句：1.if语句：num=**if(num>**):print("**")elif(num>**):print("**")elif(num>**):print("**")else:print("***")循环语句：流程控制语句for使用在控制台上面输出4-29的整数foriinrange(4,31):print(i,end="")在控制台上面输出20以内的整数foriinrange(20):print(i,end="")互联网相关知识：互联网，英文是internet，又称国际网络，属于传媒领域。指的是与医学、哲学、数学、工程学、农林学、海洋学、地质学、天文学等相互联系在一起的强大世界性网络。互联网是始于1969年美国的阿帕网。这种人们把计算机网络互相关联在一起的方式可以称之为“互相网络”，在这基础上延伸出覆盖全球的世界性的网络称互联网，即是相互作用在一起的网络巨大集成结构。万维网简称Web是1994年在麻省理工学院成立的，万维网是依靠互联网运行的，而且万维网是其所能提供的众多服务的其中之一。所以万维网并不强于互联网互联网的基本优势主要有一下几点：互联网受世界人们所推崇的根本原因在于它的成本不高，其中优点如下：互联网能够不受时间、时空的限制的来进行信息交换。互联网可以使人与人，人与信息相互交流。互联网的使用成本较低、可以通过信息交换来替代实物之间的交换避免了许多现实的中的麻烦信息交换逐渐趋向于独立化、精准化（也就是可以满足所有人的精准需求要求）互联网服务的人数广泛、并且涉及每个领域包括医学、哲学、数学、工程学、农林学、海洋学、地质学、天文学等有利用价值的信息能被互联网说整理、分配，信息储存维度复杂、效率高、处理文件速度快实践过程登录界面设计：<!DOCTYPEhtml><html> <head> <metacharset="UTF-8"> <title></title> </head> <style> .aaa{ width:350px; text-align:right; } .bbb{ text-align:center; width:350px; } .ccc{ width:350px; margin:0auto; } </style> <body> <divclass="ccc"> <body> <formaction="xuanzhe.html"> <table> <tr> <tdclass="aaa">请输入用户名</td> <td><inputtype="text"></td> </tr> <tr> <tdclass="aaa">请输入密码</td> <td><inputtype="password"></td> </tr> <tr> <tdcolspan="2"class="bbb"> <inputtype="submit"value="登录"> </td> </tr> </td> </tr> </table> </form> </body> </div> </body></html>选择页面设计：<!DOCTYPEhtml><html> <head> <metacharset="UTF-8"> <title></title> </head> <style> p{ text-align:center; } b{ text-align-last:center; } </style> <body> <p><ahref="jisuanqi.html">计算器</a></p> <p><ahref="denglu.html">退出</a></p> </body></html>计算机设计：<!DOCTYPEhtml><html> <head> <metacharset="UTF-8"> <title></title> <linkrel="stylesheet"href="css/kuanjia.css"/> </head> <body> <divclass="zong"> <ahref="denglu.html">退出</a><ahref="xuanzhe.html"><span>返回上一页</span></a><divclass="tui"> <divclass="xianshi"> <inputclass="xianshi"type="text"value="0"/></div><inputclass="yunsuan"type="button"value="MC"/><inputclass="yunsuan"type="button"value="MR"/><inputclass="yunsuan"type="button"value="MS"/><inputclass="yunsuan"type="button"value="M+"/><inputclass="yunsuan"type="button"value="M-"/><inputclass="yunsuan"type="button"value="←"/><inputclass="yunsuan"type="button"value="CE"/><inputclass="yunsuan"type="button"value="C"/><inputclass="yunsuan"type="button"value="±"/><inputclass="yunsuan"type="button"value="√"/><inputclass="yunsuan"type="button"value="7"/><inputclass="yunsuan"type="button"value="8"/><inputclass="yunsuan"type="button"value="9"/><inputclass="yunsuan"type="button"value="/"/><inputclass="yunsuan"type="button"value="%"/><inputclass="yunsuan"type="button"value="4"/><inputclass="yunsuan"type="button"value="5"/><inputclass="yunsuan"type="button"value="6"/><inputclass="yunsuan"type="button"value="*"/><inputclass="yunsuan"type="button"value="1/x"/><inputclass="yunsuan"type="button"value="1"/><inputclass="yunsuan"type="button"value="2"/><inputclass="yunsuan"type="button"value="3"/><inputclass="yunsuan"type="button"value="-"/><inputclass="ling"type="button"value="0"/><inputclass="duli"type="button"value="."/><inputclass="duli"type="button"value="+"/><inputclass="dengyu"type="button"value="="/> </div> </div> </body></html>淘宝页面设计：} .div2{ width:900px; height:90px; background-color:bisque; margin-left:9px; margin-top:0px; margin:0pxauto; text-align:center; line-height:70px; font-size29px; } .div3{ width:600px; height:490px; background-color:darkturquoise; margin-left:0px; margin-right:25px; margin-top:0px; font-size:49px; text-align:center; line-height:490px;}.div4{ width:350px; height:490px; background-color:lightseagreen; margin-left:600px; margin-right:0px; margin-top:-490px; font-size:29px; text-align:center; line-height:490px;}.div5{ width:90px; height:90px; background-color:darkkhaki; margin-left:90px; margin-right:90px; margin:0pxauto; font-size:29px; text-align:center; line-height:90px;}.div6{ width:350px; height:49px; background-color:brown; margin-left:1px; margin-right:1px; margin-top:9px; font-size:20px; text-align:center; line-height:49px;}.div7{ width:80px; height:90px; background-color:darkseagreen; margin-left:9px; margin-right:9px; margin-top:9px; float:left; font-size:49px; text-align:center; line-height:90px;}.div8{ width:900px; height:90px; background-color:aquamarine; margin-left:0px; margin-right:0px; font-size:49px; text-align:center; line-height:90px; margin-top:0px; font-size:49px; line-height:90px;} </style> <body> <divclass="div1"> <divclass="div2"></div> <divclass="div3"></div> <divclass="div4"> <divclass="div5iconfont">HI</div> <divclass="div6iconfont">淘金币会员俱乐部!</div> <divclass="div7iconfont"></div> <divclass="div7iconfont"></div> <divclass="div7iconfont"></div> <divclass="div7iconfont"></div> <divclass="div7iconfont"></div> <divclass="div7iconfont"></div> <divclass="div7iconfont"></div> <divclass="div7iconfont"></div> <divclass="div7iconfont"></div> <divclass="div7iconfont"></div> <divclass="div7iconfont"></div> <divclass="div7iconfont"></div> </div> <divclass="div8"></div> </div> </body></html>页面展示：11111111111111111111111111111111111111111111实践体会随着大数据进军着我们的生活，每一天我们都在面临着大数据时代所带给我们机会与挑战，大数据是的存在有利有弊在每天给我们生活带来便利

人人文库> 全部分类> 毕业设计 > 任务书类

温馨提示

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

最新文档

评论

0/150

提交评论