当前位置: 网站建设 > 网页设计 > 建站经验 >

CSS字体:详解font属性

时间:2013-03-02 03:44来源:未知 作者:admin 点击:

标签:CSS字体:详解font属性 字体(24)属性(68)font-style(1)详解(47)属(4)CSS(655)font(3)
font-style属性最常用于规定斜体文本,它的三个值:normal(正常显示)、italic(斜体显示)和oblique(倾斜显示)。 在CSS中,有两种不同类型的字体系列名称: 通用字体系列 领有类似外观的字体体系组合(比方 Serif 或 Monospace) 特定字体系列 详细的字体系列
CSS字体:详解font属性》文章地址:http://www.tfxk.com/wangyesheji/jianzhanjingyan/0302333252013.htm

font-style属性最常用于规定斜体文本,它的三个值:normal(正常显示)、italic(斜体显示)和oblique(倾斜显示)。

在CSS中,有两种不同类型的字体系列名称:
通用字体系列 – 领有类似外观的字体体系组合(比方 “Serif” 或 “Monospace”)
特定字体系列 – 详细的字体系列(好比 “Times” 或 “Courier”)

注意:如果简写了元素的font属性,而且元素另外还有line-height属性(行高)须要申明的话,line-height属性必定要书写在简写的font属性之后,否则会导致line-height声明无效。

字体加粗

body {font-size:100%;} //为 body 元素(父元素)以百分比设置默认的font-size值
h1 {font-size:3.75em;}
p {font-size:0.875em;}

CSS字体 font属性很主要 ,css字体设置(不同浏览器设置效果),他可以用来掌握文本的显示,它可以定义文本的字体、大小、加粗、风格(如斜体)和变形(小型大写字母),CSS如何自定义滚动条样式。本文我们就来具体讲授下font属性。

字体大小

字体系列

注意:100~900为字体指定了9级加粗度,CSS如何控制标题字符多余部分用…省略号表示。如果一个字体内置了这些加粗级别,那么这些数字就直接映射到预约义的级别,100对应最细的字体变形,900对应最粗的字体变形。数字400等价于 normal,而700等价于 bold。

Tag:CSS   字体   font属性  ,CSS外部引用使用link与import的区别; CSS   字体   font属性  

body {font-family: sans-serif;}  //这样用户代办就会从 sans-serif 字系统列中抉择一个字体(如 Helvetica),并将其利用到 body 元素。由于有继续,这种字体取舍还将运用到body中包括的所有元素,除非有一种更特定的挑选器将其笼罩。
div {font-family: Georgia;} //指定一种字体。
div {font-family: Georgia,serif;} //指定多种字体或字体系列。
div {font-family: Georgia,serif,'New Century Schoolbook';} //当字体名中有一个或多个空格(比如 New York),或者如果字体名包含#或$之类的符号,我们需要在font-family声明中加引号。

除了各种特定的字体系列外,CSS 定义了 5 种通用字体系列:Serif、Sans-serif、Monospace、Cursive跟Fantasy。

绝对值的优毛病:将文本设置为指定的大小、不许可用户在所有浏览器中转变文本大小(不利于可用性)、绝对大小在断定了输出的物理尺寸时很有用。
相对值的优缺陷:相对四周的元素来设置大小、答应用户在浏览器改变文本大小。

font-family属性定义元素中文本的字体制列或详细的一种字体,CSS备忘录

在font属性把持的5项中,字体系列、大小、加粗使用频繁,必需控制。对中文页面来说,小型大写字母并不常用。

div {font-variant:small-caps;} //small-caps属性值设定元素中文本以“小型大写字母&rdquo,CSS基础:设置文本的背景颜色;显示

与css background属性一样,font属性也有本人的简写方法。
书写次序为:字体风格、字体变形、字体加粗、字体大小/行高、字体系列。

font-variant属性设定小型大写字母显示文本,即所有的小写字母均会被转换为大写,然而所有使用小型大写字体的字母与其余文原形比,其字体尺寸更小。它的默认值是normal(畸形显示),CSS基础:了解闭合浮动元素

注意:在font-family属性中声明多个字体时,浏览器会从左至右查找这些字体,CSs基础:CSS的位置问题。如果系统中存在该字体就予以显示,css基础自动定位的应用,如果不存在则持续查找下一个。如果所有指定的字体或字体系列都没有,则会以系统或浏览器默认字体显示。

font属性简写

--> [网站建设之]CSS字体:详解font属性

div#blog54173 {font:italic small-caps bold 12px/20px "SimHei";} //斜体、小型大写字母、加粗、12像素大小/20像素行高、黑体

上面的代码联合应用了百分百和EM,在所有浏览器中,能够显示雷同的文本大小,css基础实例只显示下划线的文本框,并容许所有浏览器缩放文本的大小。

留神:假如你不划定字体大小,个别阅读器中一般文本(如段落)的默认大小是16像素(1em=16px)。
使用以像素为单位的绝对值有利于咱们准确节制文本字体大小,但是在IE中无奈缩放文本大小(绝对值的劣势)。

字体变形

字体作风

font-weight属性设置文本的粗细水平,值可以是bold(加粗)、normal(正常)、100~900(值越大文字越粗)。

div {font-style:italic;} //元素中的文本斜体显示

p {font-weight:normal;} //正常
strong {font-weight:bold;} //加粗显示,相称于数值700
div {font-weight:900;} //加粗显示

font-size属性设置文本的大小,值可以是绝对值(12px)或相对值(1em、100%)。

注意:通常情形下,italic 和 oblique 文本在 web 浏览器中看上去完整一样。斜体(italic)是一种简略的字体风格,对每个字母的构造有一些小修改,来反应变更的外观。与此不同,倾斜(oblique)文本则是正常竖直文本的一个倾斜版本。

div {font-size:18px;} //相对值
div {font-size:1.2em;} //绝对值

font属性存在较强的继承性,如对body设定的font-family、font-size等,都会应用到body包含的所有元素。


(责任编辑:网站建设)
CSS字体:详解font属性相关文章
上一篇:css字体设置(不同浏览器设置效果) 下一篇:CSS学习教程 学习CSS的宽度width
回到顶部