background如何简写？如何在背景图像不变的情况下，依旧实现页面文字滚动，为之奈何？别担心，快用background-attachment: fixed;/固定定位/**常用的background样式如下，1.background-color2.background-image3.background-repeat4.background-attachment5.background-position，废话不多扯，直接代码页面展示：
专门建立的学习Q-q-u-n： 784783012 ，分享学习的方法和需要注意的小细节，不停更新最新的教程和学习技巧
（从零基础开始到前端项目实战教程，学习工具，全栈开发学习路线以及规划）
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <meta name="viewport" content="width=device-width, initial-scale=1.0">
6 <title>11种常用css样式之背景样式学习</title>
7 <style type="text/css">
8 *{
9 margin: 0;
10 padding: 0;
11 font: 14px/1.5em "Microsoft YaHei";
12 color: #fff;
13 }
14 body{
15 background-image:url(images/xs.png);/*背景图像*/
16 background-repeat: no-repeat;/*不重复*/
17 background-color: #ccc;
18 background-position:left center;
19 /* background-position: 50% 50%; */
20 /*background-position: 10px 10px;*/
21 /* 以窗口左上角为坐标系（0,0）定xy轴,朝right正,朝bottom为正 */
22 /* background简写 */
23 background: #f33 url(images/xs.png) no-repeat right center;
24 background-attachment: fixed;/*固定定位*/
25 }
26 div.box{
27 background-color:#f90;/*背景颜色*/
28 }
29 </style>
30 </head>
31 <body>
32 <div class="box">
33 你的压力来源于：无法自律，只是假装很努力；现状跟不上内心的欲望；所以你焦虑又恐慌 Your stress comes from: unable to discipline yourself, but pretending to work hard; 34 </div>
35 <!-- <p>你的压力来源于：无法自律，只是假装很努力；现状跟不上内心的欲望；所以你焦虑又恐慌 Your stress comes from: unable to discipline yourself, but pretending to work hard;</p>*50 回车50 -->
36 </body>
37 </html>
网友评论