CSS 笔记——文本字体
5. 文本字体
-> 文本
(1)text-indent
基本语法
text-indent : length
语法取值
length : 百分比数字 | 由浮点数字和单位标识符组成的长度值,允许为负值。
使用说明
检索或设置对象中的文本的缩进。默认值为 0 。在被另一个对象(如 br )断开的对象内不能应用本属性。此属性对于 currentStyle 对象而言是只读的。对于其他对象而言是可读写的。
(2)text-overflow
基本语法
text-overflow : clip | ellipsis
语法取值
clip : 默认值。不显示省略标记(...),而是简单的裁切
ellipsis : 当对象内文本溢出时显示省略标记(...)
使用说明
设置或检索是否使用一个省略标记(...)标示对象内文本的溢出。这个属性仅仅作用于水平内联方向的,普通的西方文本的溢出。内联溢出发生在行内的文本超出可用宽度却没有换行机会的时候。要强制溢出发生并且应用 ellipsis 值,作者必须设置对象的 white-space 属性值为 nowrap 。假如没有换行机会(例如,对象容器的宽度是狭窄的,而内有很长的没有合理断行的文本),没有应用 nowrap 也有可能溢出。
为了使 ellipsis 值被应用,此属性必须被设置到具有不可视区域的对象。最好的选择是设置 overflow 属性为 hidden 。设置 overflow 属性为 scroll 或者 auto 时,此属性也会应用。但是会有滚动条出现。通过选择省略标记,隐藏的文本可以被选择。当选择发生时,省略标记会隐藏而被文本替换。此属性为在DHTML中制作省略标记提供了高效的方法。此属性对于 currentStyle 对象而言是只读的。对于其他对象而言是可读写的。
(3)vertical-align
基本语法
vertical-align : auto | baseline | sub | super | top | text-top | middle | bottom | text-bottom | length
语法取值
auto : CSS1 根据 layout-flow 属性的值对齐对象内容
baseline : CSS1 默认值。将支持 valign 特性的对象的内容与基线对齐
sub : CSS1 垂直对齐文本的下标
super : CSS1 垂直对齐文本的上标
top : CSS1 将支持 valign 特性的对象的内容对象顶端对齐
text-top : CSS1 将支持 valign 特性的对象的文本与对象顶端对齐
middle : CSS1 将支持 valign 特性的对象的内容与对象中部对齐
bottom : CSS1 将支持 valign 特性的对象的内容与对象底端对齐
text-bottom : CSS1 将支持 valign 特性的对象的文本与对象顶端对齐
length : CSS2 由浮点数字和单位标识符组成的长度值 | 百分数。可为负数。定义由基线算起的偏移量。基线对于数值来说为0,对于百分数来说就是0%。
使用说明
设置或检索对象内容的垂直对其方式。对于 currentStyle 对象而言此属性的默认值为 auto 。对于其他对象而言是 baseline 。此属性对于 currentStyle 对象而言是只读的。对于其他对象而言是可读写的。
(4)text-align
基本语法
text-align : left | right | center | justify
语法取值
left : 默认值。左对齐
right : 右对齐
center : 居中对齐
justify : 两端对齐
使用说明
设置或检索对象中文本的对齐方式。此属性作用于所有块对象(block elements)。在一个 div 对象里的所有块对象的会继承此属性值。 假如属性没有设置,这个参数将获取 null 值。此属性对于 currentStyle 对象而言是只读的。对于其他对象而言是可读写的。
(5)direction
基本语法
direction : ltr | rtl | inherit
语法取值
ltr : 默认值。文本从左到右流入
rtl : 文本从右到左流入
inherit : 文本流入方向由继承获得
使用说明
用于设置文本流入的方向。请参阅对象的 dir 属性。此属性不会影响拉丁文的字母数字字符,它们总是以 ltr 值被呈递。但是此属性会作用于拉丁文的标点符号。假如您想应用此属性于内联文本,您必须设定 unicode-bidi 属性为 embed 或 bidi-override 。此属性对于 currentStyle 对象而言是只读的。对于其他对象而言是可读写的。
(6)word-break
基本语法
word-break : normal | break-all | keep-all
语法取值
normal : 默认值。允许在词间换行
break-all : 该行为与亚洲语言的 normal 相同。也允许非亚洲语言文本行的任意字内断开。该值适合包含一些非亚洲文本的亚洲文本
keep-all : 与所有非亚洲语言的 normal 相同。对于中文,韩文,日文,不允许字断开。适合包含少量亚洲文本的非亚洲文本
使用说明
设置或检索对象内文本的字内换行行为。尤其在出现多种语言时。对于中文,应该使用 break-all 。此属性对于 currentStyle 对象而言是只读的。对于其他对象而言是可读写的。
(7)word-wrap
基本语法
word-wrap : normal | break-word
语法取值
normal : 默认值。允许内容顶开指定的容器边界
break-word : 内容将在边界内换行。如果需要,词内换行( word-break )也将发生
使用说明
设置或检索当当前行超过指定容器的边界时是否断开转行。此属性仅作用于有布局的对象,如块对象。内联要素要使用该属性,必须先设定对象的 height 或 width 属性,或者设定 position 属性为 absolute ,或者设定 display 属性为 block 。此属性对于 currentStyle 对象而言是只读的。对于其他对象而言是可读写的。
-> 字体
(1)font
基本语法
font : font-style || font-variant || font-weight || font-size || line-height || font-family
font : caption | icon | menu | message-box | small-caption | status-bar
语法取值
font-style : CSS1 请参阅 font-style 属性
font-variant : CSS1 请参阅 font-variant 属性
font-weight : CSS1 请参阅 font-weight 属性
font-size : CSS1 请参阅 font-size 属性
line-height : CSS1 请参阅 line-height 属性
font-family : CSS1 请参阅 font-family 属性
caption : CSS2 使用有标题的系统控件的文本字体(如按钮,菜单等)
icon : CSS2 使用图标标签的字体
menu : CSS2 使用菜单的字体
message-box : CSS2 使用信息对话框的文本字体
small-caption : CSS2 使用小控件的字体
status-bar : CSS2 使用窗口状态栏的字体
使用说明
设置或检索对象中的文本特性。该属性是复合属性。默认值为: normal normal normal medium normal "Times New Roman" 。
第一种声明方式参数必须按照如上的排列顺序。每个参数仅允许有一个值。忽略的将使用其参数对应的独立属性的默认值。
(2)color
基本语法
color : color
语法取值
color : 指定颜色。
使用说明
检索或设置对象的文本颜色。无默认值。
(3)font-family
基本语法
font-family : name
font-family : ncursive | fantasy | monospace | serif | sans-serif
语法取值
name : 字体名称。按优先顺序排列。以逗号隔开。如果字体名称包含空格,则应使用引号括起。第二种声明方式使用所列出的字体序列名称。如果使用fantasy序列,将提供默认字体序列。
使用说明
设置或检索用于对象中文本的字体名称序列。默认值为 "Times New Roman" 。序列可包含嵌入字体字体。
(4)font-size
基本语法
font-size : xx-small | x-small | small | medium | large | x-large | xx-large | larger | smaller | length
语法取值
xx-small : 绝对字体尺寸。根据对象字体进行调整。最小
x-small : 绝对字体尺寸。根据对象字体进行调整。较小
small : 绝对字体尺寸。根据对象字体进行调整。小
medium : 默认值。绝对字体尺寸。根据对象字体进行调整。正常
large : 绝对字体尺寸。根据对象字体进行调整。大
x-large : 绝对字体尺寸。根据对象字体进行调整。较大
xx-large : 绝对字体尺寸。根据对象字体进行调整。最大
larger : 相对字体尺寸。相对于父对像中字体尺寸进行相对增大。使用成比例的 em 单位计算
smaller : 相对字体尺寸。相对于父对像中字体尺寸进行相对减小。使用成比例的 em 单位计算
length : 百分数 | 由浮点数字和单位标识符组成的长度值,不可为负值。其百分比取值是基于父对象中字体的尺寸。请参阅 长度单位
使用说明
设置或检索对象中的字体尺寸。此属性对于 currentStyle 对象而言是只读的。对于其他对象而言是可读写的。
(5)font-stretch
基本语法
font-stretch : normal | narrower | wider | ultra-condensed | extra-condensed | condensed | semi-condensed | semi-expanded | expanded | extra-expanded | ultra-expanded
语法取值
normal : 默认值。不应用拉伸变形
narrower : 使用比当前设置的值导致字体宽度更小的值
wider : 使用比当前设置的值导致字体宽度更大的值
使用说明
设置或检索用于对象中文本的文字是否横向的拉伸变形。改变是相对于浏览器显示的字体的正常宽度的。
(6)font-style
基本语法
font-style : normal | italic | oblique
语法取值
normal : 默认值。正常的字体
italic : 斜体。对于没有斜体变量的特殊字体,将应用 oblique
oblique : 倾斜的字体
使用说明
设置或检索对象中的字体样式。此属性对于 currentStyle 对象而言是只读的。对于其他对象而言是可读写的。
(7)font-weight
基本语法
font-weight : normal | bold | bolder | lighter | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900
语法取值
normal : 默认值。正常的字体。相当于 400 。声明此值将取消之前任何设置
bold : 粗体。相当于 700 。也相当于 b 对象的作用
bolder : 比 normal 粗
lighter : 比 normal 细
100 : 字体至少像 200 那样细
200 : 字体至少像 100 那样粗,像 300 那样细
300 : 字体至少像 200 那样粗,像 400 那样细
400 : 相当于 normal
500 : 字体至少像 400 那样粗,像 600 那样细
600 : 字体至少像 500 那样粗,像 700 那样细
700 : 相当于 bold
800 : 字体至少像 700 那样粗,像 900 那样细
900 : 字体至少像 800 那样粗
使用说明
设置或检索对象中的文本字体的粗细。
(8)text-decoration
基本语法
text-decoration : none || underline || blink || overline || line-through
语法取值
none : 默认值。无装饰
blink : 闪烁
underline : 下划线
line-through : 贯穿线
overline : 上划线
使用说明
检索或设置对象中的文本的装饰。有 href 特性的 a ,以及 u , ins 对象默认值为 underline 。对象 strike , s , del ,默认值是 line-through 。
假如 none 值在属性声明的最后,所有的先前的其他取值都会被清除。例如,声明 text-decoration: underline overline blink none 等于声明 text-decoration: none 。
假如对象没有文本(如 img 元素)或者是空元素(如:), 此属性不会发生作用。
假如你设置 body 对象的此属性值为 none , a 对象将依然保持其原有的下划线样式。除非你针对 a 对象声明此属性值。
指定块对象的此属性将影响其所有内联子对象。而此影响一旦发生,块对象容器最终会受到影响。在IE4+中可用的值为 overline 和 blink 。虽然 blink 值被提供,但它不会被作用。此属性对于 currentStyle 对象而言是只读的。对于其他对象而言是可读写的。
(9)text-underline-position
基本语法
text-underline-position : below | above
语法取值
below : 默认值。在文本下面
above : 在文本上面
使用说明
设置或检索 text-decoration 属性定义的下划线的位置。此属性对于 currentStyle 对象而言是只读的。对于其他对象而言是可读写的。
(10)text-shadow
基本语法
text-shadow : length || length || opacity || color
语法取值
color : 指定颜色。
length : 由浮点数字和单位标识符组成的长度值。可为负值。指定阴影的水平延伸距离。
length : 由浮点数字和单位标识符组成的长度值。可为负值。指定阴影的垂直延伸距离。
opacity : 由浮点数字和单位标识符组成的长度值。不可为负值。指定模糊效果的作用距离。如果你仅仅需要模糊效果,将前两个 length 全部设定为 0 。
使用说明
设置或检索对象中文本的文字是否有阴影及模糊效果。可以设定多组效果,方式是用逗号隔开。可以被用于伪类 :first-letter 和 :first-line 。
(11)text-transform
基本语法
text-transform : none | capitalize | uppercase | lowercase
语法取值
none : 默认值。无转换发生
capitalize : 将每个单词的第一个字母转换成大写,其余无转换发生
uppercase : 转换成大写
lowercase : 转换成小写
使用说明
检索或设置对象中的文本的大小写。此属性对于 currentStyle 对象而言是只读的。对于其他对象而言是可读写的。
(12)line-height
基本语法
line-height : normal | length
语法取值
normal : 默认值。默认行高
length : 百分比数字 | 由浮点数字和单位标识符组成的长度值,允许为负值。其百分比取值是基于字体的高度尺寸。
使用说明
检索或设置对象的行高。即字体最底端与字体内部顶端之间的距离。行高是字体下延与字体内部高度的顶端之间的距离。为负值的行高可用来实现阴影效果。假如一个格式化的行包括不止一个对象,则最大行高会被应用。在这种情况下,此属性不可以为负值。此属性对于 currentStyle 对象而言是只读的。对于其他对象而言是可读写的。
(13)letter-spacing
基本语法
letter-spacing : normal | length
语法取值
normal : 默认值。默认间隔
length : 由浮点数字和单位标识符组成的长度值,允许为负值。
使用说明
检索或设置对象中的文字之间的间隔。该属性将指定的间隔添加到每个文字之后,但最后一个字将被排除在外。字符间距会受对齐调整影响。此属性对于 currentStyle 对象而言是只读的。对于其他对象而言是可读写的。
(14)word-spacing
基本语法
word-spacing : normal | length
语法取值
normal : 默认值。默认间隔
length : 由浮点数字和单位标识符组成的长度值,允许为负值。
使用说明
检索或设置对象中的单词之间插入的空隔。对于IE4+而言仅在MAC平台上可用。对于其他系统平台的支持由IE6开始。单词间距会受对齐调整影响。此属性对于 currentStyle 对象而言是只读的。对于其他对象而言是可读写的。
CSS 笔记——文本字体的更多相关文章
- 复习-css控制文本字体属性
css控制文本字体属性 font-family:字体系列,如”serif“”sans-serif“ font-size:尺寸 font-style:字体样式,如“normal,italic(斜体).o ...
- css笔记-文本样式
聊聊text-decoration.text-indent.text-transform.letter-spacing.word-spacing.vertical-align.下面是一些常用设置文本样 ...
- css笔记——文本样式
聊聊text-decoration.text-indent.text-transform.letter-spacing.word-spacing.vertical-align.下面是一些常用设置文本样 ...
- CSS 3. 文本|字体|背景|定位
1.文本属性和字体属性 <!DOCTYPE html> <html lang="en"> <head> <meta charset=&qu ...
- css中的字体及文本相关属性
css中的字体及文本相关属性 1.字体相关属性 字体主要可以设置color.font-family.font-size.font-size-adjust.font-stretch.font-style ...
- CSS中的字体属性和文本属性
1.CSS字体的属性 font 简写,作用是把所有的针对字体的属性设置在一个声明中 font-family 设置字体系列 font-size 设置字体尺寸 font-style 设置字体风格,ital ...
- CSS样式----CSS属性:字体属性和文本属性(图文详解)
本文最初于2015-10-04发表于博客园,并在GitHub上持续更新前端的系列文章.欢迎在GitHub上关注我,一起入门和进阶前端. 以下是正文. 本文重要内容 CSS的单位 字体属性 文本属性 定 ...
- (4)《Head First HTML与CSS》学习笔记---文本的CSS规则和盒模型;div与span;<a>元素的链接色;伪类
1.每个font-family包含一组共同特征的字体.共五个字体系列: sans-serif----这个系列包括了没有衬线的字体,与serif相比,通常认为这个系列更容易在计算机上识读. serif- ...
- CSS 文本字体颜色设置方法(CSS color)
CSS 文本字体颜色设置方法(CSS color) 一.认识CSS 颜色(CSS color) 这里要介绍的是网页设置颜色包含有哪些:网页颜色规定规范. 1.常用颜色地方包含:字体颜色.超链接颜色.网 ...
随机推荐
- Python与RPC -- (转)
XML-RPC xmlrpc是使用http协议做为传输协议的rpc机制,使用xml文本的方式传输命令和数据. 一个rpc系统,必然包括2个部分: 1)rpc client,用来向rpc server调 ...
- Windows下基于python3使用word2vec训练中文维基百科语料(三)
对前两篇获取到的词向量模型进行使用: 代码如下: import gensim model = gensim.models.Word2Vec.load('wiki.zh.text.model') fla ...
- 【R语言学习】时间序列
时序分析会用到的函数 函数 程序包 用途 ts() stats 生成时序对象 plot() graphics 画出时间序列的折线图 start() stats 返回时间序列的开始时间 end() st ...
- MVC自定义路由实现URL重写,SEO优化
//App_Start-RouteConfig.cs public class RouteConfig { public static void RegisterRoutes(RouteCollect ...
- Centos. Mac 通过nfs 搭建共享目录
centos 关闭fiewalld,selinux yum install yum install nfs-utils portmap vim /etc/exports 文件写入时使用anonuid用 ...
- 005 JAVA多线程和并发基础面试问答(转载)
原文链接:http://ifeve.com/java-multi-threading-concurrency-interview-questions-with-answers/ 多线程和并发问题是Ja ...
- Java将CST的时间字符串转换成需要的日期格式字符串
已知得到的Date类型的变量meettingdate 的值为Sun Dec 16 10:56:34 CST :现在要将它改为yyyy-MM-dd类型或yyyy年MM月dd日: 变为yyyy年MM月dd ...
- js-callee,call,apply概念
JS - caller,callee,call,apply 概念[转载] 在提到上述的概念之前,首先想说说javascript中函数的隐含参数:arguments Arguments : 该对象代表正 ...
- Vue优化首屏加载
背景: 使用vue + iview搭建的一个后台管理系统,路由已经用了懒加载,加载登陆页面,居然还是需要18S左右,刚到一个新公司,项目经理很委婉的说,看看能不能优化了一下.然后就开始了网上一大堆'v ...
- 海量文件查重SimHash和Minhash
SimHash 事实上,传统比较两个文本相似性的方法,大多是将文本分词之后,转化为特征向量距离的度量,比如常见的欧氏距离.海明距离或者余弦角度等等.两两比较固然能很好地适应,但这种方法的一个最大的缺点 ...