搜索
WEB1、html基础(1)什么是html?hypertextmarkuplanguage,超文本标记语言。用于开发网页的语言，由浏览器解释执行。html文件以.html/.htm结尾。(2)html文件的基本结构htmlheadtitle标题/title!--用于模拟http消息头--!--比如，以下消息头的作用，是告诉浏览器，返回的是一个html，并且，应该以utf-8的编码来显示该页面,html文件保存的编码应该与meta声明的编码一致--metahttp-equiv=content-typecontent=text/html;charset=utf-8!--引入脚本--script!--定义样式--style!--引入外部样式--link/headbody!--页面显示的数据--/body/html(3)web开发标准w3c建议，开发一个页面，应该这样设计：页面的结构（包括了数据），由html文档来负责。页面的外观，由css文档来负责。页面的行为，由javascript文档来负责。(4)链接a,基本使用ahref=url地址target=_blank描述/a_blank:在新的窗口中打开url地址所对应的内容_self:在当前窗口打开（默认）b,使用图片作为链接ahref=url地址imgsrc=图片地址width=height=border=//ac,使用热点imgsrc=index04.jpgwidth=500height=500border=0usemap=#m1/mapname=m1id=m1areashape=rectcoords=…href=#/areashape=circlecoords=…href=#/areashape=polycoords=…href=#//map当shape=rect（矩形）时，coords的值为左上角和右下角的坐标值;当shape=poly（多边形）时，为各顶点值;当shape=circle（圆形）时，为圆心坐标值和半径值。coords值依照图片大小的不同和所希望链接区域的不同而有所不同d,使用锚点:在同一个页面内部跳转aname=top/aahref=#top/ae,发送邮件ahref=mailto:sally@126.com?subject=hello/af,链接中的伪样式（css中再讲）(5)列表ula,无序列表b,有序列表lic,列表嵌套(6)表格a,基本使用tableborder=cellpadding=cellspacing=width=trtdalign=id/tdtdname/tdtdsalary/td/trtrtd1/tdtdzs/tdtd2000/td/tr/tableborder:边框的宽度cellpadding:单元格里面的数据与单元格边框之间的距离cellspacing:单元格之间的距离width:60%/600宽度align:水平位置left/center/rightvalign:垂直位置top/middle/bottomb,不规则的表格cospan:跨列合并rowspan:跨行合并c,表格的另一种写法tablecaption标题/captionthead/theadtfoot/tfoottbody/tbodytbody/tbody/tablethead:表头，0/1tfoot:表脚,0/1tbody:表体,1/nd,表格可以嵌套(7)表单什么是表单：用于收集用户的信息，比如登录表单可以让用户输入登录的用户名、密码，这些信息会提交给服务器来验证。forminputtype=text//forminput标记:type=text:文本输入框type=submit:提交按钮type=reset:重置按钮type=password:密码输入框type=radio:单选type=checkbox:多选type=file:上传文件(必须给form添加enctype=multipart/form-data)type=hidden:隐藏域非input标记:textarea:多行文本输入框select:下拉列表/多选框(8)框架什么是框架，用来将一个窗口划分成多个子窗口。a,frameset,frame注意：frameset不能写在body里,可以嵌套使用。b,iframe属性：widthheight可以使用在body里，表示嵌入一个子窗口。(9)其它标记h1...h6:标题行内标记:不单独占一行的标记span/spanstrong/strong块级标记:另起一行的标记h1...h6标题table表格form表单p/p段落div用于布局(10)实体在html页面中，出现了空格、,,,&,应该使用实体来代替。 空格><"&(11)html/xhtml:xhtml:扩展的超文本标记语言。w3c按照xml语法要求重新定义了html中的标记与相应的属性。比如要求标签必须层层嵌套，属性必须用引起来，标签必须要结束。尽量使用小写。fontcolor=red:error!fontcolor=red:ok!br:error!br/:ok!html/xhtml文档类型声明常见的文档类型声明XHTML过渡型!DOCTYPEhtmlPUBLIC-//W3C//DTDXHTML1.0Transitional//EN严格型!DOCTYPEhtmlPUBLIC-//W3C//DTDXHTML1.0Strict//EN严格型!DOCTYPEHTMLPUBLIC-//W3C//DTDHTML4.01//EN松散型!DOCTYPEHTMLPUBLIC-//W3C//DTDHTML4.01Transitional//EN、css(1)cascadingstylesheet级联样式表，按照w3c的规范，页面的数据与结构由html来负责，页面的外观（展现给用户的界面）由css来负责。(2)css的基本语法选择器名称{属性：属性值;属性2：属性值2;}比如#d1{font-size:50px;}(3)施加样式（将样式施加到指定的html标签之上）通过选择器来施加。a,标签选择器body{font-size:50px;background-color:#cccccc;}对具有相同标签名的所有标签起作用。b,class选择器.选择器的名称{}对标签class属性值和选择器名称相同的标签起作用。标签名.选择器的名称{}标签的class属性要与选择器名称相同，并且标签名要一致。c,id选择器#选择器的名称{}标签的id属性要与选择器的名称相同。d,选择器的分组div,h1,p{font-size:120px;}表示对div,h1,p都施加该样式e,选择器的派生divp{font-size:150px;}(4)样式的继承子标签会继承父标签的样式。(5)样式的优先级浏览器默认样式外部样式:使用link引入外部的.css文件。内部样式：使用style定义的样式内联样式:使用标签的style属性定义的样式从上往向优先级增大。(6)几个重要的属性a,位置相关的属性margin:外边距margin-left:margin-right:margin-top:margin-bottom:也可以简写为margin:顶，右，底，左margin:0px;margin:20pxauto;左右居中，顶、底各20px;padding:内边距padding-left:padding-right:padding-top:padding-bottom:也可以简写为padding:顶，右，底，左内边距在使用时，要注意，子标签会将标签撑开。b,边框border:宽度样式颜色;border-left:左边框border-right:border-bottom:border-top:c,背景background-color:#cccccc;背景颜色background-image:url(图片的地址);背景图片background-repeat:no-repeat/repeat-x/repeat-y;平铺方式background-attachment:fixed/scroll(默认);background-postion:100px200px;background:背景图片地址平铺方式依附方式水平位置垂直位置d,文字font-size:文字大小font-weight:粗细100-900font-family:字体text-decoration:none/underline下划线cursor:pointer（小手）/wait（沙漏）光标text-align:left/right/center对齐方式e,列表list-style-type:none;除掉小圆点f,关键属性float:浮动left/right其作用：取消块级标签的独占一行的特性，也就是将竖排列表横向化。clear:取消浮动both;line-height行高(7)布局：清空body,ul,li,img{margin:0px;padding:0px;font-size:12px;}(8)链接的伪样式a:link{color:red}没有访问时a:visited{color:blue}访问后a:active{color:lime}鼠标点击但还没有放开时a:hover{color:aqua}鼠标指向时display属性：block:html标记以块标记的形式来显示inline:html标记以行内标记的形式来显示none:隐藏html标记position属性：static:(默认值)浏览器默认将html标记按从左到右，从上到下摆放。{行标记从上到下，了标记从左到右}absolute:相对父标记偏移relative:先按照默认方式摆放，然后再偏移1、javascript基础(1)javascript是什么，能做什么？是网景公司开发的一种用于与页面进行交互的脚本语言。javascript程序在浏览器端执行。javascript程序可以写在.js结尾的文件里。作用：a,前端验证（就是对用户提交的表单中的数据进行验证，比如验证用户名是否为空,如果验证通不过，则浏览器不会将数据提交给服务器）。b,ajax核心技术之一，用于异步向服务器发送请求并动态更新页面。c,与页面进行交互，生成动态的效果。d,获得浏览器相关的信息。(2)javascript的组成部分ECMAScript:语法基础（已经标准化了）DOM:文档对象模型（部分标准化了）BOM：浏览器对象模型（没有标准化，但是大部分浏览器都支持window,location,history,screen等对象）。2、语法基础(1)数据类型a,基本数据类型number:数字类型string:字符串boolean:true/false布尔类型null:变量没有存放任何对象的地址undefined:未定义alert(a);b,引用类型变量Object:对象Array:数组Date:日期函数Math:数学计算(2)变量javascript是一种弱类型