文章关键字 ‘垂直居中’
2015年02月15日,星期日
IE的Matrix矩阵变换,或者zoom缩放会改变元素原本占据的展示尺寸,位置等,与CSS3优雅的transform完全不一样,导致,我们需要对IE做额外的偏移。
但是,我们大多数人的数学都是体育老师交的,计算偏移值什么的,想想就大头娘娘了,难道,就不能跟CSS3 transform一样,就规规矩矩居中放大吗?
童鞋,略施小计,还是有办法滴……
阅读全文…
标签:Matrix, transform, zoom, 垂直居中, 水平居中, 矩阵, 缩放
发布在 CSS相关 | 4 条评论 »
2012年09月24日,星期一
CSS3中一些新的单位早在去年春暖花开的时候就介绍了,参见:CSS长度值及时间、频率、角度单位。显然,其中就提到了本文要感叹的单位vw, vh.
不过“我看见你”和“我触碰你”是不一样的。正好,机缘巧合,最近又与这两个单位想见。大致琢磨了下,貌似vh这个单位可以实现我以前曾希望实现的的整体高度自适应布局。想到这里,自己不由得小兴奋了下,于是决定抽时间研究研究(虽然最近整iPad忙得屁股尿流~~)
阅读全文…
标签:css3, vh, vw, 单位, 垂直居中, 弹出框, 高度自适应
发布在 CSS相关 | 39 条评论 »
2009年11月28日,星期六
前两天在腾讯ISD团队博客上看到一篇翻译的文章“深入理解css 行高”,是个不错的文章,学到了不少东西,颇有感觉,于是决定结合自己的一些经验与理解写篇内容互补或者说是角度不同的文章吧。
本文核心重点在于inline box模型下的line-height高度问题,希望可以纠正css中对高度的正确认识,并依次展开列举了一些常见的有关line-height的应用,提供demo页面,希望对您的学习有所帮助。
阅读全文…
标签:css相关, height, inline, inline box模型, inline-block, line-height, 兼容性, 垂直居中, 布局, 文字, 显示, 行高, 高度
发布在 CSS相关 | 127 条评论 »
2009年08月28日,星期五
想必写css的都知道如何让单行文字在高度固定的容器内垂直居中,但是您知道或者想过让行数不固定的文字在高度固定的容器内垂直居中呢?本文将会告诉你如何实现多行文字的垂直居中显示。
关于图片垂直居中显示,想必很多写css的人都研究过,或者说是搜寻过方法。淘宝团队似乎提供了一种不错的方法,用font-size解决IE下垂直居中的问题,是个好方法吗?是的,方法是不错,可是问题也很多:不支持img外标签的浮动,致使多图片排列时需添加额外标签;需要记住一些比例参数,上手较难;原理艰深,兼容性不稳定等。但是在我看来,这个方法不足够好!本文将提供两种更为新颖的方法,代码简洁,原理简单,上手容易,兼容性强,出错率低的方法。
css是如此的精深,我相信后来人会有更加绝妙的方法。但是,本文提供的几种实现图片垂直居中方法,一定是目前最实用的几种方法。一起来一睹为快吧!
阅读全文…
标签:Firefox, hack, IE, inline-block, table-cell, vertical-align, 兼容性, 垂直居中, 浏览器
发布在 CSS相关 | 98 条评论 »