Question

我正在尝试使用文本作为网站的背景图片 - 如果文本自动回流，这很好，但我试图不滚动页面 - 所以在我的身体上我有溢出：隐藏，哪个工作正常除非我的内容div太长，否则它也会被隐藏。

有没有办法让“背景”图层溢出：隐藏，同时让我的内容在必要时流动？（我尝试过明显的溢出：隐藏在#background上）

<body>
<div id="content">
  All my content
</div>
<div id="background">
<p>'I told some of yo... lots of text</p>
</div>
</body>

是目前为止的基本页面格式，而css是：

body {overflow:hidden;}

#background {
    position:absolute;
    top:-20px;
    right:-20px;
    bottom:-20px;
    left:-20px;
    overflow:hidden;
    z-index:-1;}

#content {
    width:840px;
    text-align:left;
    margin-top:30px;
    margin-left:auto;
    margin-right:auto;
    height:auto;
    overflow:visible;}

Answer 1

固定#background位置并设置溢出：隐藏到它，而不是身体。

body {}

#background {
    position:fixed;
    top:0;
    left:0;
    width:95%; 
    height:95%;
    overflow:hidden;
    z-index:-1;
}

示例：http://jsfiddle.net/AlienWebguy/Av6YW/

在html页面上使用文本作为背景而不是图像

1 个答案: