CSS应用基础教程:文字性质

  本 章 C S S 的 主 要 作 用

  本章要介绍的是文字相关的CSS指令。通 常一个网站的内容最多的就是文字了,透过这些文字相关的CSS指令,您可以将您的 网页内容排版得美美的。本章将分两个部份为您介绍,第一部份是字型性质的CSS指 令,用以控制文字字型的各种样式;第二部份介绍的是文字性质的CSS指令,用以控 制文字段落的外观及摆设方式。

  字 型 性 质 的 C S S 指 令

  font-family 设定文字字型

  支 持:IE3、IE4

  适 用:所有元素

  可能值: 字型名称

  预设值:视浏览器而定

  继承性:有

  一般范例:SPAN { family-name : "标楷体" }

  同轴范例:<SPAN style="family-name:标楷体">

  font-style 设定字体样式

  支 持:IE3、IE4、NC4

  适 用:所有元素

  可能值: normal 普通字

  italic 斜体字

  oblique 斜体字

  预设值:normal

  继承性:有

  一般范例:SPAN { font-style : italic }

  同轴范例:<SPAN style="font-style:italic">

  font-weight 设定字型份量

  支 持:IE3、IE4、NC4

  适 用:所有元素

  可能值: normal 普通字

  bold 粗体字

  bolder 相对于父元素稍粗

  lighter 相对于父元素稍细

  100,200,300,

  400,500,600,

  700,800,900. 数字由小到大代表笔画由细到粗

  normal=400 bold=700

  预设值:normal

  继承性:有

  一般范例:SPAN { font-weight : bolder }

  同轴范例:<SPAN style="font-weight:bolder">

  font-size 设定文字大小

  支 持:IE3、IE4、NC4

  适 用:所有元素

  可能值: 绝对大小,可用的参数由小到大分别有七项

  xx-small, x-small, small, medium, large, x-large, xx-large

  相对大小,可用的参数为larger, smaller两项

  以父元素字型大小为基准

  长度单位,请参考第一章基本单位的相关说明

  百分比,以父元素字型大小为基准

  预设值:medium

  继承性:有

  一般范例:SPAN { font-size : 12pt }

  同轴范例:<SPAN style="font-size:12pt">

  font-variant 设定文字转换

  支 持:IE3、IE4、NC4

  适 用:所有元素

  可能值: normal 普通字

  small-caps 将小写文字转换为大写

  预设值:normal

  继承性:有

  一般范例:SPAN { font-variant : small-caps }

  同轴范例:<SPAN style="font-variant:small-caps">

  font 综合设定字型性质

  支 持:IE3、IE4、NC4

  适 用:所有元素

  可能值: 设定字体样式

  设定文字转换

  设定字型份量

  设定文字大小与列高(请参考设定文字列高部份)

  设定文字字型

  预设值:无

  继承性:有

  一般范例: SPAN { font : bolder small-caps 12pt/120% Arial }

  同轴范例:< SPAN style="font : bolder small-caps 12pt/120% Arial">

  文 字 性 质 的 C S S 指 令

  line-height 设定列高

  支 持:IE3、IE4、NC4

  适 用:所有元素

  可能值: normal 普通列高,根据字体变化合理高度,视浏览器而定

  以元素字型大小乘以该数即为列高

  设定长度,请参考第一章基本单位的相关说明

  百分比,相对于元素字型大小为比例

  预设值:normal

  继承性:有

  一般范例:DIV { line-height : 120% }

  同轴范例:<DIV style="line-height:120%">

  text-align 设定文字对

  支 持:IE3、IE4、NC4

  适 用:区块元素

  可能值: center 对 中央

  right 对 右边

  left 对 左边

  justify 左右对

  预设值:视浏览器而定

  继承性:有

  一般范例:DIV { text-align : center }

  同轴范例:<DIV style="text-align:center">

  vertical-align 设定垂直对

  支 持:IE4

  适 用:同轴元素

  可能值: top 对 同列最高元素顶端

  bottom 对 同列最低元素底端

  baseline 对 底线

  middle 对 中央

  sub 将元素置于下标

  super 将元素置于上标

  text-top 对 文字顶端

  text-bottom 对 文字底端

  参照元素本身列高,以父元素底线为基准作位移

  预设值:baseline

  继承性:有

  一般范例:SPAN { vertical-align : sub }

  同轴范例:<SPAN style="vertical-align:sub">

  text-decoration 设定文字装饰

  支 持:IE3、IE4、NC4

  适 用:所有元素

  可能值: none 普通字

  underline 文字加底线

  overline 文字加顶线

  line-through 文字加删除线

  blink 设定文字闪烁

  预设值:none

  继承性:有

  一般范例:SPAN { text-decoration : blink }

  同轴范例:<SPAN style="text-decoration:blink">

  text-transform 设定文字转换

  支 持:IE3、IE4、NC4

  适 用:所有元素

  可能值: none 普通字

  capitalize 将英文单字地一个字母转换为大写

  uppercase 将所有文字转换为大写

  lowercase 将所有文字转换为小写

  预设值:none

  继承性:有

  一般范例:SPAN { text-transform : uppercase }

  同轴范例:<SPAN style="text-transform:uppercase">

  letter-spacing 设定字母间隔

  支 持:IE4

  适 用:所有元素

  可能值: normal 不改变字母间隔,使用浏览器预设值

  要额外增加的间隔长度,可为负值

  预设值:normal

  继承性:有

  一般范例:SPAN { letter-spacing : 0.5pt }

  同轴范例:<SPAN style="letter-spacing : 0.5pt">

  text-indent 设定文字缩排

  支 持:IE3、IE4、NC4

  适 用:区块元素

  可能值: 长度单位,请参考第一章基本单位的相关说明

  以父元素宽度为基准的百分比值

  预设值:0

  继承性:有

  一般范例:DIV { text-indent : 3pt }

  同轴范例:<DIV style="text-indent:3pt">

