web前端每月工作总结.docx

web前端每月工作总结篇一：web前端学习总结（精华版）Web总结一.名词解释1 .横切在固定页面的宽度（按栅格化进行）并且对高度没有限制的容器称 为一个标准横切2 .留白两个容器或碎片之间的上、下、左、右的空白距离3 .继承元素可以从其父级元素中获得一些可为自己使用的属性或值。4 .图片定位把图片元素放置到一个静态的、相对的、肯定的、或固定的位置中，利用CSS中对图片进行遮罩属性，多用于页面中的修饰图5 .底图页面中在标签中使用的背景图6 .齐底（图）线用于区分横切或碎片结束的线或图7 .页面结构页面的基础框架，由横切、布局元素组成8 .焦点区（图）最易留意的区域10 .特别状况下要求表现和内容分别，代码中不要涉及任何表现的元素,例如：style> font等；11 .双标记签都要有开头和结束标签，单标记标签的后面肯定要 加“/，例如：br/等，并且有正确的层次；12 .其它特别符号：1)()2)()八.命名空间8.1 外挂样式名称全局：public.css全局样式为全站公用，为页面样式基础，页面中必需包含。结构：layout.css页面结构类型简单，并且公用类型较多时使用。多用在首页级页 面和产品类页面中。私有：style.css独立页面所使用的样式文件，页面中必需包含。模块 module.css产品类页面应用，将可复用类模块进行剥离后，可与其它样式协 作使用。默认 default.css文章 article.css图片 photo.css下载 soft.css主题 themes.css实现换肤功能时应用。补丁 mend.css基于以上样式进行的私有化修补。8.2 常用名称(1)页面结构容器:container页头：header内容：content/container/content(A)页面主体：main页尾：footer导航：nav侧栏：sidebar栏目：column页面外围掌握整体布局宽度：wrapper篇二：Web前端基础总结l.Js的基本类型：Undefined:只有一个值undefined,它是变量未被赋值时的值，在 JS中全局对象有一个undefined属性表示undefined,事实上undefined 并非JavaScript的关键字,可以给全局的undefined属性赋值来转变它 的值。Null:只有一个值null,但是JavaScript为它供应了一个关键字 null来表示这个唯一的值。Null类型的语义是“一个空的对象引用。Number:NaN 是其一个特别的属性值，typeof NaN "number");String:其正式解释是一个16位无符号整数类型的序列，它实际上 用来表示以UTF-16编码的文本信息。Boolean:有两种取值true和 fa Ise o 0、NaN、空字符串、null> undefined转化为false,其余的全 部为true。Object:最为简单的类型就是Object,它是一系列属性的无序集合, Function是实现了私有属性call的Object, JavaScript的宿主也可以 供应一些特殊的对象。typeof*3,344+/zObject'关于null和undefined： null是关键字;undefined不是关键字， undefined是Global对象的一个属性。运算时null与undefined都可以被类型转换为false,但不等值于 false：document.writeln(!nullz !undefined); / true,truedocument.writeln(null=false); / falsedocument.writeln(undefined=false); / falsedocument.writeln(undefined=null); / truenull instanceof Object /falsetypeof null/Object2JS的类型转换手动的转换有：Number(x);Boolean(x);String(x);以及 parselntparseFloattoStringalueOf 等等。自动的转换：假如"+操作符的一个操作数是字符串，则会将另一 个操作数转换为字符串，一元操作符"*、-将操作数转换为数字， 一元操作符“！ 将操作数转换为布尔值并取反。/hello,+5/hello5,'hello'+null / 'hellonulKS*525十ello，*5NaNX+等价于 String(x)+X或者X-0等价于Number(X)!X等价于 Boolean(X)3 .margin 属性四个参数：上右下左三个参数：上、左右、下两个参数：上下、左右一个参数：四周4 .关于float问题，浮动元素后跟非浮动元素的状况。后边非浮动 元素若为行内元素且由于定位产生重叠时，行内元素边框、背景和内 容都在该浮动元素”之上显示，若为块级元素且由于定位产生重叠时, 该块级元素边框和背景在该浮动元素之下显示，只有内容在浮动元 素之上显示。【有示例】。Clear属性规定元素的哪一侧不允许其他浮动元素。clear属性定 义了元素的哪边上不允许消失浮动元素。在CSS1和CSS2中，这是通过自动为清除元素（即设置了 clear属 性的元素）增加上外边距实现的。在CSS2.1中，会在元素上外边距之上 增加清除空间，而外边距本身并不转变。不论哪一种转变，最终结果 都一样，假如声明为左边或右边清除，会使元素的上外边框边界刚好 在该边上浮动元素的下外边距边界之下。5 .肯定定位、相对定位与浮动定位肯定定位：absolute生成肯定定位的元素，相对于static定位以 外的第一个父元素进行定位。设置为肯定定位的元素框从文档流完全 删除，并相对于其包含块定位，包含块可能是文档中的另一个元素或 者是初始包含块。元素原先在正常文档流中所占的空间会关闭，就似 乎该元素原来不存在一样。元素定位后生成一个块级框，而不论原来 它在正常流中生成何种类型的框。相对定位：relative生成相对定位的元素，相对于其正常位置进行 定位。设置为相对定位的元素框会偏移某个距离。元素仍旧保持其未 定位前的外形，它原本所占的空间仍保留。浮动定位：浮动的框可以向左或向右移动，直到它的外边缘遇到 包含框或另一个浮动框的边框为止。由于浮动框不在文档的一般流中, 所以文档的一般流中的块框表现得就像浮动框不存在一样。示例代码就是最外层的div是relative,里面的就是absolute。6 .关于DOM元素利用DOM, JS可以相对简洁地查找、访问和操纵HTML元素，从 而动态地转变HTML页面的内容和外观。节点常用的属性有 parentNode, childNodes, firstChild, lastchild,previousSibling, nextSiblingo7 .关于函数定义挨次：函数的定义与其他的语句的定义不再同一个时间轴上 面，计算机在开头执行语句之前，会先查找全部的function的定义, 然后保存。所以在函数后面定义的调用语句可以调用到定义在前面的 函数。局部变量与全局变量：局部变量只适合于函数的参数和函数内部 已var关键字定义的变量。假如没有定义同名的局部变量，函数内部 则可能访问全局变量。闭包：首先要知道在js中，函数在一旦定义的时候就会产生自己 的一个作用域，而此后这个函数的执行也是要依靠于这个作用域的。 闭包的最常用的编程模式就是在一个函数中嵌套另一个函数，然后将 这个嵌套的函数作为返回值返回，当然外部函数中的局部变量也就存 在于这个返回函数的作用域中的，这样就起到了对局部变量的一个访 问掌握。但是缺点在于增大了内存的开支。而且其所派生的子类将不 能访问其私有属性，破坏了继承性。因此还是需要三思而行。闭包 可以用在很多地方。它的最大用处有两个，一个是前面提到的爱护函 数内部的变量，另一个就是让在内存中维持变量。我写的闭包主要用于实现一些插件，由于有一些变量需要避开被 全局变量污染。可选参数：JS不会限制传入函数的参数数目。假如传入的参数过 多，多余的参数会被忽视掉。假如过少，缺失的参数会默认为 undefinedoapply和call的区分：相同点:两个方法产生的作用是完全一样的。不同点：方法传递的参数不同，apply(obj,argl,arg2.) call(obj,argl,arg2)原型：全部对象都有一个原型，对象可以共享其原型的属性，但 是这种共享是单向的，即原型的属性影响对象，转变对象确不会影响 到原型。原型污染：使用for/in遍历对象的时候，会同时得到原来的 属性和原型的属性，可以使用HasOwnPorperty方法来推断。匿名函数：一般用来写已加载就需马上执行的函数。同时为了避 开受全局变量的影响，在一个不是很熟识的页面增加Javascript时特 别有效。8 .Div和Span有何区分?答：两者最明显的区分在于DIV是块元素，而SPAN是行内元素(也 译作内嵌元素)。所谓块元素，是以另起一行开头渲染的元素，行内 元素则不需另起一行，当然这一点也可以通过设置display (block,inlinejnline-block)来转 变。9 . CSS+DIV开发Web页面的优势有哪些?答:1）2）3） CSS+DIV,这个网页设计模式中，DIV担当了网页的内容，CSS 担当了网页的样式。这样就使网页的内容和样式的分别开来。有利于 页面的维护升级。有助于提高搜寻引擎亲和力（快速找到需要的数 据，而不是像在TABLE中一层层的查找）有助于页面的重构（换皮肤 如blog,直接套用另外一套样式就可以实现，而不用改动网页脚本。）4） .setinterval 与 setTimeout 的区分？ 答：setTimeout 方法是定时 程序，也就是在什么时间以后干什么。干完了就拉倒。setinterval 方法则是表示间隔肯定时间反复执行某操作。11） Ajax 及其优缺点： 答：Asynchronous JavaScript and XMLn （异 步JavaScript和XML）O在扫瞄器中使用js进行服务器的恳求与响应, 使得可以在不更新整个页面的前提下维护数据。其名字中的xml并非 指只支持xml这一种文本格式，xml只是一个选择而已，其他还可以 是表单与json。这样做只是xml流行时的遗迹。优点：使用Ajax的最大优点就是可以实现页面的局部刷新，提高 用户体验质量。其他优点有使用异步方式与服务器通信，不需要打断 用户的操作，具有更加快速的响应力量。3、可以把以前一些服务器负担的工作转嫁到客户端，利用客户端 闲置的力量来处理，减轻服务器和带宽的负担，节省空间和宽带租用 成本。并且减轻服务器的负担，ajax的原则是"按需取数据，可以最 大程度的削减冗余恳求，和响应对服务器造成的负担。4、基于标准化的并被广泛支持的技术，不需要下载插件或者小程 序。缺点：L干掉了 back按钮。由于在未刷新页面的时候是无法使用 back按钮的。2 .平安问题，将一些数据、规律暴露在了前台。3 .对搜寻引擎的支持较弱。4 .违反了 Uri资源定位的初衷。12.Prototype属性的相关留意问题13.call与apply的使用常用于实现继承。Call与apply的作用相同，只是参数的形式不一样而已。如 f u nc. ca 11 (f u ncl, va r 1, va r2, va r3)对应的 apply 写法为： func.apply(funcl,varl,var2,var3)Call的使用Apply的使用14.JS中大事绑定，什么时候有前缀。n,什么时候没有？兼容性问 题。答：下图显示了采纳三种方式注册的大事。兼容性问题可见：留意这两句写法：篇三：WEB前端开发阅历总结ASP.NET前端开发阅历总结通过此次大作业的设计到完成，我负责的是web前端的开发，经过此次作业和结合W3C上的自学，我慢慢有了一些对前端开发的小 小阅历（仅为个人看法）。WEB标准是什么？说是WEB标准，不过我这里主要是对HTML5和CSS3.0的一些阅 历总结。由于WEB含盖的内容实在是太多了，"WEB标准是一系列 标准的总称，包括 HTML5.0、HTML4.0、XHTML1.1、CSS3.0、CSS2.1、 XML1.0、RSS2.0、ECMAScriptl.l> DOM1.0 等等。所以这里要跟大家 指出来一下，WEB标准不是我们所说的DIV+CSS。刚刚上面提到了一一DIV+CSS,这里要说明下，这样说其实是不正 确的。DIV+CSS精确 的说法（个人的理解）应当是：采纳W3C 推举的WEB标准中的HTML5结合CSS3.0样式表制作页面的方法,DIV 应当指的是HTML标签，而CSS显示是指的CSS样式表了。采纳WEB标准开发的好处那么W3C为什么会推举这样的页面制作方法呢？下面我们就简 洁的看看采纳WEB标准开发（个人理解的）相对以前TABLE布局的 优势有哪些？1、节省运营成本看看我们的WEB标准制作方法是如何做到的？采纳WEB标准制作，我们可以做到表现很形式的分别，我们用 XHTML来表现（数据），用CSS来掌握（页面元素呈现的）形式。写 的好的页面，XHTML代码中基本上都是用户要看的数据，还其他修饰 性的东西，全部由我们的CSS来掌握。这样一来我们的（XHTML）页9 .导航在页面中具有导向性的链接集合10 .头图页面主题图片11 .间距碎片或文字间的距离12 .行高文字段落中行与行之间的距离13 .首行缩进文字段落首行缩进14 .浮动使被定义的区域脱离正常的页面文档流15 .碎片由文字、图片组合成的内容区域16 .通栏广告与页面内容区同宽的广告区域17 .功能按钮具有交互属性的按钮18 .私有样式当前页面独立使用的样式，不具备公用性19 .水平（垂直）居中在页面中的某个元素处于父级的上下或左右的相同距离 面的体积就大大减小了，这样你在带宽上的费用就会大家降低了，这 个怎么降低的，你可以想象一下，YAHOO的首页小IK, 100W个人一 起访问，那么带宽节省了多少？而且可以更充分的利用带宽。而我们的CSS掌握了，全部的页面元素的样式，现在想改网站的 整体风格，你只需要花几分钟修改一下一个CSS文件，就可以轻松搞 定了。维护的成本也下来了，省了不少钱了吧？还有，你开这个页面 的速度会快许多啊，一个让你等半分钟的页面，除非里面的信息对你 很有用，不然我们大家基本都没有太多的时间去用来等待的。2、对用户友好更友好，且有机会获得更多的用户现在来说说用户友好。首先我想把我们的用户来分下类。第一类：一般用户（每个访问我们网站的人）；其次类：搜寻引擎；采纳WEB标准开发的页面，结构清楚，页面体积小，扫瞄器兼容 性好。一般用户访问的时候，页面打开速度快，而且不管用户使用那 种扫瞄器，都能够正常访问（显示）页面，且页面的结构清楚，要找 的数据可以很便利的扫瞄到。而对搜寻引擎来说，一个好的采纳WEB标准开发的页面，都是做 过SEO优化的，它访问起来很友好，很简单理解你的页面中哪里是标 题（H1H6标签），哪里是段落（p标签），哪里是段落里要强调的内 容（strong标签）等，它可以很简单的分析出来。而一个SEO好的 站点，大家都知道，被搜寻引擎收录的机会更多，这个也意味着您的 网站会被更多的一般用户访问到，给你的站点带来更多的用户。一个能帮我们省下大笔费用，提高工作效率。同时又能够提高页 面扫瞄速度，对用户友好，甚至能够不花钱宣扬，就能给你带来更多 用户的技术。你说你会不会去使用它？这个也正式我们的W3C推举使用WEB标准开放网站的缘由啊。而 这个技术也得到了我们广阔用户的认可，所以现在需要学习WEB标 准啊。合理的布局前面我提到了一些学问点一一"结构清楚、SEO优化、页面体积小、 HTML代码中基本上都是用户要看的数据。这些东西，都是我做了合 理布局的结果。而且我个人觉得，我们采纳WEB标准制作的一切都 是从这个学问点开头的，所以我这里就先来说这个话题。或许有人会问，怎样的一个页面，才算是合理的布局的呢？这个 问题问题问得好，也是我们大家刚开头学用WEB标准的问得最多的 问题之一，我也曾常常被这个问题所困扰，这里就说说我对合理布局 的一些理解。在开头讲合理布局的页面要达到的要素前，我们还是用个实例来 讲解会更直观些。先来看看这个图片：不错，这个是一个文章具体页，没有左右两栏布局，不过这里我 重点要讲的是合理的布局。这是此次试验中customer （前端的一项）部分的完整代码：% PageLanguage二C#AutoEventWireup=truelnherits=Customer % % Register Src=Controllers/Bottom.ascxTagName=Bottom TagPrefix=uc4 % % Register Src=Controllers/Top.ascxTagName=Top TagPrefix=ucl % Register Src=Controllers/Left.ascx TagName=Left TagPrefix=uc2 % htmlheadtitle%=Titlep %/titlemeta http-equiv=Content-Type content=text/html; charset=gb2312 /meta content=%= Descriptionp% name=description/meta content=%=Keywordsp % name=keywords /link href = Images/css.css rel=stylesheet type=text/css /headbody style=text-align: centerform id=forml runat=servertable border=0 align=center cellpadding=O cellspacing=O style=width: 778pxtrtd style=width: lOOpxucl:Top ID=Topl runat=server /td/tr/tabletable border=0 align=center cellpadding=O cellspacing=O style=width:778px; background-color: #ffffff;trtd style=height: 395pxtable border=0 cellpadding=O cellspacing=O style=width: 778pxtrtd width=183 align=left valign=toptable width=183 border=0 cellspacing=O cellpadding=Otrtddiv align=leftuc2:Left ID=Leftl runat=server /div/td/tr/table/tdtd width=595 valign=topdiv align=centertable width=100% border=0 cellspacing=O cellpadding=Otrtdnbsp;/td/tr/tabletable width=100% border=0 cellspacing=O cellpadding=Otrtdimg src=lmages/a4.jpg height=37/td/tr/tabletable width=100% border=0 cellspacing=O cellpadding=Otrtd style=height: 12pxnbsp;asp:DataGrid ID=NewGrid runat=serverAllowPaging=True AutoGenerateColumns=FalseBorderWidth=Opx CellPadding=O GridLines=None Height=lpxOnPagelndexChanged=DataGridl_PagePagerStyle-HorizontalAlign=Right PageSize=4 ShowHeader=FalseWidth=237pxColumnsasp:TemplateColumnItemTemplatetable border=0 cellpadding=O cellspacing=10 width=560 trtd style=height: 24px width=20div align=centerimg height=13 src=lmages/35.jpg width=ll/div/tdtd class=textO3 style=height: 24px width=403ahref=Customer_More.aspx?ID=%#DataBinder.Eval(Container.Dataltem,id )%#DataBinder.Eval(Container.Dataltem,title)%/a/tdtd class=textO3 style=height: 24px width=77%#DataBinder.Eval(Container. Data Item,pub_date, 0:d)%/td/tr/table/ItemTemplateHeaderStyle Width=12px /asp:TemplateColumn/ColumnsPagerStyle HorizontalAlign=Right NextPageText= 下 一 页PrevPageText=上一页 /asp:DataGrid/td/tr/table/div/td/tr/table/td/trtrtd style=width: lOOpxuc4:Bottom ID=Bottoml runat=server /td/tr/table/form/body/html看出来什么没有？（代码是许多）可能大家已经发觉，整个页面 里基本上都是用户要看的数据，其中只包含了很少（必要）的布局 （XHTML）标签（请允许我这么说）。整个页面基本都是由最基础的 hlh6> p、ul、ol、li、form> div 标签来实现的。说到这里就要讲到我在前面提到的“结构清楚、SEO优化、页面体 积小、XHTML代码中基本上都是用户要看的数据，看看我的这个例 子做到了没有？结构清楚-也就是我们常说的，HTML标签要结构化。什么叫结构化？由于个人认为这个学问点是非常重要的，我采纳WEB标准的方法 制作页面的优势就体现在页面结构清楚。我以前用table布局的时候, 我的表现（数据）和形式（布局样式）是混在一起的，有许多冗余的 数据混杂在一起，而我上面给大家展现的代码，很明显，结构非常清 楚。hlh6-假如你要显示的数据是作为标题显示的时候，就用这些标 签，由于这个标签的意思就是说，这个是一个标题，不仅我们的用户 很简单理解h-head的英文字母缩写，我们的另外一个用户搜寻引擎 也可以很简单理解它。呵呵，看到了吧，一个充分结构化的页面，对用户是非常友好的。p-Paragraph （段落）ul-unorglized list（无序的列表）ol-orglized list（有序的列表）li-list item（列表项）form一表单div-division（区域）我写成这样就便于理解了，原来HTML标签是有着自己的意义的 （至于其他的标签的语意义，大家可以自己到W3C看看它的解释， 也可以查看语义化你的HTML标签和属性），所以我们讲要语意化的 意思，就是用合理的标签来显示数据，比如前面提到的，是标题，就 应当用hlh6标签，假如是一个段落的介绍文字，那么就应当使用p 标签，假如是显示的一个没有挨次的列表，就应当用ul标签，如此所以看这个例子里h2标签导航实例详解/h2这么写就是很合理的，h2标签就说明这里是个标题。而这么写: 复制内容到剪贴板代码：.titlefont-size:18px; )div class=titlestrong 标签导航实例详解/strong/div虽然用了 strong来强调说明这部分文字，但是还是没有h2标签 来的直接明白。还有这么写div class=ariticle-titleh2Ajax 标签导航实例详解/h2/div我并不喜爱写成这样，可以不用嵌套层的地方，我们尽量不要去 过多的嵌套层，削减嵌套会让扫瞄器解析起来会更简单，速度更快。所我们使用WEB标准开发页面，肯定不是单纯的把以前的table 换成DIV就OK 了。而采纳标准制作页面，也不意味着我们就不使用 tableo只要把握我刚才说的原则，使用合理的标签显示相应特征的数 据。其实我的table标签是一个很好的用来显示二维数据的标签，而 table标签也的确是设计出来用来显示数据的，而不是用来布局的， 只是许多人都会用table标签来布局了 o。20.标准头（尾）定义相同的页面头或尾元素集合二.文本格式化1 .段落：P2 .斜体:address （联系信息）em （强调）i （突出不同）cite （引 用）dfn （首次定义术语）3 .粗体：strong （重要）b （提示）4 .图片块:figure5 .引述文段，段落缩进：blockquote6 .背景颜色：mark7 .虚线下划线：abbr8 .上标下标：sub/sup9 .下划线：ins10 .删除线：del （标记已删除内容）s （标记不精确 内容）11 .等宽字体：code12 .预格式化:pre13 .字号减小，表解释:small14 .时间：time15 .换行：br16 . html5 定义区块：header nav article section aside footer div span三.表单表格1.1.formmethod=postaction=show.phpenctype=multipart/form-data./form2 .表单元素的组织:fieldset./fieldsetfieldset./fieldset3 .仓ll建各种框:input type=text id=name name=name class=zky required=required placeholder= 请 输 入 value=http:/ autofocus=autofocus size=12 maxlength=20 pattern二 /注：textpassword/url/tel/emailId:为了让对应的标签识别，添加CSSName：为了让服务器和脚本识别，通常与id设为一样Size：文本框大小Maxlength：能输入的最大字符数Pattern：正则表达式4 .添加标签：label for=idname?/label5 .单侈）选按钮：input tupe=radio/checkbox id=aaa name=zky value=beijing /label for=aaa 北京/labelinput tupe=radio/checkbox id=bbb name=zky value=shanghai /label for=bbb 上海/label注：id各自唯一，name必需相同。checked：默认选择6 .下拉框：select id=zky name=zky size=12 multiple=multipleoption value=beijing 1 匕京/optionoption value=shanghai 上海/optionoption value=chengdu 成都/option/select注：size:选择框的高度multiple：允很多选selected：默认选择用 optgroup label;东北?/label对选择框进行分组7 . 上传文件：input type=file id=zky name=zky size=5 /注：size：输入路径和文件名的字段的宽度8 .禁用表单元素：input ? disabled9 .创建提交按钮：input type二submit value二点此提交/创建带图像的提交按钮：button type=imageimg src=l.jpg点击这里/button 创建图像按钮：input type=image alt=提交 src=l.jpg/Submitreset 重置10 . 文本区域：textarea name=zky maxlength=30 rows=5 cols=5 请 在此输入字符/textarea11 .表格：tablecaption/captiontheadtrth scope=rowgroup./thth scope=col./th/tr/theadtbodytrth scope=row./thtd rowspan=3./tdtd./td/tr/tbody/table四.文本格式化1 . font：（斜体粗体小型大写字母）字体大小（必有）行距字体 集（必有）；2 .文本背景： background： #foc url （l.jpg） repeat-x scroll 0 0； 3 .字间距：word-spacing:12px;4 .字偶距：letter-spacing:12px;5 .缩进增加：text-indent:12px;6 .小型大写字母：font-variant:small-caps;7 .文本对齐：text-align:left；适用于 block, inline-block8 .单词大小写:text-transform:capitalize（单词首字母大 写"uppercase（大写"lowercase（小写）9 .文本上的线：text-decoraion:underline/overline/line-through;11 .空格：white-space:pre（显示全部空格回车）/nowrap （非断行空 格）;12 . h316px; h512px; verdana,Geneva,sans-serif;13 .列表属性：lilist-style:url(l.jpg) inside square;五.CSS布局1 . width： 不包括 padding, border, margin； max-width 设置夕卜围 限制；2 .浮动：float:left;清除浮动:clear:both;3 .设置边框：border:dotted 4px red;(dotted 点状、dashed 虚线、 solid实线)4 .使元素对齐：vertical-align:baseline/middle/text-bottom.5 .显示：display:black/inline/inline-block;6 .显示：visibility:visible/hiddle;7 .相对定位：position:relative; top:5px;相对于该元素的原始位 置8 .肯定定位：position:absolute; top:5px;相对于 body 或离他最 近定位的祖先元素9 .三维位置：z-index:50;越大的在最上面10 .厂商前缀：-webkit-(safari) -moz-(firefox) -ms-(IE) -o-(opera)11 .创建圆角：-moz-border-radius-topleft:50px;-webkit-border-top-left-radius:50px;border-top-left-radius:50px;(左上角,角的半径是 50px)border-radius:50px;(全部角简写)12 .创建椭圆角：? ? border-radius:40px/20px; （x 半径/y 半径）13 .创建圆形：? ? border-radius:50px; 50px为元素半径大小14 .文本加阴影：text-shadow: 2px 5Px 5px #999; x/y/模糊半径15 .元素加 阴影：1moz-/-webkit-）box-shadow:（inset 内阴影）2px 5px 5px #999; 5px lOpx 2px #555（多重阴影）;16 .多重背景：background:#000 url（l.png） 50% 102% no-repeat,#222 url（2.png） 12px -150px repeat-x;17 .透亮 度：opacity:.5; 01透亮好不透亮18 .渐变背景：background:linear-gradient（left,#000,#999）; （left ： 渐变线沿逆时针方向转至水平线的角度）六.html5视频音频1 . html5 支持 3 种视频：.ogg/.ogv .mp4/.m4V .webm2 .添力口视频：video src=l.webm/video视频属性：src autoplay controls muted loop poster width height preload3 .为视频添加多个来源：video controls=controlssource src=l.mp4 type=video/mp4source src=l.webm type=video/webmobjecttype=application/x-shockwave-flashdata=l.swf?videourl=l.mp4control=trueparam name=movie value=l.swf?videourl=l.mp