我有一个左侧浮动的图像,其右侧有文本(在元素中),通过在段落元素上使用
display:flow-root
,图像周围没有文本环绕。 我想要的是,当图像下面溢出了一定数量的行(比如三行)时,可以开始将文本环绕在图像周围。 有什么办法可以做到这一点吗? 谢了。 我现有的代码(用于容器中的图像和文本):
null
.listing-img {
float: left;
margin-right: 20px;
display: flow-root;
}
.listing-content {
display: flow-root;
}
<section class="listing">
<img src="https://via.placeholder.com/500x300?text=About+the+Farr+Homestead" class="listing-img" />
<p class="listing-content">
A key feature of the apple orchard management structure in the Farr Orchard will be maintaining a healthy orchard understory. Apple trees grow naturally in hedgerows along the edge of forests, where the ground is usually covered with wildflowers and tall
grass. This benefits beneficial insects and pollinators by providing habitat and keeps the soil fertile for the tree, which in turn supports better fruit size and cropping when applied to an orchard. Tree rows will usually be mowed about twice a year
to maintain the same perennial wildflower domination - once shortly after blossom, around July; and again before harvest begins, in mid to late September. In addition to the mulching effect caused be cutting the grass at these key points, wood chip
mulch and gravel will keep the root system of the trees healthy and free from excessive weed pressure, while not harming surrounding plants. This will promote genetic diversity in the orchard.
</p>
</section>
null
这张图片显示了结果。
为什么不在段落内移动图像,并通过边距控制图像与段落之间的距离呢?
null
.listing-img {
float: left;
margin-right: 20px;
margin-bottom: 4rem;
}
<section class="listing">
<p class="listing-content">
<img src="https://via.placeholder.com/500x300?text=About+the+Farr+Homestead" class="listing-img" />
A key feature of the apple orchard management structure in the Farr Orchard will be maintaining a healthy orchard understory. Apple trees grow naturally in hedgerows along the edge of forests, where the ground is usually covered with wildflowers and tall
grass. This benefits beneficial insects and pollinators by providing habitat and keeps the soil fertile for the tree, which in turn supports better fruit size and cropping when applied to an orchard. Tree rows will usually be mowed about twice a year
to maintain the same perennial wildflower domination - once shortly after blossom, around July; and again before harvest begins, in mid to late September. In addition to the mulching effect caused be cutting the grass at these key points, wood chip
mulch and gravel will keep the root system of the trees healthy and free from excessive weed pressure, while not harming surrounding plants. This will promote genetic diversity in the orchard.
A key feature of the apple orchard management structure in the Farr Orchard will be maintaining a healthy orchard understory. Apple trees grow naturally in hedgerows along the edge of forests, where the ground is usually covered with wildflowers and tall
grass. This benefits beneficial insects and pollinators by providing habitat and keeps the soil fertile for the tree, which in turn supports better fruit size and cropping when applied to an orchard. Tree rows will usually be mowed about twice a year
to maintain the same perennial wildflower domination - once shortly after blossom, around July; and again before harvest begins, in mid to late September. In addition to the mulching effect caused be cutting the grass at these key points, wood chip
mulch and gravel will keep the root system of the trees healthy and free from excessive weed pressure, while not harming surrounding plants. This will promote genetic diversity in the orchard.
A key feature of the apple orchard management structure in the Farr Orchard will be maintaining a healthy orchard understory. Apple trees grow naturally in hedgerows along the edge of forests, where the ground is usually covered with wildflowers and tall
grass. This benefits beneficial insects and pollinators by providing habitat and keeps the soil fertile for the tree, which in turn supports better fruit size and cropping when applied to an orchard. Tree rows will usually be mowed about twice a year
to maintain the same perennial wildflower domination - once shortly after blossom, around July; and again before harvest begins, in mid to late September. In addition to the mulching effect caused be cutting the grass at these key points, wood chip
mulch and gravel will keep the root system of the trees healthy and free from excessive weed pressure, while not harming surrounding plants. This will promote genetic diversity in the orchard.
A key feature of the apple orchard management structure in the Farr Orchard will be maintaining a healthy orchard understory. Apple trees grow naturally in hedgerows along the edge of forests, where the ground is usually covered with wildflowers and tall
grass. This benefits beneficial insects and pollinators by providing habitat and keeps the soil fertile for the tree, which in turn supports better fruit size and cropping when applied to an orchard. Tree rows will usually be mowed about twice a year
to maintain the same perennial wildflower domination - once shortly after blossom, around July; and again before harvest begins, in mid to late September. In addition to the mulching effect caused be cutting the grass at these key points, wood chip
mulch and gravel will keep the root system of the trees healthy and free from excessive weed pressure, while not harming surrounding plants. This will promote genetic diversity in the orchard.
</p>
</section>