CSS+DIV实例——鲜花店

DIV+CSS是WEB设计标准，它是一种网页的布局方法。与传统中通过表格（table）布局定位的方式不同，它可以实现网页页面内容与表现相分离。

在之前介绍过理论的基础上，做如下鲜花店的实例：

页面截图：

html代码：

<html>

<head>

<title>鲜花满屋</title>

<link href="鲜花.css" rel="stylesheet" type="text/css">

</head>

<body>

<div id="container">

<div id="banner"><img src="banner.jpg"></div>

<div id="globallink">

<ul>

<li><a href="#">红玫瑰</a></li>

<li><a href="#">粉玫瑰</a></li>

<li><a href="#">白玫瑰</a></li>

<li><a href="#">香槟玫瑰</a></li>

<li><a href="#">蓝色妖姬</a></li>

<li><a href="#">百合花</a></li>

<li><a href="#">康乃馨</a></li>

</ul>

</div>

<div id="left">

<div id="login">

<form>

<p>用户：<input type="text" class="text"></p>

<p>密码：<input type="text" class="text"></input></p>

<p><input type="button" class="btn" value="登录"></input><input type="button" class="btn" value="注册"> </input></p>

</form>

</div>

<div id="category">

<h4><span>用途</span></h4>

<ul>

<li><a href="#">爱情鲜花<