日期:2014-05-17  浏览次数:20922 次

精通CSS.DIV网页样式与布局_第三章
<html>
<head>
	<title>文字字体</title>
<style>
<!--
h2{
	font-family:黑体, 幼圆;/*如果有黑体就用 没有就用幼圆  在没有就用浏览器默认的*/
}
p{
	font-family:Arial, Helvetica, sans-serif;
}
p.kaiti{
	font-family:楷体_GB2312, "Times New Roman";
}
-->
</style>
   </head>

<body>
	<h2>立 春</h2>
	<p>自秦代以来,我国就一直以立春作为春季的开始。立春是从天文上来划分的,而在自然界、在人们的心目中,春是温暖,鸟语花香;春是生长,耕耘播种。在气候学中,春季是指候(5天为一候)平均气温10℃至22℃的时段。</p>
	<p class="kaiti">作者: isaac</p>
</body>
</html>

<html>
<head>
	<title>文字大小</title>
<style>
<!--
p.inch{ font-size: 0.5in; }
p.cm{ font-size: 0.5cm; }
p.mm{ font-size: 4mm; }
p.pt{ font-size: 12pt; }
p.pc{ font-size: 2pc; }
-->
</style>
   </head>

<body>
	<p class="inch">文字大小,0.5in</p>
	<p class="cm">文字大小,0.5cm</p>
	<p class="mm">文字大小,4mm</p>
	<p class="pt">文字大小,12pt</p>
	<p class="pc">文字大小,2pc</p>
</body>
</html>

<html>
<head>
	<title>文字大小</title>
<style>
<!--
p.one{ font-size:xx-small; }
p.two{ font-size:x-small; }
p.three{ font-size:small; }
p.four{ font-size:medium; }
p.five{ font-size:large; }
p.six{ font-size:x-large; }
p.seven{ font-size:xx-large; }
-->
</style>
   </head>

<body>
	<p class="one">文字大小,xx-small</p>
	<p class="two">文字大小,x-small</p>
	<p class="three">文字大小,small</p>
	<p class="four">文字大小,medium</p>
	<p class="five">文字大小,large</p>
	<p class="six">文字大小,x-large</p>
	<p class="seven">文字大小,xx-large</p>
</body>
</html>

<html>
<head>
	<title>文字大小_相对值</title>
<style>
<!--
p.one{
	font-size:15px;		/* 象素,因此实际显示大小与分辨率有关,很常用的方式 */
}
p.one span{
	font-size:200%;		/* 在父标记的基础上200% */
}
p.two{
	font-size:30px;
}
p.two span{
	font-size: 0.5em;	/* 在父标记的基础上×0.5 */
}
-->
</style>
   </head>

<body>
	<p class="one">文字大小<span>相对值</span>,15px。</p>
	<p class="two">文字大小<span>相对值</span>,30px。</p>
</body>
</html>

<html>
<head>
	<title>文字颜色</title>
<style>
<!--
h2{ color:rgb(0%,0%,80%); }
p{
	color:#333333;
	font-size:13px;
}
p span{ color:blue; }
-->
</style>
   </head>

<body>
	<h2>冬至的由来</h2>
	<p><span>冬至</span>过节源于汉代,盛于唐宋,相沿至今。《清嘉录》甚至有“<span>冬至</span>大如年”之说。这表明古人对<span>冬至</span>十分重视。人们认为<span>冬至</span>是阴阳二气的自然转化,是上天赐予的福气。汉朝以<span>冬至</span>为“冬节”,官府要举行祝贺仪式称为“贺冬”,例行放假。《后汉书》中有这样的记载:“<span>冬至</span>前后,君子安身静体,百官绝事,不听政,择吉辰而后省事。”所以这天朝庭上下要放假休息,军队待命,边塞闭关,商旅停业,亲朋各以美食相赠,相互拜访,欢乐地过一个“安身静体”的节日。</p>
	<p>唐、宋时期,<span>冬至</span>是祭天祭祀祖的日子,皇帝在这天要到郊外举行祭天大典,百姓在这一天要向父母尊长祭拜,现在仍有一些地方在<span>冬至</span>这天过节庆贺。</p>
</body>
</html>

<html>
<head>
	<title>文字粗体</title>
<style>
<!--
h1 span{ font-weight:lighter;}/*lighter:常规 bold:粗体*/
span{ font-size:28px; }
span.one{ font-weight:100; }
span.two{ font-weight:200; }
span.three{ font-weight:300; }
span.four{ font-weight:400; }
span.five{ font-weight:500; }
span.six{ font-weight:600; }
span.seven{ font-weight:700; }
span.eight{ font-weight:800; }
span.nine{ font-weight:900; }
span.ten{ font-weight:bold; }
span.eleven{ font-weight:normal; }
-->
</style>
   </head>

<body>
	<h1>文字<span>粗</span>体</h1>
	<span class="one">文字粗细:100</span>
	<span class="two">文字粗细:200</span>
	<span class="three">文字粗细:300</span>
	<span cl