【html网页创建】Html网页布局-重庆云诚科技

导读简述htmlDIV +CSS网页布局原理本文最佳回答用户：【冷風吹】，现在由重庆云诚科技小编为你分析与【html网页创建】的相关内容！最佳答案方法/步骤一个网页设计时，我们可以将一个页...

本篇文章给大家谈谈html网页创建，以及Html网页布局对应的知识点，希望对各位有所帮助，不要忘了收藏本站喔。

简述htmlDIV +CSS网页布局原理

本文最佳回答用户：【冷風吹】，现在由重庆云诚科技小编为你分析与【html网页创建】的相关内容！

最佳答案方法/步骤

一个网页设计时，我们可以将一个页面设置为头部，中间，和底部三部分；头部有分为店招（logo）和导航等

中间既内容部分，内容也可一个整体，也可左右分离，

底部来页面结尾，一般写版权信息，友情链接等

END

头部编辑

店招：

<!doctype html>

<html>

<head>

<title>淘宝助手网</title>

<style>

#top{ width:1200px; height: auto; margin:0 auto; color:#FFF;}

#logo{ width:100%; height:100px; background: #003; }

</style>

</head>

<body>

</div>

</div>

</body>

</html>

导航：

<!doctype html>

<html>

<head>

<title>淘宝助手网</title>

<style>

a,ul,li,div,span,td{ padding:0; margin:0;}

#top{ width:1200px; height: auto; margin:0 auto; color:#FFF;}

#logo{ width:100%; height:100px; background: #003; }

#nav{ width:100%; height:30px; background:#300}

a{ text-decoration: none; display:block;den}

ul li{list-style: none;}

#nav>ul>li{ float:left; margin-left: 50px; line-height:30px; }

#nav>ul>li>a{ color:#FFF; font-weight:900px}

</style>

</head>

<body>

<ul>

</ul>

</div>

</div>

</body>

</html>

END

内容

<!doctype html>

<html>

<head>

<title>淘宝助手网</title>

<style>

a,ul,li,div,span,td{ padding:0; margin:0;}

#top{ width:1200px; height: auto; margin:0 auto; color:#FFF;}

#logo{ width:100%; height:100px; background: #003; }

#nav{ width:100%; height:30px; background:#300}

a{ text-decoration: none; display:block;}

ul li{list-style: none;}

#nav>ul>li{ float:left; margin-left: 50px; line-height:30px; }

#nav>ul>li>a{ color:#FFF; font-weight:900px}

/*******===================头====================************/

#centre{ margin:0 auto; width:1200px; height:auto; }

#centreLeft{ float:left; width:70%; height:500px;border:1px #333333 solid;}

#centreRight{ float: right; width:27%; height:400px;border:1px #333333 solid;}

</style>

</head>

<body>

<ul>

</ul>

</div>

</div>

</body>

</html>

END

底部

<!doctype html>

<html>

<head>

<title>淘宝助手网</title>

<style>

a,ul,li,div,span,td{ padding:0; margin:0;}

#top{ width:1200px; height: auto; margin:0 auto; color:#FFF;}

#logo{ width:100%; height:100px; background: #003; }

#nav{ width:100%; height:30px; background:#300}

a{ text-decoration: none; display:block;}

ul li{list-style: none;}

#nav>ul>li{ float:left; margin-left: 50px; line-height:30px; }

#nav>ul>li>a{ color:#FFF; font-weight:900px}

/*******===================头====================************/

#centre{ margin:0 auto; width:1200px; height:auto; overflow: hidden }

#centreLeft{ float:left; width:70%; height:500px;border:1px #333333 solid;}

#centreRight{ float: right; width:27%; height:400px;border:1px #333333 solid;}

/***********==============内容===================*******/

#bottom{ margin:0 auto; width:1200px; height:200px; border:1px #333333 solid; margin-top:20px; }

/***********==============底部===================*******/

</style>

</head>

<body>

<ul>

</ul>

</div>

</div>

</body>

</html>

关于[html网页创建]的介绍就聊到这里吧，感谢你花时间阅读本站内容，更多关于Html网页布局、html网页创建的信息别忘了在本站进行查找喔。

【html网页创建】Html网页布局

简述htmlDIV +CSS网页布局原理

推荐文章：

联系我们

【html网页创建】Html网页布局

简述htmlDIV +CSS网页布局原理

推荐文章：

猜你喜欢

最新文章

联系我们