如何使用CSS 浮动
1、定义图像浮动于文章的左面。<style type="text/css">img{float:left}</style>
2、让一个有着边框与边界的图像浮动于文章的左面。<style type="text/css">img{float:left;border:1px dotted black;margin:0px 0px 15px 20px;}</style>
3、定义一个标题图像，并让其出现在文章的右面。<style type="text/css">div{float:right;width:120px;margin:0 0 15px 20px;padding:15px;border:1px solid black;text-align:center;}</style><body><div><img src="/i/e.gif" /><br />CSS is fun!</div>
4、定义文章的首字母进行一个侧边的浮动。<style type="text/css">span{float:left;width:0.7em;font-size:400%;font-family:algerian,courier;line-height:80%;}</style>
5、利用浮动代码与链接代艨位雅剖码再结合表格做一个导航条。<style type="text/css">ul{float:left;width:100%;padding:0;margin:0;list-style-type:none;}a{float:left;width:7em;text-decoration:none;color:white;background-color:purple;padding:0.2em 0.6em;border-right:1px solid white;}a:hover {background-color:#ff3300}li {display:inline}</style>
6、利用浮动代码创建一个完整的页面效果。在这个网页当中，我有了完整的页面。<style type="text/艘早祓胂css">div.container{width:100%;margin:0px;border:1px solid gray;line-height:150%;}div.header,div.footer{padding:0.5em;color:white;background-color:gray;clear:left;}h1.header{padding:0;margin:0;}div.left{float:left;width:160px;margin:0;padding:1em;}div.content{margin-left:190px;border-left:1px solid gray;padding:1em;}</style>
