题主目前在工作中经常遇到这种问题。
例如:在高度固定的时候如果文本是一行的话,垂直居中,如果两行的话也是垂直居中,当第三行的时候就隐藏(如果有‘...’的话当然最好)。有没有简单而有效的方法?
谢谢,么么哒。
题主目前在工作中经常遇到这种问题。
例如:在高度固定的时候如果文本是一行的话,垂直居中,如果两行的话也是垂直居中,当第三行的时候就隐藏(如果有‘...’的话当然最好)。有没有简单而有效的方法?
谢谢,么么哒。
这个使用flex布局来解决比较容易,推荐看下阮一峰老师的博客,讲的很细致http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html
推荐使用flex,新的布局趋势
建议阅读阮一峰老师的Blog
贴上地址,图文并茂,适合刚接触flex的同学阅读
http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html
http://www.ruanyifeng.com/blog/2015/07/flex-examples.html
flex 固然好,但是说起 IE 满脸泪
说一个我一直在用的 inline-block 方法
<div class="vMiddle"><i></i><span>一行两行三行四行高度不确定</span></div>
.vMiddle {
&, i { height: 150px;} // i 和父层高度一样
i, span { display: inline-block; vertical-align: middle;}
i { width: 0;}
}
我建议看看这个css-tricks的这个post
https://css-tricks.com/centering-css-complete-guide/#center-vertically
2 回答2.3k 阅读✓ 已解决
3 回答976 阅读✓ 已解决
2 回答1.5k 阅读✓ 已解决
3 回答1.1k 阅读✓ 已解决
3 回答1.5k 阅读✓ 已解决
2 回答864 阅读✓ 已解决
1 回答935 阅读✓ 已解决
自行百度了许久,找了很多资料
这一篇博客讲的挺详细的
http://www.cnblogs.com/dojo-lzz/p/4419596.html
其中讲了7种方法,flex讲的略简单,flex可以参考可以参考阮一峰的博客
一、语法篇:http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html;
二、实例篇:http://www.ruanyifeng.com/blog/2015/07/flex-examples.html;
2016.01.31
看到好多小伙伴关注了这个问题,我就写了一篇总结:
sf专栏文章:http://segmentfault.com/a/1190000004394432?_ea=593187;