等价颜色表

什么叫Web安全色

所谓的“web安全”颜色是指在256色计算机系统上总能避免抖动的颜色。

Web安全颜色可以表示为RGB值为20%和51(相应的十六进制值为33)的倍数。

如果使用RGB百分数,要让所有这3个分量都要么是0%,要么是一个能被20整数的数

同理,如果是使用0~255范围的RGB值,则各分量值要么是0要么是能被51整数的数。

如果是采用十六进制记法,,使用值00、33、66、99、CC和FF的三元组才是Web安全颜色。

绝对长度单位

有5种绝对长度单位。英寸(in)、厘米(cm)、毫米(mm)、点(pt)、派卡(pc)

英寸:美国尺子上的单位

厘米:全世界尺子上的单位。1in=2.54cm     1cm=0.394in

毫米:10mm=1cm      1in=25.4mm   1mm=0.0394in

点:点是一个标准的印刷度量单位    1英寸是72点(举例来说如果文本的首字母设置为12点,就相当于1英寸的1/6高)

派卡:1派卡相当于12点,6派卡等于1英寸

相对长度单位

相对单位:根据与其它事物的关系来度量,共有3种相对长度单位:em,ex,px

其中,em代表em-height 、ex代表x-height、px代表像素。

一个em定义为一种给定字体的font-size值。(举例说明:如果一个元素的font-size为14像素,那么对于该元素而言1em就等于14像素)

在设置字体大小的时候,em的值会相对于父元素的字体大小改变。

ex是指所用字体中小写x的高度,但这只是理论,一般的1ex=0.5em

之所以像素是相对长度,是因为显示器上的小色框是像素。在打印的时候,1px可能要使用96ppi参考像素。

em是最灵活的,因为它随字体大小缩放,所以元素和元素操作都能更为一致。

零散却很有用的css小知识

1、在CSS中,相对URL要相对于样式表本身,而不是相对于使用该样式表的HTML文档

2、使用background:url(图片路径),注意这里url和开始括号之间不能有空格,如果存在空格,整个声明都将无效,以至于被忽略。

3、inherit是所有属性共有的一个关键字,使一个属性的值与其父元素的值相同

<head>
<style type="text/css">
#toolbar {
background: blue;
color: white;
}
#toolbar a {
color: inherit; /*只有加上了这句话之后 a链接的颜色才为白色 否则就为默认浏览器设置的蓝色*/
}
</style>
</head>
<body>
<div id="toolbar">
<a href="'#">one</a>|
<a href="#">two</a>|
<a href="#">trhee</a>
</div>
</body>

CSS2单位

1、角度值:度(deg)、梯度(grad)、弧度(rad)  无论如何声明,这些值都会解释为0~360范围内的度数。如:-90deg=270deg

2、时间值:毫秒(ms)、秒(s)

3、频率值:赫兹(Hz)、兆兹(Mhz)   值后面的标签Hz或Mhz不区分大小写

