Zhe Yang

CSS元素隐藏原理

在CSS中,让元素隐藏(指屏幕范围内肉眼不可见)的方法很多,有的占据空间,有的不占据空间;有的可以响应点击,有的不能响应点击。一个一个看。 { display: none; /* 不占据空间,无法点击 */ } /********************************************************************************/ { visibilit […]

不固定高宽div垂直居中的方法

用一个“ghost”伪元素(看不见的伪元素)和 inline-block / vertical-align 可以搞定居中,非常巧妙。但是这个方法要求待居中的元素是 inline-block,不是一个真正通用的方案。 html如下: 案例题目 案例内容 css如下: /* This parent can be any width and height */ .block { text-align: […]

js,ajax无刷更新图片

应用场景:用户报名上传图片,后台需要对位置不正确的图片进行旋转,使用$().html('<img src="xx" />');图片无变化 问题原因:图片有缓存,加随机数参数应该就可以了 解决方案:在图片路径后加个随机数 url?xxxxxxx

取消回车自动提交表单

如果form里面只有一个input type=text,那么无论有没有submit按钮,在input中回车都会提交表单。如果不想回车提交,需要再加一个input type=text,然后设置display:none.

jquery动态新增的元素节点无法触发点击事件

改进一电商系统的交互,增加新地址后,使用jq的append 动态增加元素节点,发现新增的元素中无法触发点击事件,以下为解决方案: 可以通过on方法绑定事件,可以绑定到它的父级或者body中,实现如下 $("body").on('click','.test',function(){  alert('OK') });

深度解析CSS的position/float/display的取值及特点

position position属性取值:static(默认)、relative、absolute、fixed、inherit。 postision:static;始终处于文档流给予的位置。看起来好像没有用,但它可以快速取消定位,让top,right,bottom,left的值失效。在切换的时候可以尝试这个方法。 除了static值,在其他三个值的设置下,z-index才会起作用。(确切地说z- […]

position:absolute探究

position:absolute是基于body元素,而当给上层div一个position:relative时,它就成了width:100%的基准点了。 小结论: 对于使用position:relative的子类元素而言,width:100%也始终是基于基父级元素而并不会基于其上层元素中的relative。 对于绝对定位的子无素,要是其外层的所有元素中都没有用position:relative,则 […]

ul高度为0解决方案

添加一个空的div 添加一个空的div,这个div和浮动元素同一级别,且位于浮动元素的最后。这个方法必须要为这个div添加一个clear:both属性,代码如下: <ul> <li>标签1</li> <li>标签2</li> <li>标签3</li> <div style="clear:both;">& […]

友情链接:张小丽的博客