时间: 2024-09-14 21:13:36

CSS应用基础教程:文字性质的相关文章

CSS应用基础教程(5) 文字性质

css|基础教程 本 章 C S S 的 主 要 作 用 本章要介绍的是文字相关的CSS指令.通 常一个网站的内容最多的就是文字了,透过这些文字相关的CSS指令,您可以将您的 网页内容排版得美美的.本章将分两个部份为您介绍,第一部份是字型性质的CSS指 令,用以控制文字字型的各种样式:第二部份介绍的是文字性质的CSS指令,用以控 制文字段落的外观及摆设方式. 字 型 性 质 的 C S S 指 令 font-family 设定文字字型 支 持:IE3.IE4适 用:所有元素可能值: <famil

CSS应用基础教程(6) 区块性质

css|基础教程 本 章 C S S 的 主 要 作 用 本章介绍的是区块性质的CSS指令以及它 们的应用与特性,可以设定与控制区块的位置,大小及边缘宽度等性质.本章也将分成 两个部份为您介绍,第一部份要讲的是区块各部份名称与概念的介绍,对于区块有一点 概念后,第二部份才再进入区块性质的CSS指令的介绍. 区 块 各 部 份 名 称 与 概 念 其实我们还可以把所谓的「区块」细分成的几个部份. 由外而内为您作介绍:MARGIN: 边缘,虽然是通透的部份,但是可以藉由边缘宽度的调整来达到内容元素位

CSS应用基础教程(1) 基本认识

css|基础教程 关 於 C S S 的 概 论 CSS是『Cascading Style Sheets』的简称,中文翻为「串接样式表」,也有人只翻为「样式表」.CSS用以作为网页的排版与风格设计,在所谓的「新式网页」里 ,CSS不容置疑是相当重要的一环.CSS是以既有的基础,用以弥补既存HTML 规格里的不足,也让网页的设计更为灵活. 这份教学文件就要来为您介绍CSS的应用罗!在这边并不介绍CSS的所有规格 ,仅就您在网页写作上较常用到,较可能用到的语法部份及应用的方法来为您作介绍.也 由於现

