原创CSS网页布局[六]文本属性

叉子起初制作zblog建站之旅的时候,思路非常的清晰.于是想当然认为CSS网页布局教程一定也很清晰.谁知道制作起来才发现原来这将是一项复杂的工程.为什么？原因,zblog建站之旅教程的主题是能使用zblog.它毕竟只是一个工具.而CSS网页布局确是一门学科.

不过,叉子在制作完前5节之后,思路就豁然开朗了.至少,叉子不会担心制作出一不明所以的教程…下面是叉子教程的思路.

第一部分：
基础,了解CSS的作用.

第二部分：
学习具体的属性.[也就是具体操作字体大小,颜色等等…].

第三部分：
实际例子.

复习：
属性和属性值的概念.

p{
font-size:100px;
}

网页结构之中有一段文本.
<p>我是一段文本.</p>

CSS中的长度和量度.
我们知道在设计黑板报的时候,我们首先需要对黑板的整个长宽有个了解.
桌面=1064*768.
象素：px

知识点：
?letter-spacing 属性,控制字母间隔距离.
?word-spacing 属性,控制单词之间的间距. 
?text-indent 属性,控制段落中文本缩进的方法.

上面三个属性的属性值都是以长度为单位的,理解起来很容易.下面的则需要以[关键字]为具体的属性值内容.如元素汽车的颜色属性,具体的属性值就不能是100米.而应该是关键字红色.

?text-align 属性,控制对齐文档中的文本.

⒈left – 左边
⒉center – 居中
⒊right – 右边
⒋justify – 两端对齐.注意,中文效果不是很明显.

?text-decoration 属性,控制文本上,中,下划线的方法.

⒈underline – 下划线
⒉overline – 上划线
⒊line-through – 中划线
⒋none – 无划线

?text-transform 属性,控制文本的大小写和进行字母大小写之间转换.

⒈capitalize – 所有单词首字母大写
⒉uppercase – 所有字母全部大写
⒊lowercase – 所有字母全部小写

小技巧,如果让某段英文文本的第一个字母大写.用我们前面学的伪元素,fire-letter选择到第一个字母.使用uppercase属性值就可以了.

?white-space 属性,控制文本流及格式.
 
 ⒈normal – 普通.
 ⒉pre – 预先格式化,在IE6.必须是标准模式这个属性值才能起作用.
 ⒊nowrap – 防止文本自动换行,除非加入<br />强制换行符.

注意,默认浏览器会清除文本中多余1个的空格和回车.

 

上一篇：原创CSS网页布局[五]层叠与优先级概念

下一篇：原创CSS网页布局[七]字体属性