CSS--值和单位的更多相关文章

  1. 过渡与动画 - steps调速函数&CSS值与单位之ch

    写在前面 上一篇中我们熟悉五种内置的缓动曲线和(三次)贝塞尔曲线,并且基于此完成了缓动效果. 但是如果我们想要实现逐帧动画,基于贝塞尔曲线的调速函数就显得有些无能为力了,因为我们并不需要帧与帧之间的过 ...

  2. Web前端新人笔记之CSS值和单位

    数字 颜色——命名颜色 在Css2.1中规范定义了17个颜色名.包括html4.0中定义的16个颜色及外加一个橙色: <h1 style="color=aqua">aq ...

  3. CSS样式设置语法全解,样式优先级、值和单位、字体、文本、块级元素,行内元素,替换元素、非替换元素、display、float、position、table、li、光标、边距边框、轮廓、颜色背景

    全栈工程师开发手册 (作者:栾鹏) 一个demo学会css css选择器全解 css操作语法全解 CSS样式设置语法全解: 样式优先级 1. !important标记的样式 > 内联样式(sty ...

  4. web(六)css的基本语法、取值与单位

    css语法包含如下部分: 选择器:用于选择需要添加样式的元素. 属性(property):样式的属性名称,例如color代表颜色. 取值与单位:属性对应的值以及单位. 语法规则:css的某些固定语法. ...

  5. html,CSS文字大小单位px、em、pt的关系换算

    html,CSS文字大小单位px.em.pt的关系换算 这里引用的是Jorux的“95%的中国网站需要重写CSS”的文章,题目有点吓人,但是确实是现在国内网页制作方面的一些缺陷.我一直也搞不清楚px与 ...

  6. CSS里的单位

    CSS中预设了16种颜色以及16种颜色的衍生色,这16种颜色是CSS规范推荐的.并且一些主流的浏览器都可以识别.例如以下表所看到的: 十六进制颜色是最经常使用的定义方式.它的基本格式为#RRGGBB, ...

  7. 一起来看看css中的单位

    一起来看看css中的单位 由于一直以来对于css中的百分比单位究竟是相对于谁的比例,这个问题不是很了解,所以就专门找资料看了一下. <div class="container w500 ...

  8. css中关于单位的一些问题

    Css中关于单位的一些问题 相对字体长度: Em:Em 是一个相对单位.起初排版度量时是基于当前字体大写字母”M”的尺寸的.当改变font-family时,它的尺寸不会发生改变,但在改变font-si ...

  9. CSS文字大小单位px、em、pt详解

    这里引用的是Jorux的“95%的中国网站需要重写CSS”的文章,题目有点吓人,但是确实是现在国内网页制作方面的一些缺陷.我一直也搞不清楚px与em之间的关系和特点,看过以后确实收获很大.平时都是用p ...

  10. JS获取元素CSS值的各种方法分析

    先来看一个实例:如何获取一个没有设置大小的字体? <!DOCTYPE html> <html lang="en"> <head> <met ...

随机推荐

  1. SqlServer中——查找杀死阻塞进程

    查找阻塞进程: SELECT blocking_session_id '阻塞进程的ID', wait_duration_ms '等待时间(毫秒)', session_id '(会话ID)' FROM ...

  2. 【前端积累】createElement createTextNode

    <!DOCTYPE html> <html><!--树根--> <head> <meta charset="utf-8"> ...

  3. 42-stat 显示文件的信息

    显示文件的信息 stat [options] [file-list] 参数 file-list指定stat所显示的一个或多个文件的路径名 选项 -f                     显示文件系 ...

  4. Beta版本冲刺Day6

    会议讨论: 628:配置Mysql的时候遇到了问题,在修改数据库用户密码时无法修改,并且服务器好像连接不上去了,其他组员则继续他们的任务.601:将一些原来的界面进行了修改,修改成了更加美观的外形. ...

  5. 【BZOJ 2118】墨墨的等式

    http://www.lydsy.com/JudgeOnline/problem.php?id=2118 最短路就是为了找到最小的$x$满足$x=k×a_{min}+d,0≤d<a_{min}$ ...

  6. Unable to find element on closed window (WARNING: The server did not provide any stacktrace information)

    当你的selenium WebDriver 启动IE11报这个错时:Unable to find element on closed window (WARNING: The server did n ...

  7. js学习笔记2---HTML属性操作

    1.HTML属性操作:读.写 属性名 属性值   2.属性读操作:获取.找到 a) 语法:元素.属性名 如:document.getElementById(“btn”).value; b) 字符串的连 ...

  8. Mybatis 高级结果映射 ResultMap Association Collection

    在阅读本文章时,先说几个mybatis中容易混淆的地方: 1. mybatis中的列不是数据库里的列而是查询里的列,可以是别名(如 select user_name as userName,这时col ...

  9. 1.Android常见异常:android.view.WindowLeaked 分析以及解决办法

    在项目中遇到WindowManager: Activity  has leaked window问题,其实在stackoverflow.com可以找到详细答案:http://stackoverflow ...

  10. Java之设计模式详解 (转)

    转载:http://blog.csdn.net/zhangerqing/article/details/8194653 设计模式(Design Patterns) ——可复用面向对象软件的基础 设计模 ...