我有一个个人网站，想设置无限背景。我的意思是当我滚动时背景保持不变，只是文本发生变化这是我的CSS的一个例子：body{color: #000;margin: 10px 0px 10px 0px; background-color: #ffffff;background-image:url('http://userlogos.org/files/backgrounds/Mafia_Penguin/Map1280x800.jpg');background-repeat:no-repeat;font-family: Arial, Helvetica, sans-serif;}
1 回答
肥皂起泡泡
TA贡献1829条经验 获得超6个赞
Al，您需要做的就是在 CSS 文件中使背景静态
像这样：
body
{
color: #000;
margin: 10px 0px 10px 0px;
background-color: #ffffff;
background-image:url('http://userlogos.org/files/backgrounds/Mafia_Penguin/Map1280x800.jpg');
background-repeat:no-repeat;
font-family: Arial, Helvetica, sans-serif;
background-attachment: fixed;/* This is what makes the background fixed*/
}
<!DOCTYPE HTML>
<html>
<head>
</head>
<body>
<h1>HELLO WORLD</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Feugiat sed lectus vestibulum mattis ullamcorper. Platea dictumst quisque sagittis purus sit amet volutpat. Neque sodales ut etiam sit amet nisl purus. Ipsum faucibus vitae aliquet nec ullamcorper sit. Venenatis tellus in metus vulputate. Facilisi etiam dignissim diam quis enim. Massa enim nec dui nunc mattis enim ut tellus elementum. In pellentesque massa placerat duis ultricies lacus. Leo urna molestie at elementum eu facilisis. Elit scelerisque mauris pellentesque pulvinar pellentesque habitant morbi tristique. Est lorem ipsum dolor sit amet consectetur adipiscing elit. Turpis egestas sed tempus urna et pharetra pharetra massa massa. Integer enim neque volutpat ac tincidunt vitae semper quis. Non arcu risus quis varius quam quisque id diam. Et egestas quis ipsum suspendisse ultrices.
Diam phasellus vestibulum lorem sed risus ultricies tristique nulla. Nulla facilisi morbi tempus iaculis urna id volutpat lacus laoreet. At imperdiet dui accumsan sit amet nulla facilisi morbi. Phasellus egestas tellus rutrum tellus pellentesque eu tincidunt tortor. Facilisi nullam vehicula ipsum a. Tincidunt praesent semper feugiat nibh sed pulvinar. Ut sem viverra aliquet eget sit amet tellus cras. Fermentum iaculis eu non diam phasellus. Elit ullamcorper dignissim cras tincidunt lobortis feugiat vivamus. Nisl nisi scelerisque eu ultrices vitae auctor eu. Pharetra convallis posuere morbi leo. Eu consequat ac felis donec et odio pellentesque. Tempus quam pellentesque nec nam aliquam. Pretium fusce id velit ut tortor pretium.
Sodales ut etiam sit amet nisl purus in mollis nunc. Sem viverra aliquet eget sit. Convallis a cras semper auctor. Cras adipiscing enim eu turpis. Sed euismod nisi porta lorem mollis. Massa id neque aliquam vestibulum morbi blandit cursus risus at. Imperdiet nulla malesuada pellentesque elit eget gravida cum sociis natoque. Lorem dolor sed viverra ipsum nunc. At ultrices mi tempus imperdiet nulla. Etiam dignissim diam quis enim lobortis scelerisque fermentum. Nisl nisi scelerisque eu ultrices vitae auctor eu augue. Turpis cursus in hac habitasse platea dictumst quisque. Quis viverra nibh cras pulvinar. Gravida rutrum quisque non tellus orci ac auctor augue.
Ac odio tempor orci dapibus ultrices. Interdum velit euismod in pellentesque massa placerat duis ultricies lacus. Vulputate ut pharetra sit amet aliquam id diam maecenas ultricies. Turpis in eu mi bibendum neque. Pellentesque adipiscing commodo elit at imperdiet dui. Nisi est sit amet facilisis magna etiam. Consectetur adipiscing elit ut aliquam purus sit amet. Rhoncus est pellentesque elit ullamcorper dignissim cras tincidunt lobortis. Massa tincidunt dui ut ornare. Felis eget velit aliquet sagittis id consectetur purus ut faucibus. Aliquam id diam maecenas ultricies. Varius sit amet mattis vulputate enim nulla.
Dui id ornare arcu odio ut. Dignissim suspendisse in est ante in nibh. Velit laoreet id donec ultrices tincidunt arcu non sodales neque. Nunc sed augue lacus viverra vitae congue eu consequat. Nunc scelerisque viverra mauris in aliquam sem. Magna sit amet purus gravida quis blandit. Est ullamcorper eget nulla facilisi etiam dignissim diam quis. Turpis tincidunt id aliquet risus. Urna et pharetra pharetra massa massa ultricies. Ac orci phasellus egestas tellus rutrum. Phasellus faucibus scelerisque eleifend donec pretium vulputate sapien. Sed vulputate odio ut enim blandit volutpat maecenas. Lacus laoreet non curabitur gravida arcu ac.</p>
</body>
</html>
添加回答
举报
0/150
提交
取消