`

CSS初级感悟1

CSS 
阅读更多
任意浏览器的默认字体高都是16px。所有未经调整的浏览器都符合: 1em=16px。那么12px=0.75em,10px=0.625em。

em有如下特点:
1. em的值并不是固定的;
2. em会继承父级元素的字体大小。

一般来说,可以为所有块级元素应用 text-indent,但无法将该属性应用于行内元素,图像之类的替换元素上也无法应用 text-indent 属性。不过,如果一个块级元素(比如段落)的首行中有一个图像,它会随该行的其余文本移动。

如果想把一个行内元素的第一行“缩进”,可以用左内边距或外边距创造这种效果。

将块级元素或表元素居中,要通过在这些元素上适当地设置左、右外边距来实现。

text-align 不会控制元素的对齐,而只影响内部内容。元素本身不会从一段移到另一端,只是其中的文本受影响。

word-spacing 属性可以改变字(单词)之间的标准间隔.

letter-spacing 属性与 word-spacing 的区别在于,字母间隔修改的是字符或字母之间的间隔。

text-transform 属性处理文本的大小写:
none
uppercase
lowercase
capitalize  -首字母大写

文本装饰:text-decoration 有 5 个值:
none
underline
overline
line-through
blink  - 闪烁

white-space 属性会影响到用户代理对源文档中的空格、换行和 tab 字符的处理。
normal : 会合并所有的空白符,并忽略换行符。
pre : 浏览器不会合并空白符,也不会忽略换行符。
nowrap : 设置为不能换行.
pre-wrap : 浏览器不仅会保留空白符并保留换行符,还允许自动换行。
pre-line : 浏览器会保留换行符,并允许自动换行,但是会合并空白符,这是与 pre-wrap 值的不同之处。

文本方向:direction 属性影响块级元素中文本的书写方向、表中列布局的方向、内容水平填充其元素框的方向、以及两端对齐元素中最后一行的位置。

对于行内元素,只有当 unicode-bidi 属性设置为 embed 或 bidi-override 时才会应用 direction 属性。

direction 属性有两个值:ltr 和 rtl。大多数情况下,默认值是 ltr,显示从左到右的文本。如果显示从右到左的文本,应使用值 rtl。

除了各种特定的字体系列(如 Times、Verdana、Helvetica 或 Arial)外,CSS 定义了 5 种通用字体系列:
Serif 字体
Sans-serif 字体
Monospace 字体
Cursive 字体
Fantasy 字体

Serif 字体
这些字体成比例,而且有上下短线。如果字体中的所有字符根据其不同大小有不同的宽度,则成该字符是成比例的。例如,小写 i 和小写 m 的宽度就不同。上下短线是每个字符笔划末端的装饰,比如小写 l 顶部和底部的短线,或大写 A 两条腿底部的短线。Serif 字体的例子包括 Times、Georgia 和 New Century Schoolbook。
Sans-serif 字体
这些字体是成比例的,而且没有上下短线。Sans-serif 字体的例子包括 Helvetica、Geneva、Verdana、Arial 或 Univers。
Monospace 字体
Monospace 字体并不是成比例的。它们通常用于模拟打字机打出的文本、老式点阵打印机的输出,甚至更老式的视频显示终端。采用这些字体,每个字符的宽度都必须完全相同,所以小写的 i 和小写的 m 有相同的宽度。这些字体可能有上下短线,也可能没有。如果一个字体的字符宽度完全相同,则归类为 Monospace 字体,而不论是否有上下短线。Monospace 字体的例子包括 Courier、Courier New 和 Andale Mono。
Cursive 字体
这些字体试图模仿人的手写体。通常,它们主要由曲线和 Serif 字体中没有的笔划装饰组成。例如,大写 A 再其左腿底部可能有一个小弯,或者完全由花体部分和小的弯曲部分组成。Cursive 字体的例子包括 Zapf Chancery、Author 和 Comic Sans。
Fantasy 字体
这些字体无法用任何特征来定义,只有一点是确定的,那就是我们无法很容易地将其规划到任何一种其他的字体系列当中。这样的字体包括 Western、Woodblock 和 Klingon。
分享到:
评论

相关推荐

    CSS初级入门CHM

    CSS初级入门CSS初级入门CSS初级入门CSS初级入门CSS初级入门CSS初级入门CSS初级入门CSS初级入门CSS初级入门CSS初级入门CSS初级入门CSS初级入门CSS初级入门CSS初级入门CSS初级入门CSS初级入门CSS初级入门CSS初级入门...

    CSS初级教程适合初学者

    CSS初级教程 CSS初级教程 CSS初级教程 CSS初级教程 CSS初级教程 CSS初级教程 CSS初级教程

    css初级使用手册(学习资料)

    css初级使用手册(学习资料)css初级使用手册(学习资料)css初级使用手册(学习资料)css初级使用手册(学习资料)

    免费的CSS初级教程下载

    CSS初级教程,适合初学者使用和参考,帮你设计出更加漂亮的网页

    HTML+JS+CSS 初级教学

    HTML+JS+CSS 初级教学 HTML+JS+CSS 初级教学 HTML+JS+CSS 初级教学

    CSS初级教程,ppt,....

    CSS初级教程,ppt,......,,,,,,,,,

    CSS初级教程(vicky)

    CSS初级教程 vicky出品,必属精品

    Html和Css初级教程.txt

    Html和Css初级教程,共160多集,资源33.5G大小。。。。

    CSS初级入门:页面样式的整体声明

    CSS初级入门:页面样式的整体声明CSS初级入门:页面样式的整体声明

    css初级资料

    css初级资料

    css实例 很适合css初级学习者

    css实例 很适合css初级学习者 都是源代码 可以学习使用,也可以取其中好的样式用在自己的网站中,当做工具使用

    3天突破css初级进阶

    突破css突破css突破css突破css突破css突破css突破css突破css突破css突破css突破css突破css突破css突破css突破css突破css突破css突破css

    css1css1css样式css1css1css1css1css1css1css33333

    css1css样式css1css1css1css1css1css1css33333

    css3.0参考手册 css3.0参考手册

    css3.0参考手册css3.0参考手册css3.0参考手册css3.0参考手册css3.0参考手册css3.0参考手册css3.0参考手册css3.0参考手册css3.0参考手册css3.0参考手册css3.0参考手册css3.0参考手册css3.0参考手册css3.0参考手册css...

    CSS免费初级教程

    css初级教程,对于很多刚刚写html,并想把页面写的漂亮点的童鞋比较适合

    CSS初级教程

    CSS初级教程,包括CSS的书写规则,导入,引用,基础,实用。

    html和css初级入门

    html+css入门级别的资源,以及部分浏览器兼容的解决!

    css基础知识word版

    CSS教程,分为CSS初级教程和CSS高级教程两个阶段. CSS初级教程包括:CSS语法,CSS颜色,CSS文本与CSS字体,CSS边框,CSS列表等基础知识. CSS高级教程包括:CSS选择符,CSS相关特性,CSS盒模式,标准网页设计与页面排版,CSS伪类...

    CSS初级学习手册.pdf

    CSS基础开发笔记,适合刚入门前端的萌新,同样适合在做前端开发的朋友(可以查阅一些基础知识),分级标题目录,支持跳转,每一节有清晰的实例附图,方便理解知识。

    CSS CSS CSS

    CSS CSS 资料套装 CSS CSS 资料套装 CSS CSS 资料套装 CSS CSS 资料套装 CSS CSS 资料套装 CSS CSS 资料套装 CSS CSS 资料套装

Global site tag (gtag.js) - Google Analytics