CSS 背景颜色

时间:2022-05-23 02:12:18

颜色背景

CSS中背景颜色由background-color决定,这里的背景颜色会渲染padding和content,不会渲染border和margin部分。

在css3中可以通过background-clip来定义颜色的渲染区域:取值为content-box(仅渲染content部分),padding-box(渲染content和padding部分)和border-box(渲染content、padding);

测试过程发现padding-box和border-box渲染效果一样,不知为何有这两个值?望回帖告知,如何测试这两个值区别。

图片背景

css中通过指定background-image:url(image)来使用图片作为背景。

css3中可以使用backgound-size指定背景图片的大小,例如:background-size: 200px 300px,

  还可以通过background-clip来指定背景图片区域,取值为content-box(仅渲染content部分),padding-box(渲染content和padding部分)和border-box(渲染content、padding);

  还可以使用background-origin来指定背景图片的定位区域,取值为content-box(根据content定位),padding-box(根据padding定位)和border-box(根据border定位)

CSS 背景颜色的更多相关文章

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

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

  2. 利用CSS背景颜色属性使父级div背景透明同时避免子级标签透明。

    实现背景色透明效果的代码 实现各个浏览器中具备良好的透明特性的效果,IE中使用私有滤镜filter,高端浏览器使用CSS3中的rgba属性. 输入十六进制的颜色值以及透明度,自动在IE的过渡滤镜以及C ...

  3. css背景颜色、背景图片,以及列表的多种样式

    背景样式 • background-color 设置元素的背景颜色.• background-image 把图像设置为背景.• background-position 设置背景图像的起始位置.• ba ...

  4. 一个CSS背景颜色问题

    div{ background: rgba(0,0,0,.1);     background-color: #19FFFFFF; } 安卓下会显示上面的透明颜色,而在iOS上则显示下面的颜色,并且其 ...

  5. css背景颜色渐变

    1.效果 2.代码 /* 基本色 */ background: #3FB0AC; /* chrome 2+, safari 4+; multiple color stops */ background ...

  6. CSS背景颜色透明

    { filter:alpha(opacity=50); -moz-opacity:0.5; -khtml-opacity: 0.5; opacity: 0.5; } 兼容大部分主流浏览器 filter ...

  7. CSS 背景-CSS background

    这里有个很好的样式学习网站:http://www.divcss5.com/rumen/r125.shtml 一.Css background背景语法   -   TOP CSS背景基础知识 CSS 背 ...

  8. CSS背景background图片

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

  9. CSS 背景background实例

    css背景background用于设置html标签元素的背景颜色.背景图片已经其他背景属性.本文章向码农介绍CSS 背景background使用方法和基本的使用实例.需要的码农可以参考一下. 一.Cs ...

随机推荐

  1. Windows下安装python2和python3双版本

    现在大家常用的桌面操作系统有:Windows.Mac OS.ubuntu,其中Mac OS 和 ubuntu上都会自带python.这里我们只介绍下Windows(我用的Win10)环境下的pytho ...

  2. 客户端cmd打开mysql,执行插入中文报错或插入中文乱码解决方案

    最近在制作一个安装包,需要安装的时候执行mysql脚本儿,做了一个批处理,但是发现总是执行到 插入中文的时候报错,或者插入中文是乱码. 网上查了好多资料,说是把编码改成GBK什么的,终究还是不成功. ...

  3. PHP中的function函数详解

    PHP函数,在PHP中函数起到一个不可分割的重要部分,很多功能实现都要用到函数,PHP的最大的威力就来源于函数! 在PHP中内建函数至少有上千个函数.这些内建函数了解就行了,官方文档里面有函数大全:传 ...

  4. 沧海一声笑,移动应用的CRASH原因我找到! --记最新款数字化測试“星云測试“的使用攻略

    沧海一声笑,移动应用的CRASH原因我找到! --记最新款数字化測试"星云測试"的使用攻略 世界进步那么快,非常多新奇的点子层出不穷,于是我们创业.我们做最酷的手机应用,做最轰炸的 ...

  5. 【转】高效利用Fundebug追踪Node.js日志发现问题

    不管使用哪个语言做项目开发,我们都会自觉地用日志来做相关记录.比如,HTTP请求,报错信息.某些关键节点埋点记录等等.在Java中有大名鼎鼎的Log4J,于是在Node.js中也有了log4js. 日 ...

  6. HTML5原生拖拽/拖放(drag & drop)详解

    前言 拖放(drap && drop)在我们平时的工作中,经常遇到.它表示:抓取对象以后拖放到另一个位置.目前,它是HTML5标准的一部分.我从几个方面学习并实践这个功能. 拖放的流程 ...

  7. JAVA自学笔记25

    JAVA自学笔记25 1.GUI 1)图形用户接口,以图形的方式,来显示计算机操作的界面,更方便更直观 2)CLI 命令行用户接口,就是常见的Dos,操作不直观 3) 类Dimension 类内封装单 ...

  8. 爬虫--Scrapy-持久化存储操作

    总体概况 持久化存储操作: a. 磁盘文件 a) 基于终端指令 i. 保证parse方法返回一个可迭代类型的对象(存储解析到的页面内容) ii. 使用终端指令完成数据存储到制定磁盘文件中的操作 1. ...

  9. 获取tensorflow中tensor的值

    tensorflow中的tensor值的获取: import tensorflow as tf #定义变量a a=tf.Variable([[[1,2,3],[4,5,6]],[[7,8,9],[10 ...

  10. 【BZOJ2563】阿狸和桃子的游戏(贪心)

    [BZOJ2563]阿狸和桃子的游戏(贪心) 题面 BZOJ 题解 边权平均分给两个点就好了. #include<iostream> #include<cstdio> #inc ...