关于css 中的属性 background-attachment

background-attachment  这个css属性表示“设置或检索背景图像是随对象内容滚动还是固定的。”
有三个属性,fixed(固定背景图片) scroll(随着内容而滚动) inherit (继承父标签的此属性)

通常用在textarea元素中。

<form action="" method="post">
<textarea name="MrJin" id="MrJin" cols="" rows=""></textarea>
<input name="Submit" type="submit" value="Submit" />
</form>

#MrJin {
display:block;
width:350px;
height:240px;
background:url(t.jpg) no-repeat 10px 30px;
background-attachment:fixed ;
border:1px solid #06f;
padding:5px;
}

有时候在多行文本框中输入过多的文字时,背景图片会跑到最上面去了,即随着内容而滚动。在ie 6,7 下都存在这样的问题,而ff下则没有。所以要加上background-attachment:fixed ;                     这样就搞定了。

不过,在加上background-attachment:fixed ;  这个样式后,在ff,ie 7下背景图片与ie6下背景图片显示有差别,ff,ie 7下背景会向上显示一些,所以要用到hack了。background-attachment:fixed ;   替换成 background-attachment:inherit;_background-attachment:fixed;  就ok啦。

发表评论

电子邮件地址不会被公开。 必填项已用*标注

*