CSS:如何围绕左右图像流动文本

时间:2015-06-22 21:46:49

标签: css css3

我知道float:left将允许文本围绕浮动在左侧的图像流动。

float:right将允许文本围绕浮动在右侧的图像流动。

有没有办法围绕左右图像传输文字?

enter image description here

1 个答案:

答案 0 :(得分:1)

就像你说的那样。您需要拥有float:left的一张图片和float:right的另一张图片。如果两者都放在文本之前,它们将各自位于各自的顶角,水平对齐。

<img src="http://placehold.it/100x200" style="float:left;">

<img src="http://placehold.it/100x200" style="float:right;">

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur viverra diam finibus arcu dictum, sed condimentum neque eleifend. Nullam non lobortis leo, a sollicitudin ipsum. Pellentesque gravida aliquet eros, in imperdiet eros dictum eu. Aenean vel pharetra libero. Nam vel risus sit amet tortor fermentum venenatis. Aenean efficitur, ante ac semper porta, turpis nunc dignissim risus, sed ullamcorper dolor lacus a felis. Sed vel nulla imperdiet, luctus tellus sed, pharetra sem. Nullam vehicula elit eget urna lobortis, at porta nunc tempor. In gravida aliquet rutrum. Cras at lacus ac felis egestas aliquet. Aenean viverra eu mauris a fermentum. Donec pharetra nisl ex, sit amet sodales orci lobortis id. Nullam lobortis dictum pharetra. Cras pellentesque rhoncus magna a ultricies. Quisque et vehicula risus, in porttitor ex. Quisque aliquet blandit velit ut gravida.