CSS应用基础教程(4) 颜色背景

css|基础教程 本 章 C S S 的 主 要 作 用 在前面的章节介绍完了声明与应用的方法及 一些特性之後,从这章开始,便要正式进入CSS的指令介绍了!本章有两个介绍的主 题,第一个部份介绍的是颜色与背景性质的CSS,其主要的作用在于设定元素的前景 颜色.背景颜色与背景图形等样式设定的性质:而第二部份为您介绍的是用于控制摆放 元素位置的CSS的指令. 颜 色 背 景 的 C S S 指 令 color 设定前景颜色 支 持:IE3.IE4.NC4适 用:所有元素可能值: <color> 设

CSS应用基础教程(3) 应用补充

css|基础教程 挑 选 者 特 性 的 应 用 在讲挑选者的特性之前,要提一下的是CSS继承的特性.所谓的继承的特性是指被包在内部的标签将拥有外部标签的样式性质.继承的特性最典型的应用通常发挥在预设整份网页的样式,而要指定为其它样式的部份再依要设定在个别元素里即可.这项特性可以提供网页设计者更理想的发挥空间. 接下来就要讲挑选者特性的应用!其实这部份应该算是声明的一种方式,但是在您看过第二章的基本的声明与应用後,到这边再讲挑选者您会比较有概念点.在CSS应用或设计的时候,有几种依据元素的关系或

CSS应用基础教程(2) 应用方式

css|基础教程 C S S 的 声 明 方 式 这章节将开始为您介绍CSS的应用.当然一开始要介绍的是如何去建立个样式表 (Style Sheets),包括了声明的方式和应用在网页上的方法,最後还会为您概述一下CSS的一些特性.概略来说,CSS的声明有三种方式: 一.基本声明:最典型的CSS声明方式. element {property: value} 用中文来表示的话,也就是元件(标签) {性质(属性)名称: 设定值}例如: H3 {COLOR: BLUE} 即为一组声明.二.集体声明:同时

WEB标准中使用CSS的基础教程

css|web|web标准|基础教程 CSS过去经常被用来定义字体的属性,而现在可以用它来控制整个文档的布局.然而,为了有效的用CSS来控制布局,需要做一些不同的处理,这种不同是跟用表格布局相对比的. 为了CSS可以高效的控制布局,结构化.语义化的XHTML是必不可少的. 浏览器的支持 在过去几年,浏览器对CSS的支持程度已经改进了很多.不幸的是,浏览器的开发商好象对实施开放的标准并不感兴趣,所以不同浏览器对CSS的支持程度也大相径庭.就算是支持程度最好的浏览器,在软件中仍然有一些bug,使得浏

css滤镜基础教程_基础教程

CSS滤镜基础     随着网页设计技术的发展,人们已经不满足于原有的一些HTML标记,而是希望能够为页面添加一些多媒体属性,例如滤镜的和渐变的效果.CSS技术的飞快发展使这些需求成为了现实.从现在开始我要为大家介绍一个新的CSS扩展部分:CSS滤镜属性(Filter Properties).使用这种技术可以把可视化的滤镜和转换效果添加到一个标准的HTML元素上,例如图片.文本容器.以及其他一些对象.对于滤镜和渐变效果,前者是基础,因为后者就是滤镜效果的不断变化和演示更替.当滤镜和渐变效果结合到

CSS应用基础教程:区块性质

本 章 C S S 的 主 要 作 用 本章介绍的是区块性质的CSS指令以及它 们的应用与特性,可以设定与控制区块的位置,大小及边缘宽度等性质.本章也将分成 两个部份为您介绍,第一部份要讲的是区块各部份名称与概念的介绍,对于区块有一点 概念后,第二部份才再进入区块性质的CSS指令的介绍. 区 块 各 部 份 名 称 与 概 念 其实我们还可以把所谓的「区块」细分成的几个部份. 由外而内为您作介绍: MARGIN: 边缘,虽然是通透的部份,但是可以藉由边缘宽度的调整来达到内容元素位置调整的目的.