html css设置文字自适应大小

HTML和CSS结合可以轻松实现文字的自适应大小，主要有以下几种方法：

1. **百分比字体大小**：你可以使用`font-size`属性，并设置为百分比值，这样元素的文字大小会相对于其容器的大小动态调整。例如：

   <p style="font-size: 80%;">这是一段自适应大小的文字</p>

2. **视口单位**：vw和vh是基于视口宽度和高度的单位，它们允许你在响应式设计中根据屏幕尺寸调整文字大小。例如：

   body {
     font-size: 16vw; /* 文字大小将占视口宽度的16% */
   }

3. **媒体查询**：可以根据设备视口的特性应用不同的字体大小，如针对小屏幕设备：

   @media (max-width: 768px) {
     p {
       font-size: 14px;
     }
   }

4. **弹性盒布局（Flexbox）或网格布局（Grid）**：如果你的元素需要在容器内自动调整，可以利用这两个现代布局模型。

记得在实际应用中考虑易读性和用户体验，避免过于小的字号影响阅读效果。同时，也要注意不同浏览器对一些新特性的兼容情况。