1、background-position: 当背景图很大时,可以让其固定显示在不同的位置。剩下的会隐藏。

  引入背景图片:background-image: url("img/banner.jpg");

background-position参数:

  •   水平起始位置(left center right %)可以用这四种形式的任意一种
  •   垂直起始位置(top center bottom %)可以用这四种形式的任意一种

实例:

 background-position: right top;、、、、、、值的顺序没有关系

 background-position: 40% center;、、、、、、、、百分比表示从图的左边向右边的百分之多少开始显示。

 background-position: right;、、、、一个值表示从right边的图的中间开始显示

2、background-attachment: fixed

    固定定位相当于position:fixed

作用:用于固定背景图

background-attachment: fixed; 必须是背景图达到产生滚动条才会看到他的效果,否则不会起作用的

background-image大小和位置的设置的更多相关文章

  1. css3-11 如何改变背景图片的大小和位置

    css3-11 如何改变背景图片的大小和位置 一.总结 一句话总结:css3相对css2本身就支持改变背景图片的大小和位置. 1.怎么设置背景不填充padding部分? background-orig ...

  2. frame、bounds表示大小和位置的属性以及center、position、anchorPosition

    在iOS开发开发过程中经常会用到界面元素的frame.bounds表示大小和位置的属性以及center.position.anchorPosition等单纯表示位置的属性.这些属性究竟什么含义?彼此间 ...

  3. WPF编程,窗口保持上次关闭时的大小与位置。

    原文:WPF编程,窗口保持上次关闭时的大小与位置. 版权声明:我不生产代码,我只是代码的搬运工. https://blog.csdn.net/qq_43307934/article/details/8 ...

  4. Python3 Selenium WebDriver网页的前进、后退、刷新、最大化、获取窗口位置、设置窗口大小、获取页面title、获取网页源码、获取Url等基本操作

    Python3 Selenium WebDriver网页的前进.后退.刷新.最大化.获取窗口位置.设置窗口大小.获取页面title.获取网页源码.获取Url等基本操作 通过selenium webdr ...

  5. Selenium WebDriver-网页的前进、后退、刷新、最大化、获取窗口位置、设置窗口大小、获取页面title、获取网页源码、获取Url等基本操作

    通过selenium webdriver操作网页前进.后退.刷新.最大化.获取窗口位置.设置窗口大小.获取页面title.获取网页源码.获取Url等基本操作 from selenium import ...

  6. windowsclient开发--使你的client执行时记住上次关闭的大小和位置

    差点儿全部的windowsclient都能够调整大小,所以用户依据自己的喜好调整client的大小和位置. 可是当该client退出后,又一次执行client的时候.我们往往又要调整自己喜好的大小和位 ...

  7. 原生js实现多个随机大小颜色位置速度小球的碰壁反弹

    文章地址 https://www.cnblogs.com/sandraryan/ 需求:生成n个小球,让他们在一个大盒子中碰壁反弹,要求小球随机颜色,大小,初始位置,运动速度. 思路分析: 创建小球随 ...

  8. 样式操作案例5-改变box的大小和位置

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  9. atitit.自适应设计悬浮图片的大小and 位置

    atitit.自适应设计悬浮图片的大小and 位置 #--------最好使用relate定位.. 中间,图片的大小和位置走能相对table, 没有遮罩左的或者哈面儿文本的问题,要悬浮,使用top:- ...

随机推荐

  1. restframework类继承图

  2. 常用的自动化测试框架及测试框架的发展(Alpha)

    前言:自动化测试在过去的20年已经有了很大的发展.最初的测试工具只提供了简单的捕捉/回访功能,维护性较差.而且脚本工具实现需要很强的开发技术和经验,而且数量众多的测试脚本加上没有文档记录因此维护起来较 ...

  3. netstat 检测及监测网络连接

    网站没有很多流量,可查带宽却跑了几十M? 这是什么情况呢?      如果是出现这种情况,不排除是被CC了的可能.那么如何确定是否真的被CC了,被CC又有什么对应政策呢? netstat -na ,用 ...

  4. NexusFile(文件管理器)

    NexusFile是一款来自于韩国的文件管理器,类似于TotalCommander,拥有两个并排的文件夹窗口. NexusFile软件的特性如下: 基本功能:复制/移动, 复制/剪切/粘贴, 删除/擦 ...

  5. Spring注解开发-全面解析常用注解使用方法之生命周期

    本文github位置:https://github.com/WillVi/Spring-Annotation/ 往期文章:Spring注解开发-全面解析常用注解使用方法之组件注册 bean生命周期 ​ ...

  6. windows系统镜像 微软官方资源便捷下载教程

    今天跟小师弟学到了一个下载软件的好办法,省得到各种网站下载带有病毒,插件的资源. 这个神奇的网站叫做   MSDN, 我告诉你,这是一个私人维护的网站,里面有各种官方软件的下载地址.可以直接用下载工具 ...

  7. 布隆过滤器(Bloom Filter)简要介绍

    一种节省空间的概率数据结构 布隆过滤器可以理解为一个不怎么精确的 set 结构,当你使用它的 contains 方法判断某个对象是否存在时,它可能会误判.但是布隆过滤器也不是特别不精确,只要参数设置的 ...

  8. 021.1 IO流——File类

    ########################################IO流:    IO:用于处理设备上的数据的技术.设备:内存,硬盘,光盘    流:系统资源,Windows系统本身就可 ...

  9. Requests中文乱码解决方案

    分析: r = requests.get(“http://www.baidu.com“) **r.text返回的是Unicode型的数据. 使用r.content返回的是bytes型的数据. 也就是说 ...

  10. hook与链表操作

    hook与链表的节点操作有相似之处: 链表的前后顺序相当于程序的执行流: 对链表节点的替换或插入相当于hook技术: 1.替换:用新的节点替换原来的节点: 2.前插入: 3.后插入: 修改原来的结构.