背景颜色 {background-color:red}/*常用十六进制颜色#fff*/

图片 {background-image:url();} /*插入图片路径*/

重复 {background-repeat: no-repeat;}/*设置背景图片不重复*/

滚动 {background-attachment: fixed;}(固定) scroll;(滚动--默认的)

位置 {background-position ;}四种定位方式 

  1单词定位方式:left center right / top center bottom 可以理解为一个九宫格

left top top center right top
left center center center right center
left bottom bottom center right bottom

  2像素定位方式:background-position:10px 50px;  距离左边10像素,距离上边50像素 只有这一种离左离上的规则

  3百分比方式:background-position:10% 20%; 距离左边百分之十,距离上边百分之二十

  4混合方式:background-position:left 100px; 靠左 距离上边100px

简写方法 {background:#000 url(..) repeat fixed left top;} /*按照这个顺序先颜色 图片 平铺 定位 固定*/

css背景属性整理的更多相关文章

  1. CSS背景属性

    CSS背景属性 1.background-attachment 属性 scroll:默认值.背景图像会随着页面其余部分的滚动而移动. fixed:当页面的其余部分滚动时,背景图像不会移动. inher ...

  2. 你不知道的CSS背景—css背景属性全解

    CSS背景在网页设计中使用频率非常高,然而对于这个开发人员很熟悉的CSS属性,却隐藏着许多不为初级开发人员熟知的细节,这篇文章尝试扒开这层不为人知的面纱. 首先列举一下CSS中关于元素背景的所有属性并 ...

  3. CSS背景属性Background详解

    [转] 本文详解了CSS的背景属性Background,包括CSS3中新增的背景属性.如果你是个CSS初学者,还可以查看之前介绍的CSS浮动属性和CSS透明属性详解. CSS2 中有5个主要的背景(b ...

  4. CSS 背景属性

    background: 简写属性,作用是将背景属性置在一个声明中 background-attachment: 背景图像是否固定或者随着页面的其余部队滚动 background-color: 设置元素 ...

  5. CSS背景属性background

    background属性是所有背景属性的缩写: 以下是这些背景属性: background-color:背景颜色 你可以通过颜色名称(red/green/blue)来设置 也可以用十六进制(#fff/ ...

  6. [Web 前端] 011 css 背景属性

    1. 概览 参数 释义 background-color 背景颜色 background-image 背景图片 background-repeat 是否重复 background-position 定 ...

  7. css学习_css背景属性及其应用

    css背景属性及其应用 1.背景 2.背景简写 3.背景透明(css3) 4.背景缩放(css3) 5.多背景图片(css3) 6.凹凸文字效果

  8. CSS探案之 background背景属性剖析

    首先,我们先来看看两个css属性:background和background-color,对!就是这两位,相信大家在平时应该没少 麻烦人家把,反正我是这样,几乎也少会用到背景图,原因很简单:就是有点害 ...

  9. CSS的 背景属性

    ㈠背景色  background-color ⑴background-color 属性设置元素的背景颜色. ⑵元素背景的范围: background-color 属性为元素设置一种纯色.这种颜色会填充 ...

随机推荐

  1. iOS之SceneKit.h文件简介

    1.SceneKit简介 SceneKit(SK)是WWDC12推出的OS X平台的Cocos 3D渲染引擎框架.支持粒子效果,物理模拟,脚本事件,多程渲染,支持iOS平台.SceneKit整合了Co ...

  2. jedis3.1.0在weblogic(jdk1.6)中无法运行

    文章目录 错误 探索 总结 错误 在tomcat中运行是没有问题的,可是在weblogic中是不能够运行的,weblogic中的jdk客户要求是1.6的. 如果更换版本jedis2.9.0是没有问题的 ...

  3. vue之.native修饰符

    .native 修饰符就是用来注册元素的原生事件而不是组件自定义事件的 比如:自定义 Button.vue 组件 <template> <button type="butt ...

  4. Eclipse添加git插件及操作

    注册账号新建仓库 在Github已经注册成功自己的账号 新建一个仓库 创建成功后记住url: 安装Git插件 首先像安装Pydev一样 点击help的Install New Software 点击Ad ...

  5. <python基础>封装,继承,多态,重写,重载

    什么是封装? 所谓的面向对象就是将我们的程序模块化,对象化,把具体事物的特性属性和通过这些属性来实现一些动作的具体方法放到一个类里面,这就是封装.封装是我们所说的面相对象编程的特征之一.除此之外还有继 ...

  6. <Python基础>字符串的基本操作

    s = 'abCDeFg aBcDea' print(s.find('b')) #通过元素查找索引,找不到返回-1 print(s.index('b')) #通过元素查找索引,找不到报错(会报错,基本 ...

  7. scrapy运行的整个流程

    Spiders: 负责处理所有的response,从这里面分析提取数据,获取Item字段所需要的数据,并将需要跟进的URL提交给引擎,再次进入到Scheduler调度器中 Engine: 框架的核心, ...

  8. ps photoshop

    PS-前端切图教程(切jpg图和切png图) 参考线显示和隐藏:ctrol+h alt+v+e或者打开标尺然后从点击标尺就能拖拽出来,删除也是拖到标尺附近就删除 显示.隐藏标尺:ctrol+R 显示网 ...

  9. opensuse 通过composer安装drush工具

    由于笔者的opensuse已安装好composer,所以按照官方网站的文章 Installing/Upgrading Drush on Ubuntu,使用composer形式安装drush工具. co ...

  10. Invalid prop: type check failed for prop "maxlength". Expected Number, got String.

    1.项目中,使用element-ui的input表单的maxlength属性报错 2.使用场景:       <el-input v-model="fname"  maxle ...