style属性；相反，你可以只声明一次，浏览器便会按相应的页面布局效果来显示文本：例2：
<html>
<head>
<title>我的第一个CSS页面</title>
<style type="text/css">
h1 {font-size:30px; font-family:宋体;}
h2 {font-size:15px; font-family:黑体;}
p {font-size:8px; font-family:"隶书";}
</style>
</head>
<body>
<h1>我的第一个CSS页面</h1>
<h2>欢迎参观我的第一个CSS页面</h2>
<p>你可以在这里了解CSS的原理</p>
</body>
</html>
在上例中，我们在文档的头部（head）插入了CSS，它将应用于整个页面。要将CSS嵌入文档，你只需通过标签<style type="text/css">告诉浏览器该段为CSS即可。
在例2中，所有一级标题（h1）采用宋体，字体大小为30（象素）；所有二级标题（h2）采用黑体，字体大小为15（象素）；普通段落文字（p）采用隶书，字体大小为8（象素）。
另一种使用CSS的方法，是将CSS代码单独作为一个文档保存。通过把CSS文档独立出来，你就可以同时对多个页面的布局进行集中管理。如果你要对一个大型网站上的大量网页作字体类型或大小的修改，那么这个方法绝对是最佳选择。在此，我们不对CSS作更深的讨论，我们的CSS教程最就此作详细介绍。
CSS的作用不仅仅是指定字体类型和大小，它还可以用于许多其它方面，比如设置颜色和背景等。你可以试试下面的例子：
<p style="color:green;"
>绿色的文字</p>
<h1 style="background-color:blue;">兰色背景的标题</h1>
<body style="background-image:url('http://www.chinahtml.com/logo.png');">
你可以试一下将这些示例代码插入自己的网页中，你可以采用两种方法：（1）使用style属性；（2）把CSS放在文档的头部（head）。
CSS除了用于设置颜色与字体等布局之外，还可以控制页面设置与表现形式(边距，漂浮，对齐，宽度，高度等）。通过为不同元素设置不同的CSS，你可以令页面布局精密而美观。
例3：
<p style="padding:25px;border:1px solid red;">我爱CSS</p>
该例在浏览器中将显示如下：
我爱CSS
float属性用以定义元素的漂浮方式：靠左还是靠右。下例展示了该属性的用法：
例4：
<img src="bill.jpg" alt="Bill Gates" style= "float:left;" />
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit,
sed diam nonummy nibh euismod tincidunt ut laoreet dolore
magna aliquam erat volutpat. Ut wisi enim ad minim veniam,
quis nostrud exerci tation ullamcorper suscipit
lobortis nisl ut aliquip ex ea commodo consequat...</p>
评论加载中…
 |