![](https://img-blog.csdnimg.cn/20201014180756930.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
CSS
kingwell2010
这个作者很懒,什么都没留下…
展开
-
chrome safari 中input垂直居中对齐 行高问题line-height
现在CSS Reset的时候,都流行使用line-height:1;了,这个明显的好处就是解决了在input Chrome与Safari里Input框里垂直居中的问题,有兴趣人鞋童可以试一下。2012-06-25 23:21:02 · 233 阅读 · 0 评论 -
IE6透明PNG解决方案
IE6不支持PNG-24图片一直困扰很多人,但是可以通过IE的独有的滤镜来解决,解决的方案很多,比如:将滤镜写在CSS里,还可以写成单独的Javascript文件,本来认为推荐两种做法:第一种,将所有PNG图片添加滤镜(此方法有副作用);第二种:有选择性的添加滤镜(推荐);两者都可以将代码放在单独的JS文件里,然后引用。 第一种:直接添加如下代码: function ...2013-09-17 19:31:10 · 82 阅读 · 0 评论 -
使用Sass预定义一些常用的样式,非常方便
各种新技术的出现,推动着Web前端技术飞速发展,在提升用户体验的同时也方便开发者;在前端优化时,我们使用CSSSprite技术,把多个图片合在一张图片上,然后通过background-image,background-position来定位现实不同效果,这样来达到减少HTTP请求,毕竟HTTP请求是相当昂贵的,但是HTTP请求是少了,开发人员工作量就大了,要定位图片不是一件很方便的事情,非常...2014-06-04 11:04:31 · 396 阅读 · 0 评论 -
使用Sass预定义一些常用的样式,非常方便
CSS预处理技术现在已经非常成熟,比较流行的有Less,Sass,Stylus,在开发过程中提升我们的工作效率,缩短开发时间,方便管理和维护代码,可以根据自己的喜好选择一款自己喜欢的工具开发,使用很接近,差别很小,语法类似。再选择一款编译工具koala,国产工具,koala是一个前端预处理器语言图形编译工具,支持Less、Sass、Compass、CoffeeScript,帮助web开发者更高效...2014-06-04 11:03:44 · 180 阅读 · 0 评论 -
kingwell Calendar V1.0 日历时间组件
项目中经常要使用日历时间插件,网上也有很多很优秀的插件,但是我还是喜欢使用自己写的东西,第一比较符合自己项目需要,第二,维护,修改比较内容,第 三,代码也比较少,第四,兼容各主流浏览器(IE6,7,8,9,10,FF,Chrome,Opera等)。最近写了个日历与时间选择插件,支持中英文 查看效果...2013-08-07 09:10:06 · 97 阅读 · 0 评论 -
去掉IE10+input 文本后面“删除图标”与密码文本框后面“查看密码图标”
在最新的IE浏览器(IE10+)上使用表单时,文本框内后面会出现很丑的删除图标以及显示密码图标,如果你讨厌这个可以把它去掉,这两个是由IE私有属性控制: input::-ms-clear,input::-ms-reveal { display: none; /* For ie10+ */} ...2014-05-04 15:38:13 · 256 阅读 · 0 评论 -
前端开发工程师如何在2013年里提升自己【转】
大部分人非常在意个人在技术上的提升。但是保持对新技术的了解是一项不小的挑战, 毕竟我们需要的信息在数量上过于庞大。2012年里,伴随着前端发展的是大量的革命性突破和对前端的重新定义。我们在实践的路上飞速前进,具体的进步体现在使用抽象化,优秀的代码质量,维护性上的提升以及更好的性能。如果你实在忙到没有时间来跟上最新的技术,不用担心。随着假日的来临,我们就有了一些空闲的时间可以自己支配,我想...原创 2013-07-10 10:33:34 · 104 阅读 · 0 评论 -
CSS内联还是外联?
现在是一个推崇结构,表现,行为想分离的时代,最大的好处就是维护起来比较简单,方便,代码重用。把CSS,JS写在HTML里,就像一个大杂烩,很难理解,可读性差,文件大,维护起来非常麻烦。 但是CSS到底是内联还是外联呢?我们只要分析它的特点就不难得出答案。CSS内联:就是把CSS放在HTML Head里使用Style包围。<style type="text/css"><...2012-09-24 16:33:14 · 432 阅读 · 0 评论 -
写了一个打印信息的函数比Alert强大,类似Firebug中的console.table
有时候,特别是在Ajax请求返回数据时我们需要知道返回数据的结构,如果是Object,使用Alert是打印不出来的,使用Firebug中的 console 可以查看,我自己写了一个函数,有点像这个,有时候觉得使用console还不够直观,所以自己想办法写一个,不过现在支持的层级就三层,多了就不行了,多了就出现object。 if(!window.debug){ window.debug...2012-09-21 17:37:29 · 67 阅读 · 0 评论 -
Web前端开发之——表格高级排序(字符串,日期,整型,浮点型,以及图片等)...
在项目中,经常会碰表格排序,最近整理了一个表格排序包括字符串,日期,整型,浮点型,以及图片等高级排序,将服务器功能转移到前端实现,减轻了服务器压力,功能比较强大。 (function () { /** @ Author: Kingwell leng @ Date : 2012-8-22 @ Blog : http://kingwell-leng.ite...2012-08-22 11:46:25 · 131 阅读 · 0 评论 -
关于CSS的优先级
彻底搞明白CSS优先级 CSS优先级原则一: 继承不如指定原则二: #id > .class > 标签选择符原则三:越具体越强大原则四:标签#id >#id ; 标签.class > .classCSS优先级权重计算法CSS优先级包含四个级别(标签内选择符,ID选择符,Class选择符,元素选择符)以及各级别出现的次数!根据这四个级别出现的次...2012-08-13 16:43:06 · 129 阅读 · 0 评论 -
给Jquery添加alert,prompt方法,类似系统的Alert,Prompt,可以响应键盘,支持拖动...
我们在调用系统的Alert,prompt的弹出提示时,不同的系统会有不同的提示框,视觉效果不统一,而且不好看,功能单一,现在我们通过Jquery模拟Alert,prompt,现实统一视觉效果,而且内容丰富的弹出提示。 Jquery可以扩展自己的功能,如果对Jquery开发插件不熟悉的人可以到官方网去看看文档,比较简单易懂。 /* * 本插件基于JQUERY...2012-07-14 11:25:34 · 209 阅读 · 0 评论 -
基于Jquery的模拟Select下拉菜单
我们都知道Select 通过CSS不好控制,大部分网站开发人员都使用Javascript+CSS来模拟: <div class="selectContainer"> <span class="selectOption gray">Please select aproduct</span> <ul ...2012-07-14 10:15:59 · 156 阅读 · 0 评论 -
模拟Window Alert弹出框 支持拖动以及ESC键盘退出
基本我自己封装的一些常用函数:KW.js /*Kingwell Javascript libraryAuthor:Jinhua.leng#gmail.comDate:2012-05-20*/(function () { if (!window.KW) { window.KW = {} } //命名空间 window.KW = { ...2012-06-28 11:16:34 · 142 阅读 · 0 评论 -
IE6下select标签覆盖div的完美解决办法
在上一家公司做网站的时候遇到一个问题,IE6下select标签覆盖div的问题。虽然很多人很讨厌IE6,但是IE6.0还是有很多用户,特别是前端设计人员,很多Bug让人很纠结,关于IE6下select标签覆盖div的问题,现在已经有完美解决办法 IE6下select标签覆盖div的解决办法 IE6下select标签覆盖d...2012-06-27 09:10:06 · 102 阅读 · 0 评论 -
关心IE6中!important的问题
关心IE6中!important的问题,我们知道!important是优先级是最高的,在IE6中使用!important,有时候有用,有时间没用,这是IE6的一个Bug,网上很多资料说IE6不支持important,其实是这一种误解,本人经过测试,IE的确支持!important,看看下面的代码: .box{width:100px; height:100px; background:red...原创 2012-06-27 09:06:28 · 61 阅读 · 0 评论 -
CSS实现箭头效果
有时候网页中使用箭头以增强效果,一般的做法是使用图片,今天我们使用CSSCSS来实现“箭头效果”,使用CSS我们必须兼容所有浏览器(IE6、7、8、9、10、+),Chrome,Firefox,Opear... <!doctype html><html lang="en"><head><meta charset="UTF-8">...2013-09-23 15:26:35 · 965 阅读 · 0 评论