CSS第二课-字体和颜色样式

CSS第二课-字体和颜色样式

ID:36402733

大小:2.89 MB

页数:23页

时间:2019-05-09

CSS第二课-字体和颜色样式_第1页
CSS第二课-字体和颜色样式_第2页
CSS第二课-字体和颜色样式_第3页
CSS第二课-字体和颜色样式_第4页
CSS第二课-字体和颜色样式_第5页
资源描述:

《CSS第二课-字体和颜色样式》由会员上传分享,免费在线阅读,更多相关内容在教育资源-天天文库

1、字体和颜色样式教师:Tel:文本和字体用font-family属性定义网页中的字体body{ font-family:Verdana,Geneva,Arial,sans-serif; }用font-size属性控制字体大小body{font-size:14px;}用color属性给文本添加颜色body{color:silver;}用font-weight属性设置字体的粗细body{font-weith:bold;}文本和字体用text-decoration属性给文本添加划线body{text-decoration:underline;}每台电脑上可能有不同的字

2、体调整字体大小可以用像素定义字体大小,用像素定义字体大小,就是告诉浏览器字母的高是多少像素。在CSS中用一个数字紧跟“px”的方式定义像素,这表明font-size应该是14像素高。从顶部到底部有14像素。像素数字后必须紧跟px,中间不能有空格。这是在body规则中定义font-size的方法。调整字体大小与像素精确地规定字体大小不同,百分数用与别的字体大小的相对值来定义字体大小。这儿我们用像素定义body的字体大小,用百分数150%定义一号标题字。表明字体大小应该是另一个字体大小的150%。然而,另一个字体大小指哪个父元素呢?因为font-size是一个从父

3、元素继承下来的属性,定义字体大小为a%,是相对于父元素的。我们看一下它是如何工作的……调整字体大小还可以用“em”定义字体大小,它跟百分数一样,是另一种相对测量单位。不过用em不是指定百分数,而是指定比例因数。别把这跟em元素弄混了。假如用这种测量法定义

标题大小,

标题就会是父元素字体大小的1.2倍,在这个例子中是14px的1.2倍,大约等于17px。这表明字体大小应该按比例放大1.2倍。实际上是16.8,但大多数浏览器会四舍五入到17。这是1.2em指定的

。调整字体大小另外还有一种定义字体大小的方法:关键字。可以把字体大小定义为:xx-

4、small,x-small,small,medium,larger或者xx-larger。浏览器将这些关键字转换成默认的像素值。在大多数浏览器中,这部分会将body元素显示为12像素。这些是各种关键字互相比较的典型大小。每种尺寸都比前一种大20%,通常把small定义为12像素。需要注意的是,每个浏览器定义关键字的方式并不一定相同,如果用户需要也能自己定义。用哪种方法定义字体的大小呢?1、选择一种关键字(推荐small或medium)定义body字体大小,也就是网页默认字体大小。2、用em或百分数把别的字体大小指定为相对于body字体大小的字体尺寸(选em或百

5、分数都无所谓,效果是一样的)。例:body{font-size:small;}h1{font-size:150%;}h2{font-size:120%;}问题:在元素中定义字体大小,也就是定义了网页的默认字体大小,是吗?这是为什么?我喜欢用像素指定字体大小的方法,因为那样网页会精确地显示指定的字体大小。如果没有指定字体大小,就只能是默认字体大小吗?默认标题大小是多大?答:这取决于浏览器,一般说来:

是body字体大小的200%,

是150%,

是120%,

是100%,

是90%,
是60%。

6、比body字体小一些。如果指定body字体大小时不用关键字而用em或%,能行吗?Web颜色网页颜色是根据红色、绿色和蓝色三原色以一定比例组成来指定的。可以把每种颜色指定为从0-100%的一个数,然后混合起来就组成了一种颜色。例如,如果把红色100%,绿色100%和蓝色100%混合起来,就得到白色。这是把红、绿和蓝相混合,看一下中间就知道它们三者相混合是什么样了。Web颜色但是如果每种成分只有60%会得到什么结果呢?不够白是吗?换言之,得到的是灰色,因为我们只给屏幕加了相同数量的三种颜色,而没有足够的光。Web颜色把80%的红色和40%的绿色混合起来,就能得到你

7、想要的桔红色。注意如果某一种颜色没有加进去,它就不会影响另外两种颜色。桔红色是因为没有把蓝光加进红色和绿色中而形成的。红色80%绿色40%相混合就得到桔红色。在电脑屏幕上,如果加0%的蓝色,蓝色就对产生的颜色没有任何影响。Web颜色如果混合红色0%、绿色0%和蓝色0%,会得到什么结果?那意味着没给屏幕加任何光,所以得到提黑色。如何指定Web颜色?1、颜色名2、红、黄、蓝的相对百分比3、16进制代码用名字定义颜色CSS颜色名字不区分大小写,所以输入silver、Silver或SILVER都是一样的。这些是CSS中预先定义的17种颜色。例:body{backgro

8、und-color:silver;}书

当前文档最多预览五页,下载文档查看全文

此文档下载收益归作者所有

当前文档最多预览五页,下载文档查看全文
温馨提示:
1. 部分包含数学公式或PPT动画的文件,查看预览时可能会显示错乱或异常,文件下载后无此问题,请放心下载。
2. 本文档由用户上传,版权归属用户,天天文库负责整理代发布。如果您对本文档版权有争议请及时联系客服。
3. 下载前请仔细阅读文档内容,确认文档内容符合您的需求后进行下载,若出现内容与标题不符可向本站投诉处理。
4. 下载文档时可能由于网络波动等原因无法下载或下载错误,付费完成后未能成功下载的用户请联系客服处理。