<!DOCTYPE html>

 <html>

 <head>

     <meta charset="utf-8">

     <title></title>

     <!-- <link rel="stylesheet" type="text/css" href="style.css"> -->

     <style type="text/css">

         body{background: url(img/花1.jpg);}

         div{width: 100%;height: 50px}

         #div1{background: #0f0}

         #div2{background: rgb(255,0,0);}

         #div3{background: rgb(0%,0%,100%);}

         #div4{background: rgba(255,0,0,0.5);}

         #div5{background: hsla(120,50%,50%,1);}

     </style>

     <!--16进制表示颜色时两两相同时可只写一位-->

     <!--HSL模式：H表示色调(0或360表示红色，120表示绿色，240表示蓝色，取值范围0-360)；S表示饱和度，取值范围0.0%-100.0%；L表示亮度，取值范围0.0%-100.0%；

     HSLA在HSL模式上加了Alpha透明度，类似RGB和RBGA-->

 </head>

 <body>

     <div id="div1"></div>

     <div id="div2"></div>

     <div id="div3"></div>

     <div id="div4"></div>

     <div id="div5"></div>

 </body>

 </html>

【CSS3】颜色表示方式的更多相关文章

  1. CSS3 新增颜色表示方式

    一.CSS1&2颜色表示方式(W3C标准) 1.Color name  颜色名称方式(用颜色关键字表示对应的颜色.) 例如:red(红色).blue(蓝色).pink(粉色) 优点:方便快捷而 ...

  2. html5--6-14 CSS3中的颜色表示方式

    html5--6-14 CSS3中的颜色表示方式 实例 每个参数 (red.green 以及 blue) 定义颜色的强度,可以是介于 0 与 255 之间的整数,或者是百分比值(从 0% 到 100% ...

  3. html5--6-13 CSS3中的颜色表示方式

    html5--6-13 CSS3中的颜色表示方式 学习要点 掌握选择器的优先级问题 掌握CSS3中新增的颜色表示方式 选择器的优先级问题 原则上:元素选择器<类选择器< ID选择器< ...

  4. css3种引入方式,样式与长度颜色,常用样式,css选择器

    # CSS三种引入方式 ## 一.三种方式的书写规范 #### 1.行间式 ```html<div style="width: 100px; height: 100px; backgr ...

  5. 熟悉css/css3颜色属性

    颜色属性无处不在.字体要用颜色,背景可以有颜色,粒子特效更是离不开颜色.本文参考了一些资料简单总结下以备日后查阅. css中颜色的定义方式: 十六进制色 RGB & RGBA HSL & ...

  6. CSS3颜色特征温故

    网页是色彩的表现原理:显示器是由一个个像素构成,利用电子束来表现色彩.像素把光的三原色:红色(R).绿色(G).蓝色(B)组合成的色彩按照科学原理表现出来.一个像素包含8位元色彩的信息量,又从0 ~ ...

  7. css3 颜色记

    css3 颜色 opacity 使元素呈现出半透明效果. opacity:alphavalue || inherit alphavalue:默认值为1,可以取0~1任意浮点数.取值为1时,元素完全不透 ...

  8. HTML5+CSS3常见布局方式

    1.等高布局 1.1 代码 等高布局是指子元素在父元素中高度相等的布局方式 <div class="father"> <div class="f1&qu ...

  9. Android中设置控件的背景颜色的方式整理

    版权声明:本文为博主原创文章,未经博主允许不得转载. 前言 在Android开发中,经常需要设置控件的背景颜色或者图片的src颜色. 效果图 代码分析 根据使用的方法不同,划分为 setBackgro ...

随机推荐

  1. django作业练习

    ---权限管理系统 要求: 1,登陆: a,装饰器判断用户是否已经登陆 b,用户密码使用md5发送 2,注册 a,检测用户是否已经存在,onblur+ajax光标跳出输入框时(使用ajax) 3,注销 ...

  2. php将html转为图片

    在服务器端解析将编译好的html转换为图片. 由于html一般由客户端浏览器解析,服务器端不能直接解析html代码.所以我们需要借助php类库及扩展完成这一需求. 文件转换过程为 html -> ...

  3. 那些年我们写js烦的不疼不痒的错误

    1.Js 字符变量不加双/单引号. 列如:var strJsonInfo = '@Html.Raw(ViewBag.JsonInfo)'; 2.js 对象初始化器,最后一个属性值加逗号. 例如:var ...

  4. 深入浅出多线程——ReentrantLock (一)

    ReentrantLock是一个排它重入锁,与synchronized关键字语意类似,但比其功能更为强大.该类位于java.util.concurrent.locks包下,是Lock接口的实现类.基本 ...

  5. 大数据基础篇(一)：联机分析处理(OLAP) 与 联机事务处理(OLTP)

    联机事务处理(OLTP) OLTP也称实时系统(Real Time System),支持事务快速响应和大并发,这类系统典型的有ATM机(Automated Teller Machine)系统.自动售票 ...

  6. wamp环境下如何安装redis扩展

    Redis安装 wamp环境安装redis扩展 首先在自己本地项目中phpinfo(); 查看php版本; (php版本是5.5, ts-vcll表示MSVC11 (Visual C++ 2012), ...

  7. Office 365系列 （1）概览：完整的云中Office

    Office365(以下简称O365)是一个集Office,企业邮箱,日历,日程管理,音视频会议 ,企业网盘 ,企业协作平台为一体的,旨在提高团队办公效率,减少基础设施投资和IT运维压力的解决方案.在 ...

  8. 【转】Python微信好友头像拼接图

    转自:Python微信好友头像拼接图 今天在朋友圈看到有人发了微信好友拼接图,心里满是新奇,看了下评论才知道用Python写的.心里痒痒,立马就安装了下Python. 安装好了之后,看了下大神的代码, ...

  9. rabbitmq(中间消息代理)在python中的使用

    在之前的有关线程,进程的博客中,我们介绍了它们各自在同一个程序中的通信方法.但是不同程序,甚至不同编程语言所写的应用软件之间的通信,以前所介绍的线程.进程队列便不再适用了:此种情况便只能使用socke ...

  10. 将DLL文件直接封装进exe执行文件中（C#）

    前言:由于项目需要,需制作一个注册机,将个人PC的MAC值和硬盘序列号与软件进行绑定,由于笔者的C++不是很好,所以采用C#进行开发.但在采用C#的时候,获取硬盘的MAC值和序列号的时候又不是很准确, ...