css里的背景属性有哪些,如何去使用哪些属性
分类:纯色背景 背景图像
1、背景颜色
background-color : 任意合法的颜色 和 transparent
2、背景图像
background-image : url(想要加载的图片)
3、背景图片平铺
background-repeat :
repeat:默认值水平垂直方向都平铺
repeat-x : 水平方向平铺
repeat-y : 垂直方向平铺
no-repeat : 默认不平铺
4、背景图片的尺寸
background-size : value1 value2 宽度 高度 (单位px)
value% value% 宽度 高度 (单位%)
cover :全覆盖 将背景图等比放大知道背景图完全覆盖到元素的所有区域
contain : 包含 将背景图等比放大,直到下边或者右边有一个边缘碰到元素为止
5、背景图片固定
background-attachment : fixed;(固定)
scorll(滚动)
6、背景定位
改变背景图片在元素中的默认位置
background-position : 注意对于这个Firefox和Opera,background-attachment必须设置为“fixed”(固定)
left(top,center,bottom)
right(top,center,bottom)
center(top,center,bottom)
x% y%(注意第一个值是水平位置,第二个值是垂直位置;左上角是0% 0% ,右下角是100% 100%,如果只指定了一个值其他值是50%,默认为0% 0%)
xpos ypos(第一个值是水平位置,第二个值是垂直位置;单位可以是像素也可以是其他css单位,如果只指定了一个值其他值是50%;可以使用%和positions)
inherit : 指定background-position属性设置应该从父元素继承
7、雪碧图、精灵图
作用:将一些小的背景图合并到大的背景中去,以便实现减少服务器的请求
步骤:1>、我们根据图像的大小创建一个元素
2>、将多张图片合并为一张图片,下载全部所需的资源,只需一次请求,减少链接的消耗


css里的背景属性有哪些,如何去使用哪些属性的更多相关文章
- [1.1W字] 复习: CSS 9个背景属性&6种渐变函数, 学会可以手写实现AI中强大的"任意渐变"! #Archives009
Title/ CSS Background&Gradient完全指南 #Archives009 序: 关于 background 属性, 了解点CSS的人总会知道个大概. 但是你肯定多半还有点 ...
- css中background背景属性概
css中background背景属性概 background:url(背景图片路径) no-repeat;/*不重复默认在左上方*/background:url(背景图片路径) no-repeat ...
- css中的背景、边框、补丁相关属性
css中的背景.边框.补丁相关属性 关于背景涉及到背景颜色与背景图片 背景颜色background-color即可设定: 背景图片background-image即可设定: 但是背景图片还涉及到其他的 ...
- CSS里的pointer-events属性
现代浏览器里CSS的职责范围和JavaScript的越来越模糊分不清.比如CSS里-webkit-touch-callout属性在iOS里能禁止当用户点击时弹出气泡框.而本文要说的pointer-ev ...
- 使用CSS里的user-select属性控制用户在页面上选中的内容
CSS里的user-select属性用来禁止用户用鼠标在页面上选中文字.图片等,也就是,让页面内容不可选.也可以只允许用户选中文字,或者全部都放开,用户可以同时选中文字.还包括文本里的图片.视频等其它 ...
- 复习-css边框和背景属性
css边框和背景属性 border:所有边框属性 border-width:四条边框的宽度 border-style:设置边框样式,主要有dotted.solid.double border-colo ...
- CSS入门(背景各种属性的详解、垂直居中和过渡效果的详解、渐变效果的简单讲解、雪碧图和精灵图)
一.各种背景属性 1.background-image 属性为元素设置背景图像. 元素的背景占据了元素的全部尺寸,包括内边距和边框,但不包括外边距. 默认地,背景图像位于元素的左上角,并在水平和垂直方 ...
- H5_0026:使用CSS里的user-select属性控制用户在页面上选中的内容
CSS里的user-select属性用来禁止用户用鼠标在页面上选中文字.图片等,也就是,让页面内容不可选.也可以只允许用户选中文字,或者全部都放开,用户可以同时选中文字.还包括文本里的图片.视频等其它 ...
- CSS 常用样式 – 背景属性
一.背景颜色 background-color 属性名:background-color 作用:在盒子区域添加背景颜色的修饰 加载区域:在 border 及以内加载背景颜色 属性值:颜色名.颜色值 & ...
随机推荐
- luogu P1832 A+B Problem
题目背景 ·题目名称是吸引你点进来的 ·实际上该题还是很水的 题目描述 ·1+1=? 显然是2 ·a+b=? 1001回看不谢 ·哥德巴赫猜想 似乎已呈泛滥趋势 ·以上纯属个人吐槽 ·给定一个正整数n ...
- acm博弈论基础总结
acm博弈论基础总结 常见博弈结论 Nim 问题:共有N堆石子,编号1..n,第i堆中有个a[i]个石子. 每一次操作Alice和Bob可以从任意一堆石子中取出任意数量的石子,至少取一颗,至多取出这一 ...
- BZOJ 1051: [HAOI2006]受欢迎的牛(SCC)
1051: [HAOI2006]受欢迎的牛 Time Limit: 10 Sec Memory Limit: 162 MBSubmit: 8172 Solved: 4470[Submit][Sta ...
- 2017 CCPC秦皇岛 L题 One Dimensions Dave
BaoBao is trapped in a one-dimensional maze consisting of grids arranged in a row! The grids are nu ...
- Python 命令行之旅:使用 click 实现 git 命令
作者:HelloGitHub-Prodesire HelloGitHub 的<讲解开源项目>系列,项目地址:https://github.com/HelloGitHub-Team/Arti ...
- 12个超好用的IntelliJ IDEA 插件!你用过几个?
一.前言 IntelliJ IDEA 如果说IntelliJ IDEA是一款现代化智能开发工具的话,Eclipse则称得上是石器时代的东西了. 其实笔者也是一枚从Eclipse转IDEA的探索者,随着 ...
- xshell连接问题记录
操作系统Ubuntu 18.04 安装ubuntu后,连接不上.ubuntu18会每次重启重写dns,导致每次开机ip地址都不一样,所以需要先固定IP ubuntu18.04固定ip 修改固定 IP ...
- 一个UI程序开始的代码函数导读
#import "QFAppDelegate.h" @implementation QFAppDelegate //最后一个执行的初始化函数 //主要做一些启动之前的初始化操作 - ...
- 小白的springboot之路(十四)、AOP
0.前言 1.什么是AOP AOP(面向切面编程),是一种横切技术,是对OOP的补充和完善: 使用AOP的横切,可以对系统进行无侵入性的日志监听.事务.权限管理等: 思想上跟拦截器其实类似;拦截器是对 ...
- python利用setsockopt获得端口重用
server.setsockopt(SOL_SOCKET,SO_REUSEADDR,1) 假如端口呗socket使用过,并且利用socket.close()来关闭连接,但此时端口还没有释放,要经过一个 ...