当前位置:  首页  >  前端开发  >  CSS+DIV

css背景不滚动的实现方法

css背景不滚动的实现方法:首先新建一个html代码页面;然后在<title>标签后面创建一个<style>标签;接着在这个标签里设置<body>标签的背景图片;最后设置“background-repeat:no-repeat;”属性即可。

css背景不滚动的实现方法:首先新建一个html代码页面;然后在标签后面创建一个<style>标签;接着在这个标签里设置<body>标签的背景图片;最后设置“background-repeat:no-repeat;”属性即可。</p></blockquote><p></p><p>设置背景图片样式。在<title>标签后面创建一个<style>标签,然后在这个标签里设置<body>标签的背景图片,以及背景图片不重复。'</p><p>样式代码:</p><pre class="brush:php;toolbar:false">body{ background-image: url(img/bg.jpg); background-repeat:no-repeat; }</pre><p><p>以上就是css 背景不滚动的实现方法的详细内容,更多请关注 第一PHP社区 其它相关文章!</p> </div> <div class="article_ab" style="width: 720px;height: 100px;margin: 0 auto;margin-top: 15px;"> </div> <div class="article_cmnt"> <div class="cmnt_title">吐了个 "CAO" !</div> <form action="" method="post"> <div class="cmnt_text"> <textarea class="ping-txt" onfocus="ck_txt(this);" onblur="ck_txt2(this);" id="ping-txt" name="ping-txt" >吐个槽吧,看都看了</textarea> </div> <div class="cmnt_cmt"> <div class="cmnt_login_box"> <a href="https://www.php1.cn/?s=user/login/index&from=https%3A%2F%2Fwww.php1.cn%2Fdetail%2Fphp-deffcf5619.html">会员登录</a> | <a href="http://www.php1.cn/?s=user/reg/index">用户注册</a> </div> <div class="post_cmnt"><input type="button" value="吐  槽" onclick="post_ping();" /></div> </div> </form> </div> </div> <script type="text/javascript" src="https://www.php1.cn/SyntaxHighlighter/scripts/shCore.js"></script> <script type="text/javascript" src="https://www.php1.cn/SyntaxHighlighter/scripts/shBrushBash.js"></script> <script type="text/javascript" src="https://www.php1.cn/SyntaxHighlighter/scripts/shBrushCpp.js"></script> <script type="text/javascript" src="https://www.php1.cn/SyntaxHighlighter/scripts/shBrushCSharp.js"></script> <script type="text/javascript" src="https://www.php1.cn/SyntaxHighlighter/scripts/shBrushCss.js"></script> <script type="text/javascript" src="https://www.php1.cn/SyntaxHighlighter/scripts/shBrushDelphi.js"></script> <script type="text/javascript" src="https://www.php1.cn/SyntaxHighlighter/scripts/shBrushDiff.js"></script> <script type="text/javascript" src="https://www.php1.cn/SyntaxHighlighter/scripts/shBrushGroovy.js"></script> <script type="text/javascript" src="https://www.php1.cn/SyntaxHighlighter/scripts/shBrushJava.js"></script> <script type="text/javascript" src="https://www.php1.cn/SyntaxHighlighter/scripts/shBrushJScript.js"></script> <script type="text/javascript" src="https://www.php1.cn/SyntaxHighlighter/scripts/shBrushPhp.js"></script> <script type="text/javascript" src="https://www.php1.cn/SyntaxHighlighter/scripts/shBrushPlain.js"></script> <script type="text/javascript" src="https://www.php1.cn/SyntaxHighlighter/scripts/shBrushPython.js"></script> <script type="text/javascript" src="https://www.php1.cn/SyntaxHighlighter/scripts/shBrushRuby.js"></script> <script type="text/javascript" src="https://www.php1.cn/SyntaxHighlighter/scripts/shBrushScala.js"></script> <script type="text/javascript" src="https://www.php1.cn/SyntaxHighlighter/scripts/shBrushSql.js"></script> <script type="text/javascript" src="https://www.php1.cn/SyntaxHighlighter/scripts/shBrushVb.js"></script> <script type="text/javascript" src="https://www.php1.cn/SyntaxHighlighter/scripts/shBrushXml.js"></script> <link type="text/css" rel="stylesheet" href="https://www.php1.cn/SyntaxHighlighter/styles/shCore.css"/> <link type="text/css" rel="stylesheet" href="https://www.php1.cn/SyntaxHighlighter/styles/shThemeLiuQing.css"/> <style>.syntaxhighlighter{padding-top:20px;padding-bottom:20px;}</style> <script type="text/javascript"> SyntaxHighlighter.config.clipboardSwf = 'https://www.php1.cn/SyntaxHighlighter/scripts/clipboard.swf'; SyntaxHighlighter.all(); </script> <div class="article_right"> <div class="profile"> <div class="login"> <!-- 未登录 --> <div class="login-info"> <div class="user-photo"> <img src="/style/home/images/user-no-photo.jpg" class="lazy-img" data-url="" alt="第一PHP社区"> </div> <div class="user-txt"> <p style="color: #666;font-weight: bold;">Hi,亲爱的小伙伴!</p> <p>欢迎来到php1.cn社区!</p> <p><a href="https://www.php1.cn/?s=user/login/index&from=https%3A%2F%2Fwww.php1.cn%2Fdetail%2Fphp-deffcf5619.html" class="login-open" title="PHP登录">点击登录, 发现精彩</a></p> </div> </div> <div class="login-btn"> <a href="https://www.php1.cn/?s=user/reg/index" class="skins-btn sign-btn" title="PHP用户注册">注册</a> <a href="https://www.php1.cn/?s=user/login/index&from=https%3A%2F%2Fwww.php1.cn%2Fdetail%2Fphp-deffcf5619.html" class="skins-btn skins-btn-green">登录</a> </div> </div> </div> <div class="wx_pic"> <div class="wx_top_line"> <div class="wx_t_l"></div> <div class="wx_t_r"></div> </div> <div class="wx_top">扫码关注 PHP1 官方微信号</div> <div class="wx_box"> <img src="/style/home/images/wx_pic.png"/> </div> </div> <div class="tools"> <div class="tools_top_line"> <div class="tools_t_l"></div> <div class="tools_t_r"></div> </div> <div class="tools_top">Tools Online | 在线开发工具</div> <div class="tools_box"> <ul> <li> <a href="https://tools.php1.cn/?s=jsformat" title="HTML/JS格式化/压缩">HTML/JS格式化/压缩</a> </li> <li> <a href="https://tools.php1.cn/?s=cssformat" title="CSS代码格式化工具">CSS代码格式化工具</a> </li> <li> <a href="https://tools.php1.cn/?s=editor" title="文章自动排版工具">文章自动排版工具</a> </li> <li> <a href="https://tools.php1.cn/?s=htmljs" title="HTML/JS转换">HTML/JS转换</a> </li> <li> <a href="https://tools.php1.cn/?s=utf8" title="UTF-8编码转换工具">UTF-8编码转换工具</a> </li> <li> <a href="https://tools.php1.cn/?s=unicode" title="Unicode 转换">Unicode 转换</a> </li> <li> <a href="https://tools.php1.cn/?s=urlencode" title="URL编码解码">URL编码解码</a> </li> <li> <a href="https://tools.php1.cn/?s=qrcode" title="二维码生成工具">二维码生成工具</a> </li> <li> <a href="https://tools.php1.cn/?s=ip" title="IP地址查询">IP地址查询</a> </li> <li> <a href="https://tools.php1.cn/?s=httpcode" title="HTTP状态码(响应码)">HTTP状态码(响应码)</a> </li> <li> <a href="https://tools.php1.cn/?s=headers" title="网页Header头">网页Header头</a> </li> <li> <a href="https://tools.php1.cn/?s=htmlcode" title="网页源代码">网页源代码</a> </li> <li> <a href="https://tools.php1.cn/?s=colorjson" title="JSON解析着色">JSON解析着色</a> </li> <li> <a href="https://tools.php1.cn/?s=diff" title="Diff文件比较">Diff文件比较</a> </li> </ul> </div> </div> <div class="rank"> <div class="rank_top_line"> <div class="rank_t_l"></div> <div class="rank_t_r"></div> </div> <div class="rank_top">RankList | 热门文章</div> <div class="rank_box"> <ul> <li> <b >1</b><a href="http://www.php1.cn/detail/php-66feb67e90.html" title="css怎么实现首字母下沉效果">css怎么实现首字母下沉效果</a> </li> <li> <b >2</b><a href="http://www.php1.cn/detail/php-a6294b125d.html" title="css ellipsis不起作用怎么办">css ellipsis不起作用怎么办</a> </li> <li> <b >3</b><a href="http://www.php1.cn/detail/php-737b1a69dc.html" title="css描边属性是什么">css描边属性是什么</a> </li> <li> <b >4</b><a href="http://www.php1.cn/detail/php-390aa7c8de.html" title="css中的类选择器有什么用">css中的类选择器有什么用</a> </li> <li> <b >5</b><a href="http://www.php1.cn/detail/php-deffcf5619.html" title="css 背景不滚动的实现方法">css 背景不滚动的实现方法</a> </li> <li> <b class="black">6</b><a href="http://www.php1.cn/detail/php-802b01737b.html" title="css怎么设置全屏背景图片">css怎么设置全屏背景图片</a> </li> <li> <b class="black">7</b><a href="http://www.php1.cn/detail/php-6a23f1ad35.html" title="css实现文字不换行溢出显示省略号">css实现文字不换行溢出显示省略号</a> </li> <li> <b class="black">8</b><a href="http://www.php1.cn/detail/php-835b38713d.html" title="如何使用CSS 显示 XML">如何使用CSS 显示 XML</a> </li> <li> <b class="black">9</b><a href="http://www.php1.cn/detail/php-af26303e7f.html" title="如何解决myeclipse 8.5 css乱码问题">如何解决myeclipse 8.5 css乱码问题</a> </li> <li> <b class="black">10</b><a href="http://www.php1.cn/detail/php-8a4d214e78.html" title="css怎么让a标签居中">css怎么让a标签居中</a> </li> <li> <b class="black">11</b><a href="http://www.php1.cn/detail/php-9c5b707ff6.html" title="css中position的定位有哪些">css中position的定位有哪些</a> </li> <li> <b class="black">12</b><a href="http://www.php1.cn/detail/php-d8fb53bc54.html" title="css3怎么让文字垂直居中显示">css3怎么让文字垂直居中显示</a> </li> </ul> </div> </div> <div class="baidu_ad_box" style="width: 320px;height: 280px;margin-top: 15px;text-align: center;border: 1px solid #ddd;padding-top: 10px;padding-bottom: 10px;"> <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script> <!-- zishiying --> <ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-8923551941185667" data-ad-slot="9743942645" data-ad-format="auto"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> </div> <div class="rank"> <div class="rank_top_line"> <div class="rank_t_l"></div> <div class="rank_t_r"></div> </div> <div class="rank_top">Recommend | 推荐阅读</div> <div class="rank_box"> <ul> <li> <b >1</b><a href="http://www.php1.cn/detail/php-d3ffbea141.html" title="利用js实现图片的轮播效果">利用js实现图片的轮播效果</a> </li> <li> <b >2</b><a href="http://www.php1.cn/detail/php-55cb1f12a8.html" title="关于mysql搭建亿级cmd5数据库,毫秒级查询(完整过程)">关于mysql搭建亿级cmd5数据库,毫秒级查询(完整过程)</a> </li> <li> <b >3</b><a href="http://www.php1.cn/detail/php-7876534fb6.html" title="数据库关系的6个性质">数据库关系的6个性质</a> </li> <li> <b >4</b><a href="http://www.php1.cn/detail/php-b5f005daa0.html" title="css list-style属性怎么用">css list-style属性怎么用</a> </li> <li> <b >5</b><a href="http://www.php1.cn/detail/php-002a7eefc7.html" title="css box-orient属性怎么用">css box-orient属性怎么用</a> </li> <li> <b class="black">6</b><a href="http://www.php1.cn/detail/php-27672dc0e6.html" title="HTML <audio> 标签">HTML <audio> 标签</a> </li> <li> <b class="black">7</b><a href="http://www.php1.cn/detail/php-b62a84b27e.html" title="html5新增标签--nav标签介绍-">html5新增标签--nav标签介绍-</a> </li> <li> <b class="black">8</b><a href="http://www.php1.cn/detail/php-b3238f4ebd.html" title="php url 中文乱码的解决办法汇总-PHP问题">php url 中文乱码的解决办法汇总-PHP问题</a> </li> <li> <b class="black">9</b><a href="http://www.php1.cn/detail/php-898532d6de.html" title="JS中数组的迭代方法:filter、reduce、every、some">JS中数组的迭代方法:filter、reduce、every、some</a> </li> <li> <b class="black">10</b><a href="http://www.php1.cn/detail/php-bb6f609015.html" title="html5如何使用canvas绘制“钟表”图案?(代码实例)-">html5如何使用canvas绘制“钟表”图案?(代码实例)-</a> </li> <li> <b class="black">11</b><a href="http://www.php1.cn/detail/php-c0b52d87fa.html" title="css clear属性怎么用">css clear属性怎么用</a> </li> <li> <b class="black">12</b><a href="http://www.php1.cn/detail/php-aa787cd47c.html" title="如何使用JavaScript完成省市联动效果">如何使用JavaScript完成省市联动效果</a> </li> </ul> </div> </div> </div> <div style="clear: both;"></div> </div> <div style="clear: both"></div> <div class="bottom"> PHP1.CN | 中国最专业的PHP中文社区 | <a href="https://www.json1.cn/" target="_blank" title="json解析格式化">json解析格式化</a> | <a href="https://news.php1.cn/" title="PHP资讯">PHP资讯</a> | <a href="https://school.php1.cn/" title="PHP教程">PHP教程</a> | <a href="https://database.php1.cn/" title="数据库技术">数据库技术</a> | <a href="https://server.php1.cn/" title="服务器技术">服务器技术</a> | <a href="https://web.php1.cn/" title="前端技术">前端开发技术</a> | <a href="https://www.php1.cn/phpframework.html" title="PHP框架">PHP框架</a> | <a href="https://tools.php1.cn/">开发工具</a> | <a href="https://www.json1.cn/tools/" title="在线工具">在线工具</a><BR /> Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved PHP1.CN 第一PHP社区 版权所有 <BR />       </div> <script> (function(){ var bp = document.createElement('script'); var curProtocol = window.location.protocol.split(':')[0]; if (curProtocol === 'https') { bp.src = 'https://zz.bdstatic.com/linksubmit/push.js'; } else { bp.src = 'https://push.zhanzhang.baidu.com/push.js'; } var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(bp, s); })(); </script></body> </html>