background-image属性
background-image 属性
- 实例,设置
body
元素的背景图像:
body
{
background-image: url('paper.gif');
background-color: #cccccc;
}
background-image
url('URL')
指向图像的路径。none
默认值。不显示背景图像。inherit
规定应该从父元素继承 background-image 属性的设置。
background-attachment
scroll
默认值。背景图像会随着页面其余部分的滚动而移动。fixed
当页面的其余部分滚动时,背景图像不会移动。inherit
规定应该从父元素继承 background-attachment 属性的设置。
background-color
color_name
规定颜色值为颜色名称的背景颜色(比如 red)。hex_number
规定颜色值为十六进制值的背景颜色(比如 #ff0000)。rgb_number
规定颜色值为 rgb 代码的背景颜色(比如 rgb(255,0,0))。transparent
默认。背景颜色为透明。inherit
规定应该从父元素继承 background-color 属性的设置。
background-repeat
repeat
默认。背景图像将在垂直方向和水平方向重复。repeat-x
背景图像将在水平方向重复。repeat-y
背景图像将在垂直方向重复。no-repeat
背景图像将仅显示一次。inherit
规定应该从父元素继承 background-repeat 属性的设置。
background-size: length|percentage|cover|contain;
length
设置背景图像的高度和宽度。第一个值设置宽度,第二个值设置高度。如果只设置一个值,则第二个值会被设置为 "auto"。percentage
以父元素的百分比来设置背景图像的宽度和高度。第一个值设置宽度,第二个值设置高度。如果只设置一个值,则第二个值会被设置为 "auto"。cover
把背景图像扩展至足够大,以使背景图像完全覆盖背景区域。背景图像的某些部分也许无法显示在背景定位区域中。contain
把图像图像扩展至最大尺寸,以使其宽度和高度完全适应内容区域。
background-image属性的更多相关文章
- css中background背景属性概
css中background背景属性概 background:url(背景图片路径) no-repeat;/*不重复默认在左上方*/background:url(背景图片路径) no-repeat ...
- background复合属性详解(上):background-image
background复合属性是个很复杂的属性,花样非常多,比较神奇的是css3 中支持多图片背景了,这篇文章先讲讲background-image属性,其他背景属性会在后续的文章综合总结. 一.最基本 ...
- background系列属性
1.background-color背景颜色属性 ①颜色表示方法 英语单词:red blue purple skyblue. rgb:r代表红色 g代表绿色 b代表蓝色 也 ...
- 前端CSS-font属性,超链接的美化,css精灵,background综合属性
前端CSS-font属性,超链接的美化,css精灵,background综合属性 1. font属性 使用font属性,能够将字号.行高.字体,能够一起设置. font:14px/24px " ...
- CSS探案之 background背景属性剖析
首先,我们先来看看两个css属性:background和background-color,对!就是这两位,相信大家在平时应该没少 麻烦人家把,反正我是这样,几乎也少会用到背景图,原因很简单:就是有点害 ...
- background的属性和背景图片定位的实例
本文内容: 1.背景图片定位示例 2.background常用的属性值 3.background-repeat新增的round.space属性 4.background-size的属性值(着重介绍co ...
- background相关属性
background-origin: 规定 background-position 属性相对于容器的哪一部分来定位. padding-box 背景图像相对于内边距框来定位:(默认) border-bo ...
- background——背景属性
一.背景属性 1.1.背景颜色background-color <style> /*浮动,横向排列*/ div{float: left;} /*background-color属性值支持三 ...
- css3的Background新属性
前言 CSS3中出现了几种关于背景图片的新属性:background-origin.background-clip.background-position等.之前大致了解了下,但是background ...
- css详解background八大属性及其含义
background(背景) 以前笔者在css盒模型以及如何计算盒子的宽度一文中提到过盒模型可以看成由 元素外边距(margin).元素边框(border).元素内边距(padding)和元素内容(c ...
随机推荐
- day01(计算机组成,进制,内存分布,操作系统)
本周内容: 第一天: 计算机原理 操作系统 第二天: 编程语言 python入门:环境 - 编辑器 变量 基本数据类型 学习方法: 鸡汤 - 干货 wwwh : what | why | where ...
- (haut oj 1261 ) 地狱飞龙 利用不定积分求值
题目链接:http://218.28.220.249:50015/JudgeOnline/problem.php?id=1261 题目描述 最近clover迷上了皇室战争,他抽到了一种地狱飞龙,很开心 ...
- Vue项目搭建与部署
Vue项目搭建与部署 一,介绍与需求 1.1,介绍 Vue 是一套用于构建用户界面的渐进式框架.与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用.Vue两大核心思想:组件化和数据驱动.组 ...
- jsp篇 之 Jsp中的内置对象和范围对象
Jsp中的内置对象: 在jsp页面代码中不需要声明,直接可以使用的对象. 一共有[9个内置对象]可以直接使用. 对象类型 名字 PageContext pageC ...
- centos7.5误删python2.7之后,导致yum和Pythonm命令无法使用
问题描述 最近想要将服务器上的Python2.7升级成3.x的版本时.使用了如下命令: (1)强制删除已安装python及其关联 # rpm -qa|grep python|xargs rpm -ev ...
- 机器学习---线性回归(Machine Learning Linear Regression)
线性回归是机器学习中最基础的模型,掌握了线性回归模型,有利于以后更容易地理解其它复杂的模型. 线性回归看似简单,但是其中包含了线性代数,微积分,概率等诸多方面的知识.让我们先从最简单的形式开始. 一元 ...
- Python Installing Jupyter
Jupyter说明jupyter notebook是一款网页版的Python编辑器组件,便于学习Python Jupyer安装yum -y install gcc gcc-c++ kernel-dev ...
- 学习Spring Boot:(十五)使用Lombok来优雅的编码
前言 Lombok 是一种 Java™ 实用工具,可用来帮助开发人员消除 Java 的冗长,尤其是对于简单的 Java 对象(POJO).它通过注解实现这一目的. 正文 添加依赖 在 pom.xml ...
- linux下sort命令详解大全
工作原理: Sort将文件的每一行作为一个单位,相互比较,比较原则是从首字符向后,依次按ASCII码值进行比较,最后将他们按升序输出. 第一部分: 1. sort:(不带参数) [rocrocket@ ...
- postgreSQL学习(二):pgsql的一些基础操作
在上一篇文章中我们学习了怎么安装pgsql,安装好了后,我们来学习一下怎么对pgsql进行创建操作以及相关的crud的操作啦 一 创建数据库 $ createdb test 然后你可能会遇到如下的错误 ...