如何设置文字上下移动html,HTML CSS在换行时向上移动文本

使用内联块

你可以试试这个:

.produto-ind {

xxposition: relative;

width:300px;

height:400px;

xxfloat: left;

margin:50px 30px 0px 0px;

border: 1px dotted blue;

display: inline-block;

}

而不是使用浮点数,使用display:inline-block.文本块将与其底部基线对齐.

还有其他与div的高度有关的小问题,但这些可以修复,特别是如果你知道.fk-img的高度.

使用花车

如果您知道图像容器的高度,也可以使用浮点数:

.produto-ind .img-produto-ind {

height:290px;

width:100%;

position: absolute;

left: 0;

bottom: 0;

}

.produto-ind h2 {

background-color: yellow;

position: absolute;

bottom: 290px;

}

.produto-ind .fk-img {

height:100%;

width:auto;

background-color:gray;

}

在这种情况下,如果你知道.fk-img将是290px高度,你可以使用绝对定位将图像容器放在父.produto-img块的底部

然后将h2元素290px从底部定位.

内联块和浮动之间的选择很大程度上取决于你希望li块如何排列,顶部的参差不齐的空间或底部的参差不齐的空间,这是你的一个设计决定.

如果您将内容包装在块级元素宽度显示周围,则可以使用display:table-cell的解决方案:table-cell; vertical-align:bottom;但这也将假设所有图像块具有相同的高度.

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值