cssword-wrap

word-wrap属性是CSS中用来控制文本在容器中换行规则的属性。它的主要作用是确定当文本长度超过容器宽度时是否进行换行，以及换行方式的选择。

word-wrap属性有两个可选值，分别是：

1. `normal`: 默认值，表示当文本长度超过容器宽度时，不换行，而是让文本溢出容器显示。

2. `break-word`: 表示当文本长度超过容器宽度时，自动进行换行。这种方式会在单词内进行换行，即使单词会被截断也会换行。这个值可以用来解决容器宽度不够显示长单词或URL的问题。

在实际应用中，我们可以根据具体需求来选择合适的word-wrap属性值。一般来说，当容器宽度有限而且需要保证文本内容完整显示时，可以使用`break-word`来自动换行；当容器宽度足够宽，并且不希望文本内容自动换行时，可以使用`normal`。

下面是一个例子，演示了word-wrap属性的用法：

```html

```

上述代码中，我们创建了一个`div`容器，并通过`width`属性指定容器宽度为300px，然后分别为两个`div`元素添加不同的类名，分别为`wrap-normal`和`wrap-break-word`，并在CSS中设置其`word-wrap`属性值。

运行上述代码，可以看到*个容器内的文本内容超过宽度时不会进行换行，而是溢出容器；而第二个容器内的文本内容超过宽度时会自动进行换行。

总结起来，word-wrap属性是用来控制文本在容器中换行规则的CSS属性，通过设置不同的属性值可以确定文本溢出容器时的换行方式。在不同的场景下，我们可以选择合适的属性值来满足需求。