《前端开发经典问题总结》由会员分享，可在线阅读，更多相关《前端开发经典问题总结（10页珍藏版）》请在金锄头文库上搜索。
1、1、text-shadow:2px 2px 2px #f00;text-shadow（文字的影子）x轴（向右为正） y轴（向下为正 晕（模糊宽度没有负值） #ff00（影子颜色）浏览器兼容：Firefox，Opera，Chrome，Safaribox-shadow:（盒子的影子）x轴（向右为正） y轴（向下为正 晕（模糊宽度没有负值） #ff00（影子颜色） inset（内部的效果）可以只写x,y,color inset;另一种x,y ,blur,spread,color,inset；不可以x,y,blur/spread,color,inset2、border-radius（圆角）:50px;
2、=border-top-left-radius:50px;border-top-right-radius:50px;border-bottom-left-radius:50px;border-bottom-right-radius:50px;浏览器兼容：IE9，Firefox 4+，Chrome，Safari 5+，Operabody设置宽度对背景图片没影响bodymargin:0 auto;width:960px;color:#352;font:14px/20px 微软雅黑;background:#352 url(./images/bg.jpg) fixed center no-repeat
3、;bodyheaderfont-size:18px; body下的子header not孙子例子这其中第二个header不受控制可编辑列表onetwothree对于未定义长宽的块级元素，内含浮动的块级元素，若要使其有独占一行的效果可添加display:inline-block属性Placeholder input中的占位符（仅在支持html5的浏览器下有效）用法：,作用：类似于提示语在输入框中。Animation动画Appearance改变（比如div）为其他样式支持火狐/谷歌/苹果Appearance:normal/icon/window/button/menu/field针对CSS3渐变的
4、记录针对手机webkit内核的浏览器不识别此写法：background-image: -webkit-linear-gradient(top, #759AE9 0%, #376FE0 50%, #1A5AD9 50%, #2463DE 100%);识别写法如下：background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #759AE9), color-stop(50%, #376FE0), color-stop(50%, #1A5AD9), color-stop(100%, #2463DE);
5、针对CSS3 box-shadow属性不仅支持单定义的属性控制如box-shadow:x y spread blur color inset还支持box-shadow:inset x y spread blur color,x y spread blur color,等清除浮动第一种； ：overflow: hidden; _zoom: 1;合起来可以清除浮动第二种；.clearzoom:1;.clear:aftercontent:20;display:block;clear:both;（主要为了兼容此div的背景、margin、padding值在各个浏览器下一致；此div没有背景、margi
6、n、padding值，只用clear：both就行了 ）解读浮动闭合最佳方案：clearfix分享到：更多62011-05-16 分类：HTML/CSS37人评论13,640次浏览之前给大家介绍两种浮动闭合的办法CSS清除浮动 万能float闭合，得知很多同学都在使用下面的骨灰级解决办法：.clearclear:both;height:0;overflow:hidden;上诉办法是在需要清除浮动的地方加个div.clear或者br.clear，我们知道这样能解决基本清浮动问题。但是这种方法的最大缺陷就是改变了html结构，虽然只是加个div。最优浮动闭合方案（这是我们推荐的）：.clearfi
7、x:aftercontent:.;display:block;height:0;clear:both;visibility:hidden.clearfix*+height:1%;用法很简单，在浮动元素的父云素上添加class=”democlearfix”。你会发现这个办法也有个弊端，但的确是小问题。改变css写法就ok了：.demo:after,.demo2:aftercontent:.;display:block;height:0;clear:both;visibility:hidden.demo,.demo2*+height:1%;以上写法就避免了改变html结构，直接用css解决了。很拉
8、轰的浮动闭合办法：.clearfixoverflow:auto;_height:1%这种办法是我看国外的一篇文章得到的方案，测试了，百试不爽，真的很简单，很给力。喜欢的同学也可以试试这个办法。这种方法是端友radom提供的，测试通过：.clearfixoverflow:hidden;_zoom:1;感谢radom提供的这种方法！js笔记：1、js优化减少请求数量（合并文件，当然也得考虑文件的大小，）2、js代码性能，尽量使用变量来保存dom的遍历值3、HTTP规范，浏览器每次从同一个域名中最多只能同时下载两个文件。下载脚本期间，浏览器不会下载其他任何文件，即使是来自不同域名的文件也不会下载，所
9、有其他资源都要等脚本加载完毕后才能下载。4、与DOM脚本编程工作有关的问题不外乎平稳退化、向后兼容、分离Javascript这。这些问题的解决方式和解决程度影响着网页的可用性和可访问性。5、语义化-易于阅读、有利于SEO解决IE6不支持最小高度height:auto !important;height:200px; /*假定最低高度是200px*/min-height:200px;内部div自动撑开外部div 的问题若内部div有浮动你是无法自动撑开外部的div滴，解决办法清除浮动了此上传按钮各个浏览器厂家兼容性完全不同，谷歌，苹果一类，最好控制，IE，火狐完全扯淡不支持对样式进行控制扯淡的兼
10、容性哇.classposition:relative; top:-39px;right:-200px;通用*right:20px;IE7right:20px9;IE8_right:0px; IE6height:39px; width:440px;filter:alpha(opacity:0);opacity:0;断行变形的问题每天星期一星期二星期三星期四星期五星期六星期日如果此行中有人为换行，这会引起样式变形，浏览器解读为空格Css优先级问题针对样式优先级情况，内部样式大于继承，继承大于id，id大于class如 P spancolor:#ff0000;#color#000;.color#ff
11、f;如上，优先级逐级下降jQuery的空格问题var $demo=$(.test :hidden);有空格的含义：选中类test下隐藏的元素var $demo=$(.test:hidden);无空格的含义：选中类名为test的隐藏的元素绝对定位，相对定位Position：absolute绝对定位，默认情况下其父元素对象是浏览器的左上角，若父元素也是绝对定位，则对象是父元素Position：relative相对定位，针对父元素定位插入节点方法First-append()$(“p”).append(“hello”);example:I say :helloappendTo()$(“hello”).
12、appendTo(“p”);I want say hello针对li:first-child li:last-child这种伪类，ie他nia的不支持Focus，点击input输入框，这种特效，input:focusoutline:1px solid #ff0000;可以设置；$(“element”).css“height”获取对象所设置的高度$(“element”).height();获取对象的实际高度$(“element”).width(“100px”)设置宽度text-indent:-999px;作用：显示图片效果，内含文字，为了便于SEO的抓取，隐藏掉文字JS变量定义Js变量定义不可使用”-“这个符号例如：var page-count=1;这样是失效的，在css里可以.page-count定义Js反义字符r回车n换行，一般同时在一起使用”rn”Select 属性multiple=”multiple”，如果不加这个属性，默认只可以选一个jQuery中对象操作“this”的对象转换问题$(tbodytr).click(function()
