头闻号

上海江雄塑料五金有限公司

注塑加工

首页 > 新闻中心 > 科技常识:CSS 网页布局排版实例
科技常识:CSS 网页布局排版实例
发布时间:2024-09-21 21:48:41        浏览次数:2        返回列表

今天小编跟大家讲解下有关CSS 网页布局排版实例 ,相信小伙伴们对这个话题应该有所关注吧,小编也收集到了有关CSS 网页布局排版实例 的相关资料,希望小伙伴们看了有所帮助。

代码如下: <html> <head> <style type="text/css"> <!-- body { margin:0px; font-size:13px; font-family:Arial; } #container{ position:relative; width:100%; } #banner{ height:80px; border:1px solid #000000; text-align:center; background-color:#a2d9ff; padding:10px; margin-bottom:2px; } #content{ float:left; text-align:center; padding-right:200px; } #links{ float:right; width:200px; border:1px solid #000000; margin-left:-200px; text-align:center; } #footer{ clear:both; text-align:center; height:30px; border:1px solid #000000; } --> </style> <title>CSS排版</title><body> <div id="container"> <div id="banner">banner</div> <div id="content"> <div class="blog"> <div class="date">date</div> <div class="blogcontent"> content content content content content content content content content content<br> content content content content content content content content content content<br> content content content content content content content content content content<br> content content content content content content content content content content<br> content content content content content content content content content content<br> content content content content content content content content content content<br> content content content content content content content content content content<br> content content content content content content content content content content<br> content content content content content content content content content content<br> content content content content content content content content content content<br> content content content content content content content content content content<br> content content content content content content content content content content<br> content content content content content content content content content content<br> content content content content content content content content content content<br> </div> </div> <div class="others">others</div> </div> <div id="links"> <div class="calendarhead">links<br>links<br>links<br>links</div> <div class="calendartable">links<br>links<br>links<br>links</div> <div class="side">links<br>links<br>links<br>links</div> <div class="syndicate">links<br>links<br>links<br>links</div> <div class="friends">links<br>links<br>links<br>links</div> </div> <div id="footer">footer</div> </div> </body> </html> 提示:您可以先修改部分代码再运行

来源:爱蒂网