日期:2015-12-05


背景定位算是才弄明白:

background-position:50% 50%;
图片水平和垂直居中。与 background-position:center center;效果等同。
等同于x:{容器(container)的宽度—背景图片的宽度}*x百分比,超出的部分隐藏。
等同于y:{容器(container)的高度—背景图片的高度}*y百分比,超出的部分隐藏。

css背景定位的更多相关文章

  1. CSS背景background图片

    一.CSS背景background图片   -   TOP 1.背景图片语法background-image:url() 引入背景图片background-repeat:no-repeat 设置背景图 ...

  2. css背景图片定位练习(二): background-position的百分比

    background-position:x y; 百分比定位并不能直观的看出来,需要通过计算. background-position百分比计算公式: (容器宽度—背景图片的宽度)*x%=xpx(容器 ...

  3. css背景图片定位练习(一)

    首先准备一张雪碧图,Like this 背景图片的定位方法有3种,比较常用的两种为 关键字:background-position: top left; (top/bottom/cennter/lef ...

  4. CSS背景颜色、背景图片、平铺、定位、固定

    CSS背景颜色设置 background-color:red;如设置背景颜色为红色: 背景颜色设置支持3种写法: 颜色名 16进制 rgb CSS背景图片颜色设置 background-image:u ...

  5. CSS背景图片定位

    原文:CSS背景图片定位 在网页开发中我们经常需要对图片进行分割(如下图)来使用,而不是分别提供单独的图片来调用,常见的如页面背景,按钮图标等,这样做的好处就是减少请求次数,节省时间和带宽. 对背景图 ...

  6. [css]《css揭秘》学习(三)-灵活的背景定位

    一.background-position属性 使用该属性,在不确定容器大小的情况下,也可以指定图案距离容器边缘的位置:但是需要为不支持该属性的浏览器指定回退方案,否则,图案会默认放在左上角. < ...

  7. [css 揭秘]:CSS揭秘 技巧(三):背景定位

    我的github地址:https://github.com/FannieGirl/ifannie 源码都在这上面哦! 喜欢的给我一个星吧 背景定位 问题:很多时候,我们想针对容器某个角对背景图片做便宜 ...

  8. css 背景(background)属性、背景图定位

    background属性: Background属性是css中应用比较多,且比较重要的一个属性,它是负责给盒子设置背景图上和背景颜色的,background是一个复合属性,它可以分解成如下几个设置项: ...

  9. CSS 背景图片 添加 重复和定位。

    <!doctype html><html lang="en"> <head> <meta charset="UTF-8" ...

随机推荐

  1. Nessus基本命令

    /etc/init.d/nessusd start 启动nessusd服务 默认端口8834 添加用户(未知是什么用户) sudo /opt/nessus/sbin/nessus-adduser

  2. [Effective Java]第二章 创建和销毁对象

    声明:原创作品,转载时请注明文章来自SAP师太技术博客( 博/客/园www.cnblogs.com):www.cnblogs.com/jiangzhengjun,并以超链接形式标明文章原始出处,否则将 ...

  3. return、 return false的用法

    1. return返回null,起到中断方法执行的效果,只要不return false事件处理函数将会继续执行,表单将提交2. return false,事件处理函数会取消事件,不再继续向下执行.比如 ...

  4. Phantomjs 在cmd命令行显示中文乱码

    cmd命令行窗口显示中文乱码 cmd中文支持gbk编码 在js执行文件中加上(一般在最开始加) phantom.outputEncoding="gbk"; 这样乱码就正确了

  5. Maven聚合与继承

    分别为两种不同形式的聚合 相关代码如下: https://github.com/humeng126/account-parent_1 https://github.com/humeng126/acco ...

  6. 阿里云大数据三次技术突围:Greenplum、Hadoop和“飞天”

    阿里云大数据三次技术突围:Greenplum.Hadoop和"飞天"    对于企业来说,到底什么是云计算?相信很多企业都有这样的困惑,让我们一起回到这个原始的起点探讨究竟什么是云 ...

  7. mysql概要(八)视图

    1.视图使用时,以表的方式使用 视图修改 alter view 视图名 as select ...; 1.1创建视图: 2.视图的好处: 通过id取模存放四个表中,然后通过视图把表合成一张表: 3.视 ...

  8. KMPlayer

    1. KMP 播放时,有声无图像,黑屏.解决: 打开KMP然后右键-选项-参数设置(或者进入KMP直接按F2)-视频处理-右边选择“渲染器”-在“渲染器”中选择“VMR9 未渲染 (HQ字幕)”-选中 ...

  9. [转载] C++ 多线程编程总结

    原文: http://www.cnblogs.com/zhiranok/archive/2012/05/13/cpp_multi_thread.html 在开发C++程序时,一般在吞吐量.并发.实时性 ...

  10. mysql 存储过程中limit

    1.mysql的高版本(5.5),存储过程中的limit可以使用变量,如下:select * from student limit iStart,iNum; 2.mysql的低版本(5.1),存储过程 ...