css----零散知识点
2015-10-21 01:41
519 查看
1.图片垂直居中
非Ie: dispaly:table-ceil; vertial-align:middle
ie:在不支持display:table-cell的浏览器(IE)中利用文字结合行高的方法来实现垂直居中;display:table-cell这个属性会导致一些属性失效,比如margin :所以使用这种方式让图片垂直居中时,涉及到多图片并排时有可能需要将下面的XHTML结构复制到li结构中;
非Ie: dispaly:table-ceil; vertial-align:middle
ie:在不支持display:table-cell的浏览器(IE)中利用文字结合行高的方法来实现垂直居中;display:table-cell这个属性会导致一些属性失效,比如margin :所以使用这种方式让图片垂直居中时,涉及到多图片并排时有可能需要将下面的XHTML结构复制到li结构中;
XHTML代码结构:
<div class="test_box"> <img src="book.jpg" alt="" /> </div>
CSS代码样式:
.test_box {display:table-cell;width:200px;height:200px;vertical-align:middle;text-align:center; *float:left;*font-family:simsun;*font-size:200px;*line-height:1; border:1px solid #000000; } .test_box img {vertical-align:middle;}
相关文章推荐
- css hack大全
- CSS3 基本语法
- css杂类收集
- listview中如何将某一个item显示成其它的样式
- css中将鼠标放到一个div上显示出另一个隐藏的div
- How Do I Target IE7 or IE8 Using CSS Hacks?
- css中padding 和 margin的格式
- CSS z-index 属性的使用方法和层级树的概念
- CSS实现不定高度垂直居中 兼容IE7
- IE6 IE7 IE8 IE9 IE10 Css hack及IE条件注释法
- Atom编辑器折腾记_(17)atom-minify[CSS/JS压缩神器]
- Atom编辑器折腾记_(17)atom-minify[CSS/JS压缩神器]
- css3 tranform transition animation
- CSS 的overflow:hidden 属性详细解释
- 如何访问到静态的文件,如jpg,js,css?
- css 图片/元素旋转代码
- iOS 改变状态栏的颜色(样式)
- java web下WebContent下的js.css无法访问
- css 元素跳动代码
- CSS 框模型Margin ,Border ,Padding ,Content