background如何简写?如何在背景图像不变的情况下,依旧实现页面文字滚动,为之奈何?别担心,快用background-attachment: fixed;/*固定定位*/常用的background样式如下,1.background-color2.background-image3.background-repeat4.background-attachment5.background-position,废话不多扯,直接代码页面展示:

 <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>11种常用css样式之背景样式学习</title>
<style type="text/css">
*{
margin: 0;
padding: 0;
font: 14px/1.5em "Microsoft YaHei";
color: #fff;
}
body{
background-image:url(images/xs.png);/*背景图像*/
background-repeat: no-repeat;/*不重复*/
background-color: #ccc;
background-position:left center;
/* background-position: 50% 50%; */
/*background-position: 10px 10px;*/
/* 以窗口左上角为坐标系(0,0)定xy轴,朝right正,朝bottom为正 */
/* background简写 */
background: #f33 url(images/xs.png) no-repeat right center;
background-attachment: fixed;/*固定定位*/
}
div.box{
background-color:#f90;/*背景颜色*/
}
</style>
</head>
<body>
<div class="box">
你的压力来源于:无法自律,只是假装很努力;现状跟不上内心的欲望;所以你焦虑又恐慌&nbsp;&nbsp;Your stress comes from: unable to discipline yourself, but pretending to work hard;
</div>
<!-- <p>你的压力来源于:无法自律,只是假装很努力;现状跟不上内心的欲望;所以你焦虑又恐慌&nbsp;&nbsp;Your stress comes from: unable to discipline yourself, but pretending to work hard;</p>*50 回车50 -->
</body>
</html>

11种常用css样式之background学习的更多相关文章

  1. 11种常用css样式之border学习

    边框border通常简写为"border:1px solid red;"但其实一个完整的border边框其实是由1.border-width/*边框宽度*/,2.border-st ...

  2. 11种常用css样式之鼠标、列表和尺寸样式学习

    鼠标cursor常见样式crosshair;/*十字形状*/cursor:pointer;/*小手形状*/cursor:wait;/*等待形状*/cursor:text;/*默认 文本形状*/curs ...

  3. 11种常用css样式学习大结局滚动条与显示隐藏

    滚动条展示 overflow-x: hidden;/*是否对内容的左/右边缘进行裁剪*/overflow-y: hidden;/*是否对内容的上/下边缘进行裁剪*/overflow:scroll;/* ...

  4. 11种常用css样式之表格和定位样式学习

    table表格中border-collapse: collapse;/*表格边框是否合并*/border-spacing: 10px;/*表格边框之间的距离*/定位详情可以阅读position属性值4 ...

  5. 11种常用css样式之开篇文本字体学习

    常见css样式:1.字体与颜色2.背景属性3.文本属性4.边框属性5.鼠标光标属性6.列表样式7.定位属性8.内外边距9.浮动和清除浮动10.滚动条11.显示和隐藏 文本:1.letter-spaci ...

  6. 获取jQuery对象的第N个DOM元素 && table常用css样式

    获取jQuery对象的第N个DOM元素 1.$(selector).get(N-1) 2.$(selector)[N-1] 注意:.index()方法返回的是一个数,相当于C#中的IndexOf() ...

  7. Day 31:CSS选择器、常用CSS样式、盒子模型

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  8. 常用css样式(布局)

    兼容css3新属性 在css3中,我们可以使用prefixfree.min.js这个插件来自动为css3的相关属性加上兼容浏览器属性,使我们不用为每个css3新属性再加上属性(需要用到大量css3的项 ...

  9. 几种常用CSS3样式

    在我们日常工作中,由于考虑到浏览器的兼容性,所以很少用CSS3样式.关于其标准,W3C 仍然在对 CSS3 规范进行开发.不过,现代浏览器已经实现了相当多的 CSS3 属性.最近学习了CSS3,发现功 ...

随机推荐

  1. 【5min+】帮我排个队,谢谢。await Task.Yield()

    系列介绍 [五分钟的dotnet]是一个利用您的碎片化时间来学习和丰富.net知识的博文系列.它所包含了.net体系中可能会涉及到的方方面面,比如C#的小细节,AspnetCore,微服务中的.net ...

  2. idea命令行、撤销commit

    原文地址:https://blog.csdn.net/chzphoenix/article/details/38090349 近期在使用git,最开始在idea界面操作,后来要求用命令行.刚开始还不是 ...

  3. A complex 16-Level XSS Challenge

    A complex 16-Level XSS Challenge, held in summer 2014 (+1 Hidden Level) Index Level 0 Level 1 Level ...

  4. java重点知识点整理

    隔壁班的帅哥给我的 1.1简述JAVA的语言特点 a语法简单,功能强大 b分布式与安全性 c与平台无关 d多线程 1.2什么是Java虚拟机?它包括哪几个部分? 解: Java 虚拟机 (JVM ) ...

  5. selenium等待方式之显示等待

    有时候,页面元素并未及时加载出来导致后面的步骤无法执行 这里就需要在加载前添加等待时间,让目标元素有足够的时间加载出来 第一种方法:使用time.sleep() 这种方法过于强制,无论元素是否加载出来 ...

  6. Windows版Redis主从配置

    一.下载 从github上下载Redis的zip包,地址:https://github.com/MicrosoftArchive/redis/releases Redis本身不支持windows,这是 ...

  7. 光流法draw_flow()函数报错

    光流法draw_flow()函数报错 import cv2 from scipy import * def draw_flow(im, flow, step=16): ""&quo ...

  8. C# LINQ查询表达式用法对应Lambda表达式

    C#编程语言非常优美,我个人还是非常赞同的.特别是在学习一段时间C#后发现确实在它的语法和美观度来说确实要比其它编程语言强一些(也可能是由于VS编译器的加持)用起来非常舒服,而且对于C#我觉得他最优美 ...

  9. flask中使用SQLAlchemy操作mysql的一些注意事项和坑

    一 ImportError: cannot import name 'db' 由于app最后才加载,所以其他文件,比如models.py不能从app.py导入任何变量, 要使用db可以先定义一个,之后 ...

  10. OpenGL学习网址2

    http://www.opengpu.org/forum.php?mod=viewthread&tid=7525