Question

我有一些文字流经我制作的框线边框。我尝试使用display将其分为两行，但是还有其他使用CSS或html对其进行划分的方法吗？

Css

.awpcp-listing-title {display: table-column;}

不起作用

<div class="awpcp-listing-excerpt $awpcpdisplayaditems 
$isfeaturedclass" data-breakpoints-class-prefix="awpcp- 
listing-excerpt" data-breakpoints='{"tiny": [0,328], 
"small": [328,600], "medium": [600,999999]}'>
<div class="awpcp-listing-excerpt-thumbnail">
$awpcp_image_name_srccode
</div>
<div class="awpcp-listing-excerpt-inner" style="w">
<h4 class="awpcp-listing-title">$title_link</h4>
<div class="awpcp-listing-excerpt-content">$excerpt</div>
</div>
<div class="awpcp-listing-excerpt-extra">

$awpcp_city_display
$awpcp_state_display
$awpcp_display_adviews
$awpcp_display_price
$awpcpextrafields

Answer 1

对于溢出的文本，您可以使用空格和断行属性来控制如何包装文本并分成第二行。

例如：

.break-words{
    white-space: pre-wrap;
    word-break: break-word;
}

Answer 2

您是在谈论四舍五入卡片上绿色突出显示的文字吗？如果是这样，则将line-height属性设置为80px，这将导致文本被推到框外。假设您正在谈论的是，这应该可以解决此问题：

.awpcp-listing-excerpt-extra {
    line-height: normal;
}

如何在div中创建文本换行符？

2 个答案: