手机
当前位置:查字典教程网 >网页设计 > Div+Css教程 >使用CSS格式化页面布局示例(附图)
使用CSS格式化页面布局示例(附图)
摘要:源代码:NewDocument页面头部页面导航首页日志相册留言板状态左侧栏中间内容右侧栏滚动信息栏底部实现效果:

源代码:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<title> New Document </title>

<meta name="Generator" content="EditPlus">

<meta name="Author" content="">

<meta name="Keywords" content="">

<meta name="Description" content="">

<style type="text/css">

<>

</style>

</head>

<body>

<div id="header">页面头部</div>

<div id="menu">

页面导航

<tr>

<td>

<a href="" target="_blank" >首页 <a href="" target="_blank" >日志 <a href="" target="_blank" >相册 <a href="" target="_blank" >留言板 <a href="" target="_blank" >状态

</td>

</tr>

</div>

<div id="content">

<div>左侧栏</div>

<div>中间内容</div>

<div>右侧栏</div>

</div>

<div id="footer1">滚动信息栏</div>

<div id="footer2">底部</div>

</body>

</html>

实现效果:

1

【使用CSS格式化页面布局示例(附图)】相关文章:

DIV CSS列形导航一例,超酷解析

使用Div+CSS布局设计网站的优点

采用DIV+CSS布局的好处

利用CSS同比例缩小图片技巧

响应式布局该怎么设计

CSS导航布局中当前页面的具体实现demo示例

用CSS控制网页总体风格

如何在网页中插入CSS样式表

CSS制作网页布局实例:隐藏input文字

用CSS floats创建三栏页布局

精品推荐
分类导航