菜单

CSS权威指南读书笔记,WEB标准学习路程之

2020年1月26日 - 4166am金沙下载

颜色

用RGB指定颜色rgb(color)color是一个百分数或者整数的三元组表示

rgb(100%,100%,100%)或rgb(255,255,255)

如果值落在可取范围之外,都会剪裁到最接近的范围之内。

用十六进制RGB颜色–语法为#RRGGBB 两位代表一个颜色

如果两位完全相同可以缩写为一位,如#112233可写为#123

4166am金沙下载, 


长度单位

常用相对长度单位:

em
1em定义为一种给定字体的font-size值,如果一个元素的font-size值为14像素,那么对于该元素,1em等于14像素

ex定义为所用字体中小写x的高度,这种情况下如果使用24px的不同字体,其1ex的值通常可能也不同。

常用做法为取em的值,再取其一半作为ex的值 即假设1ex = 0.5em

!important

千一教程 从用出发

inherit

使一个属性的值与其父元素的值相同

如<div id=”toolbar”>

<a href=”11111″>queding</a>

</div>

#toolbar{background-color:blue;color:white}

#toolbar a{color:inherit}

为a指定继承,获得白色字体属性

语法:
sRule!important


 

前一节讲了样式表的具体应用,这一节,我们先停下来说一说样式属性值中的单位,一方面利于巩固前面的讲解,一方面更利于以后内容的理解。

说明:
sRules :  样式表条目 

在 CSS2
里规定了:长度、颜色、角度、时间、频率这几个方面的单位,但目前所有的浏览器都不支持角度、时间和频率,所以我们只讲解长度和颜色单位。

提升指定样式规则的应用优先权。

长度 长度单位分绝对长度单位、相对长度单位和百分数表示方法,绝对长度单位并不是一种好的表示方法,所以我们不推荐使用,也不作过多的介绍。请参见:

 

绝对长度单位
pt(point-点)、pc(pica-派卡)、in(inch-英寸)、cm(centimeter-厘米)、mm(millimeter-毫米)

示例:
div { color:red!important }

相对长度单位
em、ex、px
em
常用于字体,表示相对于父级样式或对象内文本的字体尺寸。不容易理解可以先跳过。
ex
常用于字体,表示相对于字符“x”的高度,此高度通常为字体尺寸的一半。不容易理解可以先跳过。
px 常用于字体和 HTML
对象(如:table、div),表示相对于显示器屏幕分辨率而言的像素,比如 table
{width:760px;},指定表格的宽度为 760 像素。

 

百分数表示
百分数表示字体或字体相关时意思是:当前字体大小为父级样式或对象指定的字体大小的百分之几。
百分数表示 HTML
对象的宽度和高度时意思是:当前对象相对父级对象指定的宽度和高度的百分之几。

单位

有这么一个等值公式,当然这个公式只是一个近似值:1em = 2ex = 100%
看如下例子,可以看到三个“中国人”字体近似一样大小,这样有助于您理解
em、ex了吧。

 

<html> <head> <meta http-equiv=”Content-Type”
content=”text/html; charset=gb2312″>
<title>em、ex、百分数</title> <style> body {
font-size:13px; } </style> </head> <body> <div
style=”font-size:2em”>中国人</div> <div
style=”font-size:4ex”>中国人</div> <div
style=”font-size:200%”>中国人</div> </body> </html>

长度

[Ctrl+A 全部选择 提示:你可先修改部分代码,再按运行]

长度单位

颜色
颜色有三种表示方法,我们推荐第二种表示方法,所以对于第一种和第三种表示方法,您只需要作了解,知道有这么一回事即可:

版本

1、rgb(R,G,B)
R : 红色值。正整数 或 百分数,正整数取值范围为:0-255,百分数取值范围为
:0.0%-100.0%。
G : 绿色值。正整数 或 百分数,正整数取值范围为:0-255,百分数取值范围为
:0.0%-100.0%。
B : 蓝色值。正整数 或 百分数,正整数取值范围为:0-255,百分数取值范围为
:0.0%-100.0%。
比如 div {rgb(255, 0, 0);} 表示 div 内文字颜色为 红色。
请注意,并不是所有的浏览器都支持用百分数表示。

兼容性

2、#RRGGBB
这种方法是我们推荐的,也是最通用的。
RR : 红色值。十六进制正整数,取值范围为:00-FF
GG : 绿色值。十六进制正整数,取值范围为:00-FF
BB : 蓝色值。十六进制正整数,取值范围为:00-FF
比如 div {color:#FF0000;} 表示 div 内文字颜色为 红色。
如果每个颜色值的两个数字都相同,那么也可以省略为一位,比如上述的红色也可以表示为
div{color:#F00;}。

简介

3、颜色名称
浏览器都预定有一些颜色名称,比如 div {color:red;} 表示 div 内文字颜色为
red(红色)。

相对长度单位  Relative Length Units

em


CSS1

IE4+ , NS4+

相对于当前对象内文本的字体尺寸

ex

CSS1

IE4+ , NS4+

相对于字符 “ x ” 的高度。通常为字体高度的一半

px

CSS1

IE3+ , NS4+

像素(Pixel)

绝对长度单位  Absolute Length Units

pt

CSS1

IE3+ , NS4+

点(Point)

pc

CSS1

IE3+ , NS4+

派卡(Pica)。相当于我国新四号铅字的尺寸

in

相关文章

发表评论

电子邮件地址不会被公开。 必填项已用*标注

网站地图xml地图