CSS 实现div宽度根据内容自适应

在网页设计中，我们经常需要让div元素根据内容自适应宽度，以实现更为灵活的布局。许多开发者存在一个误区，认为不设定div的宽度就可以实现宽度随内容自适应。实际上，在默认状态下，div的宽度会占满整个父元素宽度，因此我们需要通过一些特定的CSS设置来实现div的宽度自适应。

让我们通过一个简单的例子来说明这个问题。假设我们有一个父div元素，内部包含了一个子div元素。在默认状态下，即使子div中的内容较少，它也会占满整个父div的宽度。如果我们希望子div的宽度能够根据内容自动调整，就需要进行一些CSS设置。

以下是HTML代码示例：

```html

```

为了实现子div的宽度自适应，我们需要对其进行一些CSS修改。具体来说，我们需要将display属性设置为inline-block。这样做可以让子div像内联元素一样根据内容自适应宽度，同时又保留了块级元素的特性。为了增强兼容性，我们还需要加入一些特定的CSS代码。以下是修改后的代码示例：

```html