时间戳

首页 > 解决方案 > 将文本作为背景放置到表格中

html - 将文本作为背景放置到表格中

问题描述

我正在尝试将一个单词作为表格的背景，并让它跨越表格的高度和宽度。我可以将文本放在高度和宽度为 100% 的表格 div 中，但它不跨越高度和宽度？这是我正在尝试做的事情的代码。谢谢你。

CSS

#background-text {
   position: absolute;
   top: 0;
   left: 0;
   bottom: 0;
   right: 0;
   z-index: -1;
  height: 100%;
  width: 100%;
  color: #52a94c;
}

标签： htmlcss

解决方案

我认为你有一些选择：

首先，尝试使用 vw，但您需要对多种尺寸使用媒体查询。例如：

font-size: 17vw;

另一个更好的选择是使用 Javascript 库，例如：

http://fittextjs.com/（带有 jquery）

https://github.com/adactio/FitText.js（不带 jquery）

这是一个使用FitText的简单示例：

$("div").fitText(0.38);

它将使文本适合 div 的 38%。

[编辑] 这是一篇更完整的文章，其中包含一些适合文本的技巧：https ://css-tricks.com/fitting-text-to-a-container/

推荐阅读