Question

现在我有一个div line-wrap，word-break和一行随机创建的0和1来填充背景。它看起来不错，但长度是固定的，在不同的屏幕尺寸下太长/太短。

还有更好的方法吗？我只想要一个0和1的书呆子背景。

Answer 1

您可以对文本和文本包装器属性使用位置属性 position：absolute position：relative;

Answer 2

全屏显示文字区域：

  <!DOCTYPE html>
   <html>
      <body>
         <textarea name="text1" style="width: 100%;height: 100%"></textarea>
      </body>
   </html>

如果你想成为一个输入（使用不能编辑尺寸）：

<!DOCTYPE html>
  <html>
     <body>
      <input type="search"  style="width: 100%;height: 100%" >
     </body>
   </html>

Answer 3

您可以使用具有其他样式属性的div。

.background {
  overflow-x: hidden; // hide scroll-x
  overflow-y: hidden; // hide scroll-y
  word-wrap: break-word; // word wrap text
  width:97%; // width > 97% absolut position div will overflow and cause screen scroll
  height:97%; // height > 97% absolut position div will overflow and cause screen scroll
  position: absolute; // this way the div will act as background and it will  not interfier with the rest of the components in the html
}

你可以玩＆amp;在此测试：https://jsfiddle.net/fb3yLj8h/1/

如何将文本作为背景添加到html？

3 个答案: