4
<html> <head> <style type='text/css'> body{background:gray; text-align:center; margin:0; padding:0;} #wrapper{width:1024px; background:white; margin:0 auto; text-align:left;} #branding{background:#aaaaaa; height:100px; line-height:100px; font-size:2.5em; text-align:center; } #footer{background:black; color:white; height:80px; line-height:80px; font-size:1em; text-align:center; } </style> </head> <body> <div id='wrapper'> <div id='branding'> 北京联合大学 </div> <div id='content'> 内容<br/><br/><br/><br/><br/><br/><br/> <br/><br/><br/><br/><br/><br/><br/> </div> <div id='mainNav'> <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> </ul> </div> <div id='footer'> Copytright@buu.edu.cn </div> </div> <img id='img 1'src='Desert.jpg' width='100' height='100' /> </body> </html>
<html> <head> <style type='text/css'> p{text-align:justify; text-indent:2em; display:block;} div{width:200px;height:200px; border:solid #aaaaaa 1px;} #d1{background-color:red; text-indent:2em; float:left; } #d2{background-color:green; float:left; } #d3{background-color:blue; float:left;position:relative; } p{clear:both;} ul{list-style:none;} #img1{position:absolute; bottom:0; right:0;} </style> </head> <body> <ul> <li>aaaa</li> <li>aaaa</li> <li>aaaa</li> </ul> <div id='d1'>d1d1 d1d1 d1d1 d1d1 d1d1 d1d1 </div> <div id='d2'>d2d2</div> <div id='d3'>d3d3 <img id='img1' src='Jellyfish.jpg' width='100' height='100' /></div> <p> fweg gertg wertgfdg sfds rg erg gegg; fweg gertg wereh tr sfdseg erg gegg; fweg gertg weg erg gegg;rtgfdg sfds r eg gegg; fweg gertg wereh try h rtgfdg srg gegg; tryh rtgfdg sfdseg erg gegg; fweg gertg werehs r e g erg gegg;rtfds r eg erg gegg; wereh tryh rtgfdg sfds rg erg gegg; fweg gertg wereh tr yh rtgfdg sfdseg erg gegg; fweg ehs r eg erg gegg;rtgfdg sfds r eg erg gegg; </p> 66666666666666666666 </body> </html>