<!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. window下安装Apache+PHP

    本地系统为windows 10,Apache选择httpd-2.4.25-x64-vc14-r1,PHP选择php7.1_x64线程安全版. 1.安装Apache 将apache解压到c:/serve ...

  2. vue 组件中数组的更新

    今天写项目时遇到的问题,瞬间就卡在那了 来还原一下: parent.vue: <template> <div> <button @click="change&q ...

  3. 记录项目版本升级angular4 ~ angular5

    前言: 在上一篇ng4文章<angular4--实际项目搭建总结>中说过,等到ng5正式发布,并且蚂蚁的NG ZORRO兼容ng5之后,我会对ng4项目进行升级.这篇文章就是大概说下升级的 ...

  4. Unity20172.0 Android平台打包

    Android SDK及Jdk百度网盘下载链接:https://pan.baidu.com/s/1dFbEmdz 密码:pt7b Unity20172.0 Android平台打包 简介说明: 第一步: ...

  5. VMware下设置Centos7联网与固定IP连接Xshell

    爱折腾的小伙伴应该经常会用Vmware安装一些虚拟机用于学习,但是比如装了Linux,经常操作的时候非常切换窗口的时候非常麻烦,所以很多人都会选择用Xshell来连接本地的Linux虚拟机,但是用Xs ...

  6. python并发编程之多进程二

    一,multiprocessing模块介绍 python中的多线程无法利用多核优势,如果想要充分地使用多核CPU的资源(os.cpu_count()查看),在python中大部分情况需要使用多进程.P ...

  7. 网页设计——2. html入门

    开始正式的课程讲解了,首先来看看课程体系: Java EE(java 企业应用程序版本) java2 有三个版本:J2 SE(标准版),J2 EE(企业版).J2 ME(微缩版). 我们要掌握J2EE ...

  8. TensorFlow MNIST（手写识别 softmax）实例运行

    TensorFlow MNIST(手写识别 softmax)实例运行 首先要有编译环境,并且已经正确的编译安装,关于环境配置参考:http://www.cnblogs.com/dyufei/p/802 ...

  9. BigDecimal工具类处理精度计算

    /** * Created by My_coder on 2017-07-27. * 加减乘除计算工具类 */ public class BigDecimalUtil { private BigDec ...

  10. Git~GitLab当它是一个CI工具时

    CI我们都知道,它是持续集成的意思,主要可以自动处理包括编译,测试,发布等一系列的过程,而GitLab也同样包含了这些功能,我们可以通过pipeline很容易的实现一个软件从编译,测试,发布的自动化过 ...