HTML&CSS基础-颜色的单位表示方法

　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　作者：尹正杰

版权声明：原创作品，谢绝转载！否则将追究法律责任。

一.HTML源代码

<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title>颜色的单位表示方法</title>

        <style type="text/css">

            /**

             *     颜色单位:

             *         在CSS可以直接使用颜色的单词来表示不同的颜色，如:

             *             红色:red

             *             蓝色:blue

             *             绿色:green

             *             黄色:yellow

             *             深粉红色:deeppink

             *             ......

             *

             *         也可以使用RGB值来表示不同的颜色:

             *             所谓的RGB值指的是通过Red，Green，Blue三元色，通过这三种颜色的不同的浓度，来表示出不同的颜色。

             *             语法:

             *                 rgb(红色的浓度，绿色的浓度，蓝色的浓度);

             *                     颜色的浓度需要一个0-255之间的值，255表示最大，0表示没有。

             *                     浓度也可以采用一个百分数来表述，需要一个0%-100%之间的数字，使用百分数最终也会转换为0-255这之间的数，0%表示0，100%表示255.

             *

             *         也可以使用十六进制的rgb值来表示颜色:

             *             原理和上边的RGB原理一样，只不过使用十六进制数来代替，使用三组两位的十六进制数组来表示一个颜色，每一组表示一个颜色:

             *                 第一组表示红色的浓度，范围00-ff

             *                 第二组表示绿色的浓度，范围00-ff

             *                 第三组表示蓝色的浓度，范围00-ff

             *

             *             语法:

             *                 #红色绿色蓝色

             *                     00表示没有，相当于rgb中的0

             *                     ff表示最大，相当于rgb中的255

             *                 红色:

             *                     #ff0000,像这样两位两位重复的颜色可以简写为f00

             *                 绿色:

             *                     #00ff00,像这样两位两位重复的颜色可以简写为0f0

             *                 蓝色:

             *                     #0000ff，像这样两位两位重复的颜色可以简写为00f

             *

             *                 注意:

             *                     上面可以简写是因为两位两位重复的颜色，类似于"aabbcd"这样的就没法简写，因为最后一组并不重复哟~

             */

            .hello {

                width: 200px;

                height: 200px;

                background-color: rgb(172, 30, 1);

            }

            .world {

                width: 200px;

                height: 200px;

                background-color: rgb(100%, 100%, 50%);

            }

            .good{

                width: 200px;

                height: 200px;

                background-color: #abc;

            }

        </style>

    </head>

    <body>

        <div class="hello"></div>

        <div class="world"></div>

        <div class="good"></div>

    </body>

</html>

二.浏览器打开以上代码渲染结果

 

数据库入门理论知识介绍以及编译安装MySql的更多相关文章

  1. ElasticSearch实战系列四: ElasticSearch理论知识介绍

    前言 在前几篇关于ElasticSearch的文章中,简单的讲了下有关ElasticSearch的一些使用,这篇文章讲一下有关 ElasticSearch的一些理论知识以及自己的一些见解. 虽然本人是 ...

  2. 源码编译安装 MySQL 5.5.x 实践

    1.安装cmakeMySQL从5.5版本开始,通过./configure进行编译配置方式已经被取消,取而代之的是cmake工具.因此,我们首先要在系统中源码编译安装cmake工具. # wget ht ...

  3. CentOS 编译安装 mysql

    1.前期准备 1.1 环境说明: 操作系统: CentOS release 6.4 (Final) [查看命令 cat /etc/redhat-release ] mysql : mysql-5.6. ...

  4. Linux CentOS6.5下编译安装MySQL 5.6.16【给力详细教程】

    一.编译安装MySQL前的准备工作 安装编译源码所需的工具和库 yum install gcc gcc-c++ ncurses-devel perl 安装cmake,从http://www.cmake ...

  5. Linux编译安装Mysql步骤

    一. Centos 用 wget 下载需要的软件,保存到目录/home/zwl/MySql/下 wget http://dev.mysql.com/get/Downloads/MySQL-5.5/my ...

  6. CentOS下编译安装MySQL 5.6.21

    一.编译安装MySQL前的准备工作 安装编译源码所需的工具和库 yum install gcc gcc-c++ ncurses-devel perl 安装cmake:http://www.cnblog ...

  7. 源码编译安装 MySQL 5.5.x 实践(转)

    1.安装cmakeMySQL从5.5版本开始,通过./configure进行编译配置方式已经被取消,取而代之的是cmake工具.因此,我们首先要在系统中源码编译安装cmake工具. # wget ht ...

  8. Linux 环境编译安装mysql (源码安装包)

    标注: Linux需要先配置网络yum源,确定yum能在线安装软件包,方便测试过程中安装部分依赖包.配置163网易提示的网络yum源参考博客  http://www.cnblogs.com/zoulo ...

  9. Linux(CentOS6.5)下编译安装MySQL Community Server 5.7.12

      组件 官方网站 直接下载地址 备注 mysql http://dev.mysql.com/downloads/mysql/ http://mirrors.sohu.com/mysql/MySQL- ...

随机推荐

  1. 美团外卖app可行性分析

    美团外卖app可行性分析 1 引言 1.1编写目的 年轻人追求时尚,快捷,因此外卖行业拥有广阔的消费群体:团购的兴起,也促进了人们的消费欲望,人们继续一个外卖平台,来满足他们的欲望.O2o模式的日渐完 ...

  2. Python 中的字符串（str）、字典（dict）详解及操作方法

    一.字符串 在python中字符串是一种重要数据类型.其他数据类型分别为: 数字-number -------- int.long.float.complex这几种 字符串-string ------ ...

  3. Golang 函数

    创建函数 package main import "fmt" //有参数,有返回值 func demo(a int, s string) (int, string) { retur ...

  4. Maven-Build Lifecycle（构建生命周期）

    https://maven.apache.org/guides/introduction/introduction-to-the-lifecycle.html https://www.w3cschoo ...

  5. JS创建事件的三种方式（实例）

    1.普通的定义方式 <input type="button" name="Button" value="确定" onclick=&qu ...

  6. 流程控制之if判断，while循环，for循环

    if判断? 什么是if判断? 判断一个条件如果成立则做...不成立则... 为什么要有判断? 让计算机像人一样具备判断的能力 如何用if判断 if 条件1: code1    code2    cod ...

  7. python数据相关性分析 （计算相关系数）

    #-*- coding: utf-8 -*- #餐饮销量数据相关性分析 计算相关系数 from __future__ import print_function import pandas as pd ...

  8. ubuntu 环境 celery配置全解

    继续尝试没有时间弄明白的技术. celery官方文档地址:http://docs.celeryproject.org/en/stable/getting-started/introduction.ht ...

  9. Performance testing test scenarios

    1 check if page load time is within acceptable range2 check page load on slow connections 3 check re ...

  10. jmeter简单录制脚本

    1 创建HTTP请求默认值. --添加线程组:右击"测试计划"→添加→Threads(Users)→线程组,建议重命名线程组增强可读性. --添加HTTH请求默认值:右击" ...