Color:

　CSS中定义颜色使用十六进制（hex）表示法为红，绿，蓝的颜色值结合。可以是最低值是0（十六进制00）到最高值是

255（十六进制FF）。3个双位数字的十六进制值写法，以＃符号开始部分颜色表示。甚至还可以用颜色名称来直接表示一些

常见的颜色(yellow,pink,blue...)。

　　

　　部分颜色表示示例：

　　　　　　　

eg：

<html>

<head>

<meta charset="utf-8">

<title>color</title>

</head>

<body>

<p style="background-color:#FFFF00">

16进制表示

</p>

<p style="background-color:rgb(255,255,0)">

RGB表示

</p>

<p style="background-color:yellow">

颜色名称表示

</p>

结果显示：

　　

Unit：

　　CSS有几个不同的单位用于表示长度，其中较为常见的便是px和fr：

Px：

　　px 像素（Pixel）。相对长度单位。像素 px 是相对于显示器屏幕分辨率而言的。

eg：

 <!DOCTYPE html>

 <html>

 <head>

 <meta charset="utf-8">

 <title>px</title>

 <style>

     h1 {font-size: 50px;}

     h2 {font-size: 30px;}

 </style>

 </head>

 <body>

     <h1>标题1</h1>

     <h2>标题2</h2>

 </body>

 </html>

结果显示：

　　

fr：

　　fr 单位是一个自适应单位，fr单位被用于在一系列长度值中分配剩余空间，如果多个已指定了多个部分，则剩下的空间根据各自的数字按比例分配。

　　(通常用在布局上)

eg：

 <div id="grid">

     <div id="title">Site Logo</div>

     <div id="score">Slogan</div>

     <div id="stats">User Zone</div>

     <div id="message">Message</div>

 </div>
 #grid {

     display: grid;

     width: 100%;

     grid-template-columns: 100px 1fr max-content minmax(min-content, 1fr);

 }

 #title {

     background-color: lime;

 }

 #score {

     background-color: yellow;

 }

 #stats {

     background-color: lime;

 }

 #message {

     background-color: orange;

 }

 div {

     height: 80px;

     line-height: 80px;

     text-align: center;

 }

结果显示：

　　

　　　　

CSS : color and unit的更多相关文章

  1. jQuery .css color 重写 :hover样式没了

    $("#quickSqlDiv a").css({"color":"red"}); $("#course a").css ...

  2. jquery获取css color 值返回RGB

    css代码如下: a, a:link, a:visited { color:#4188FB; } a:active, a:focus, a:hover { color:#FFCC00; } js代码如 ...

  3. CSS COLOR

    CSS COLOR Color Review We've completed our extensive tour of the colors in CSS! Let's review the key ...

  4. jquery获取元素颜色css('color')的值返回RGB

    css代码如下: a, a:link, a:visited { color:#4188FB; } a:active, a:focus, a:hover { color:#FFCC00; } js代码如 ...

  5. CSS 文本字体颜色设置方法(CSS color)

    CSS 文本字体颜色设置方法(CSS color) 一.认识CSS 颜色(CSS color) 这里要介绍的是网页设置颜色包含有哪些:网页颜色规定规范. 1.常用颜色地方包含:字体颜色.超链接颜色.网 ...

  6. CSS Color Adjustment Module Level 1

    CSS Color Adjustment Module Level 1 https://drafts.csswg.org/css-color-adjust-1/ DarkMode 适配指南 | 微信开 ...

  7. css简单的一些基础知识

    css层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言.CSS不仅可 ...

  8. jquery源码09 (6058 , 6620) css() : 样式的操作

    var curCSS, iframe, // swappable if display is none or starts with table except "table", & ...

  9. CSS笔记

    初级篇===========================选择器============================元素选择器css:h1{color: red}html:<h1> ...

随机推荐

  1. bookmarks

    嵌入式/硬件/计算机原理 PCI ID的分配 ARM汇编指令介绍 (连续4篇) https://blog.csdn.net/makethyme/article/details/1641413https ...

  2. Shell脚本出现$'\r': command not found

    Centos7下执行shell脚本报错如下 [root@ip---- ~]# sh install_zabbix_agent.sh install_zabbix_agent.: $'\r': comm ...

  3. C#用反射实现两个类的对象之间相同属性的值的复制

    在进行实体转换操作的时候如果需要在对两个实体之间两个属性字段差不多相同的类要进行一个互相的转换,我们要把a对象的所有字段的值都复制给b对象,我们只能用b.属性=a.属性来写,如果属性字段太多的话,就要 ...

  4. 借助微软提供的url重写类库URLRewriter.dll（1.0）实现程序自动二级域名，域名需要泛解析

    二级域名和系统中会员帐号自动关联,也就是系统中注册一个会员,会员自动就可以通过二级域名来访问,比如我的帐号是zhangsan,我在morecoder.com注册后,访问zhangsan.morecod ...

  5. mysql 设置初始密码

    mysqladmin -uroot password "123" 设置初始密码 由于原密码为空,因此-p可以不用 mysqladmin -uroot -p"123&quo ...

  6. 爬虫-day02-抓取和分析

    ###页面抓取### 1.urllib3     是一个功能强大且好用的HTTP客户端,弥补了Python标准库中的不足     安装: pip install urllib3     使用: imp ...

  7. 去freessl.org申请免费ssl服务器证书

    去freessl.org申请免费ssl服务器证书 来源: 本文链接 来自osnosn的博客 写于: 2019-03-30. 想搞个自签名证书,可以参考这篇: 用openssl为WEB服务器生成证书(自 ...

  8. C++类的组合例子

    Line类调用Point类的两个对象p1,p2作为其数据成员,计算线段长度 组合类构造函数定义的一般形式为: 类名::类名(形参表):内嵌对象1(形参表),内嵌对象2(形参表)... {类的初始化} ...

  9. 如何启用小米手机5c的ROOT权限

    小米手机5c怎么样开通了root超级权限?大家都知道,android设备有root超级权限,一旦手机开通了root相关权限,能够实现更强大的功能,举个例子大家部门的营销部门的同事,使用某些营销应用都需 ...

  10. C# 操作redis

    下载 redis windows 版本 官网目前没有windows安装下载,下载地址为 https://github.com/MicrosoftArchive/redis/releases 直接点击安 ...