css属性background
一、background-size
1.具体设定的px值,及北背景图片的具体宽高
2.设定的百分比,相对于容器的宽高
3.设定三个铺设类型:
(1)cover: 以宽 / 高 为基本,尽可能的去铺满整个容器,溢出部分截掉
(2)contain:以宽 / 高 为基本,尽可能的去铺满整个容器,但要求不能溢出容器
二、background-repeat: repeat / no-repeat; 一张图片无法铺满整个容器时,是否重复图片平铺
三、background-position:
1、具体两个px值,设定的为相对于容器左上角的偏移值
2、两个百分比值: 计算公式为 (容器的宽度 - 背景图片的宽度) * 百分比 ,高度类推即可
3.left, right, top, bottom, 分别相当于 第一个百分比的 0% ,100%,第二个百分比的 0%,100%
4.center, 相当于百分比的50%
注意: background-position必须要写两个值,不能系一个值来代替两个相同的值
css属性background的更多相关文章
- css属性 background
background 在一个声明中设置所有的背景属性. background-attachment 设置背景图像是否固定或者随着页面的其余部分滚动. background-color 设置元素的背景颜 ...
- css中background背景属性概
css中background背景属性概 background:url(背景图片路径) no-repeat;/*不重复默认在左上方*/background:url(背景图片路径) no-repeat ...
- CSS背景属性Background详解
[转] 本文详解了CSS的背景属性Background,包括CSS3中新增的背景属性.如果你是个CSS初学者,还可以查看之前介绍的CSS浮动属性和CSS透明属性详解. CSS2 中有5个主要的背景(b ...
- CSS下背景属性background的使用方法
背景颜色(background-color) CSS可以用纯色来作为背景,也可以将背景设置为透明,background相当于xhtml中的bgcolor. 它的两个值: transparent(默认值 ...
- CSS中background属性详解
CSS背景属性 background css 说明 background-image:url(图片的网址); 背景图 background: url( 图片的网址 ); 背景 background-c ...
- 前端CSS-font属性,超链接的美化,css精灵,background综合属性
前端CSS-font属性,超链接的美化,css精灵,background综合属性 1. font属性 使用font属性,能够将字号.行高.字体,能够一起设置. font:14px/24px " ...
- CSS代码示例-背景属性(background)
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- CSS基础-background的那些属性
background的那些属性 background:背景的意思常用的六个属性 1.background-color:背景颜色 2.background-image:背景图像 3.background ...
- 通过设置CSS属性让DIV水平居中
通过设置CSS属性让DIV水平居中 ---------------------- <html> <head> <title></title> <m ...
随机推荐
- JS 导出Table为excel的三种可行方法
[html] view plain copy<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" &q ...
- zabbix监控xenserver
xenserver是基于redhat的,可以在zabbix官网下载对应的redhat zabbix安装包,直接安装即可 http://repo.zabbix.com/zabbix/3.0/rhel/5 ...
- Mongodb 的学习
传送门: # 官方网站 及 下载地址 https://www.mongodb.com/download-center/enterprise/releases # 之前简单学习的笔记http://www ...
- Linux 查看tomcat占用的端口号
第一步:先查看tomcat占用的进程号 ps -ef|grep tomcat 第二步:根据进程号,查看进程所占用的端口 netstat -apn 由此得知,tomcat的进程号是21845,并得到端口 ...
- cocos2dx游戏 地图
#include "HelloWorld.h" USING_NS_CC; CCScene* MyHelloWorld::scene() { // 'scene' is an aut ...
- HBase概念及表格设计
HBase概念及表格设计 1. 概述(扯淡~) HBase是一帮家伙看了Google发布的一片名为“BigTable”的论文以后,犹如醍醐灌顶,进而“山寨”出来的一套系统. 由此可见: 1. 几乎所有 ...
- 编程算法 - 二叉树的最低公共祖先 代码(C)
二叉树的最低公共祖先 代码(C) 本文地址: http://blog.csdn.net/caroline_wendy 二叉树的最低公共祖先(lowest common ancestor), 首先先序遍 ...
- windows db2 添加用户权限
http://www.csharpwin.com/csharpspace/12086r9069.shtml 在windows上DB2数据库安装的时候会创建一个系统管理员 的账户,默认为DB2ADMIN ...
- 几种session存储方式比较
原文: http://blog.sina.com.cn/s/blog_495697e6010143tj.html 集群中session安全和同步是个最大的问题,下面是我收集到的几种session同步的 ...
- Laravel手记:执行route:cache时报LogicException
laravel5的路由支持缓存.需要执行以下命令: php artisan route:cache 执行完毕后,报出以下错误: Route cache cleared! [LogicException ...