CSS3-设置文本样式

CSS3-设置文本样式

<!--	应用基本文本样式	-->
<!--	text-align: start, end, left, right, center, justify	-->
<!--	text-justify:	如果text-align使用了justify属性,那么justify用来指定对齐文本的规则 -->
<style type = "text/css">
	p {
		text-align: center;
	}
</style>


<!-- text-justify	-->
<!--	属性:		-->
<!--	auto		-->
<!--	none	禁用文本对齐 -->
<!--	inter-word	空白分布在单词之间 -->
<!--	inter-ideograph	空白分布在单词,表意字之间 -->
<!--	inter-cluster	空白分布在单词,字形集的边界 -->
<!--	distribute	空白分布在单词,字形集的边界	-->
<!--	kashida		通过拉长指定字符调整对齐方式 -->



<!--	处理空白	-->
<!--	white-space	-->
<!--	属性:		-->
<!--	normal, 默认值,空白被压缩,文本自动换行	-->
<!--	nowrap	空白被压缩,问本行不换行			-->
<!--	pre		空白符被保留,文本只在遇到换行符的时候换行 -->
<!--	pre-line	空白符被压缩,文本会在一行排满或遇到换行符时换行	-->
<!--	pre-wrap	空白被保留,文本会在一行排满或遇到换行符时换行	-->
<style type = "text/css">
	p {
		white-space: pre-line;	
	}
</style>


<!--	指定文本方向	-->
<!--	direction: ltr, rtl;	-->
<style type = "text/css">
	p {
		direction: rtl;	
	}
</style>


<!--	指定单词,字符,行之间的间距	-->
<!--	letter-spacing	设置字母之间的间距	-->
<!--	word-spacing	设置单词之间的间距	-->
<!--	line-height		设置行高			-->
<style type = "text/css">
	p {
		letter-spacing:	10px;
		word-spacing:	2px;
		line-height:	3em;
	}
</style>


<!--	控制断词	-->
<!--	word-wrap: normal, break-word;	-->
<style type = "text/css">
	p {
		word-wrap: break-word;	
	}
</style>


<!--	首行缩进	-->
<!--	text-indent	-->
<style type = "text/css">
	p {
		text-indent:	15%;	
	}
</style>


<!--	文本装饰与大小写转换	-->
<!--	text-decoration	和 text-transform	-->
<!--	text-decoration 属性	none, underline, overline, line-through, blink	-->
<!--	text-transform	属性	none, capitalize, uppercase, lowercase	-->
<style type = "text/css">
	p {
		text-decoration:	line-through;
	}
</style>


<!--	创建文本阴影	-->
<!--	text-shadow : <h-shadow> <v-shadow> <blur> <color>	-->
<style type = "text/css">
	p {
		text-shadow:	0.1em 0.1em 1px lightgray;
	}
</style>


<!--	使用字体	-->
<!--	font-family	设置文本采用的字体名称	-->
<!--	font-size	-->
<!--	font-style	-->
<!--	font-variant	指定字体是否以小型大写字母显示	-->
<!--	font-weight		设置字体粗细	-->
<!--	font	简写	font: font-style font-variant font-weight font-size font-family	-->


<!--  font-family通用字体: setif, sans-serif, cursive, fantasy, monospace	-->
<style type = "text/css">
	p {
		font-family: monospace;	
	}
</style>


<!--	font-size 属性	-->
<!--	xx-small, x-small, small, medium, large, x-large, xx-large	-->
<!--						smaller,larger	设置字体相对于父元素字体的大小	-->
<style type = "text/css">
	p {
		font-size: xx-large;
	}
</style>


<!--设置字体样式和粗细	-->
<!--	font-style		font-weight	-->

<style type = "text/css">
	p {
		font-style: italic;
		font-weight: bold;
	}
</style>


<!--	使用web字体	-->
<!--	直接下载web字体并应用在自己的页面上	-->
<!--	@font-face		-->
<style type = "text/css">
	@font-face {
		font-family: 'myfont'
		font-style: normal;
		font-weight: normal;
		src: url('');
	}
	p {
		font-family: myfont;
	}
</style>
<!--	web字体有多种格式, 但WOFF得到了广泛的支持和应用	-->