图片在CSS中垂直向上500怎么做

html-css017

图片在CSS中垂直向上500怎么做,第1张

最好把你要向上500的元素改为绝对定位:

写一个Css样式

.top{

position:absolute

margin-top:-500px//一定要是负数哟!!!

}

方法一:

.a, .b {

   display: inline-block

   width: 50%

   border: 0

   vertical-align:top  /*靠上对齐*/

}

方法二:

.a, .b {

   float: left

   width: 50%

   border: 0

}

.parent:after {   /*清除浮动*/

   content: ''

   display: block

   clear: both

}

方法一看起来简单,但一般不建议使用行内块级元素(inline-block),容易出现一些让人摸不着头脑的错位问题。个人建议使用方法二。

在CSS中的vertical-align 属性是设置元素垂直对齐的方式

需要注意的是:

vertical-align属性定义行内元素的基线是相对vertical-align这个元素所在行的基线的垂直对齐。

是会允许指定负长度值和百分比值的。

这样是会导致vertical-align元素降低,并非是升高的。

在单元表格中,vertical-align属性是能设置单元格框中的 单元格内容的对齐方式的

vertical-align属性的浏览器支持情况如下:

目前所有的浏览器都是支持vertical-align的属性的

但是需要注意的是:无论是任何的版本的 Internet Explorer,包括 IE8在内,都是不支持 "inherit"这个属性值的。

vertical-align属性的实例介绍如下:

垂直对齐一幅图像的实力介绍:

img { vertical-align:text-top }