您可以尝试此代码。按照CSS部分中的代码操作。

第二部分{显示：内联块；填充：2vw；背景色：绿色；}表{宽度：70vw；背景色：白色；}＜div＞<table border=“colapsed”><tr><td>苹果</td><td>香蕉</td><td>草莓</td></tr><tr><td>苹果</td><td>香蕉</td><td>草莓</td></tr><tr><td>苹果</td><td>香蕉</td><td>草莓</td></tr></table></div>

修订版（如果您有多个孩子，则适用）：您可以使用jQuery（查看JSFiddle链接）

var d= $('div');
var w;


d.children().each(function(){
 w = w + $(this).outerWidth();
 d.css('width', w + 'px')
});

不要忘记包含jQuery。。。

在此处查看JSfiddle

您可以尝试此代码。按照CSS部分中的代码操作。

第二部分{显示：内联块；填充：2vw；背景色：绿色；}表{宽度：70vw；背景色：白色；}＜div＞<table border=“colapsed”><tr><td>苹果</td><td>香蕉</td><td>草莓</td></tr><tr><td>苹果</td><td>香蕉</td><td>草莓</td></tr><tr><td>苹果</td><td>香蕉</td><td>草莓</td></tr></table></div>

您可以选择高度：100%和宽度。这使得div不大于其内容。

我通过在div标记中添加span标记，并将CSS格式从外部div标记移动到新的内部span标记，解决了一个类似的问题（我不想使用display:inline块，因为项目居中）。如果display:inline块不是适合您的答案，那么就把它作为另一个备选方案。

width:1px;
white-space: nowrap;

对我来说很好：）