博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
背景颜色
阅读量:5222 次
发布时间:2019-06-14

本文共 1190 字,大约阅读时间需要 3 分钟。

1、背景颜色:background-color

 颜色拓展:

1.1RGBA

RGB是一种色彩标准,是由红(R)、绿(G)、蓝(B)的变化以及相互叠加来得到各式各样的

颜色。RGBA是在RGB的基础上增加了控制alpha透明度的参数。

语法:

colorrgba(R,G,B,A)以上RGB三个参数,正整数值的取值范围为:0 - 255。百分数值的取值范围为:0.0% - 100.0%。超出范围的数值将被截至其最接近的取值极限。并非所有浏览器都支持使用百分数值。A为透明度参数,取值在0~1之间,不可为负值。

例:

border-color:rgba(255 , 0 , 0 , .7);

border-color:rgba(255 , 0 , 0 , .7);

1.2、渐变色彩

CSS3 Gradient 分为线性渐变(linear)和径向渐变(radial)。由于不同的渲染引擎实现渐变的语法不同,这里我们只针对线性渐变的 W3C 标准语法来分析其用法,其余大家可以查阅相关资料。W3C 语法已经得到了 IE10+Firefox19.0+Chrome26.0+ Opera12.1+等浏览器的支持。

 

第一个参数省略时,默认为“180deg”,等同于“to bottom”

第二个和第三个参数,表示颜色的起始点和结束点,可以有多个颜色值。(颜色值后面可以追加百分比,表示这个颜色要占总背景颜色面积的百分比)

例子:

background-image:linear-gradient(to left, red 30%,blue);

2、背景图片:background-image : none | url ( url )

例:body { background-image:url(images/bg.gif);}

3、背景平铺方式:background-repeat : repeat (铺满/默认)no-repeat (不平铺,显示一个)repeat-x X轴水平平铺)repeat-y Y轴垂直平铺)

4、背景定位:background-position

5、背景样式缩写:background: 背景色  背景图片  背景平铺方式  背景定位

例:

body {

background-color:# EDEDED;

background-image:url(images/bg.png);

background-repeat:no-repeat;

background-position:50%  30px;

}

缩写后:body { background:#EDEDED url(images/bg.png) no-repeat 50% 30px;}

转载于:https://www.cnblogs.com/-wyc/p/10619962.html

你可能感兴趣的文章
3.shell编程-文件查找之find命令
查看>>
SQL语句使用时间和日期的函数
查看>>
SourceTree windows免注册免登陆使用方法
查看>>
Android Studio 快捷键和常用技巧汇总
查看>>
POJ 1195 Mobile phones(二维树状数组)
查看>>
团队报告
查看>>
GridView 72般绝技 (http://blog.csdn.net/21aspnet/)
查看>>
win7创建共享给windows和linux机器
查看>>
Window.open()方法参数详解
查看>>
Hadoop1 集群安装实验
查看>>
纯css打造凹进与突出效果
查看>>
服创大赛_中期老师可能会问的问题
查看>>
面向对象三大特性之多态与多态性
查看>>
java RE Validation常用
查看>>
GNU make使用(一)
查看>>
How to change MAC address in windows 7
查看>>
log4net的各种Appender配置示例
查看>>
Using ActiveX in IE
查看>>
php 日期计算 总结
查看>>
Docker 命令总结
查看>>