.container {
width: 500px;
max-width: 300px; /* 允许内容自适应缩放，宽度小于100% */
在这个例子中，`.container`元素的宽度被设置为500px，然后max-width被设置为300px，这意味着容器元素的宽度不会超过300px，内容会根据宽度自适应缩放。
接下来，大家可以定义文档的标题、段落和图片等内容，并将它们添加到容器中。对于标题和段落，大家可以使用CSS的`margin`和`padding`属性来让它们自适应缩放。例如：
margin: 0 20px;
margin: 0 20px;
width: 100%;
height: auto;
在这个例子中，`.container`元素中添加了一个标题元素和一个段落元素。标题元素使用了margin属性，使其在水平方向上自适应缩放。段落元素使用了margin和padding属性，使其在垂直方向上自适应缩放。图片元素也使用了width: 100%;height: auto；属性，使其自适应缩放。
最后，大家可以使用CSS的`transform`属性来对内容进行旋转和缩放等操作。例如：
.container {
width: 500px;
max-width: 300px; /* 允许内容自适应缩放，宽度小于100% */
transform: rotateY(60deg);
transform: scale(0.7);
width: 100%;
height: auto;
transform: scale(1.1);
在这个例子中，`.container`元素中添加了一个标题元素和一个段落元素。标题元素使用了transform: rotateY(60deg)；属性，使其向右旋转60度。段落元素使用了transform: scale(0.7)；属性，使其缩小了70%。图片元素也使用了width: 100%;height: auto；和transform: scale(1.1)；属性，使其缩小了110%。
通过使用CSS的`width`和`max-width`属性，大家可以实现文档缩放。同时，通过使用`margin`和`padding`属性，大家可以实现标题、段落和图片等内容的自适应缩放。最后，通过使用`transform`属性，大家可以对内容进行旋转和缩放等操作。