前言:好久没更新过CSDN博客了,现在从原来的OI,变成了一个科研工作者。最近打算把原来的一些资料整理一下,作为经验公开分享,希望能帮到更多默默努力耕耘的人~
网页设计系列之前写了五期,分别为:
网页设计(一)——HTML基础概念:https://blog.csdn.net/csyzcyj/article/details/107283767
网页设计(二)——DIV+CSS布局1:https://blog.csdn.net/csyzcyj/article/details/107284087
网页设计(三)——DIV+CSS布局2:https://blog.csdn.net/csyzcyj/article/details/107284655
网页设计(四)——DIV+CSS布局3:https://blog.csdn.net/csyzcyj/article/details/107285198
网页设计(五)——marquee标签:https://blog.csdn.net/csyzcyj/article/details/107285901
这里给出一个综合性实例供大家参考,实例的效果如下,其中的图片素材都是网上找的:
HTML代码如下:
<html>
<head><link rel="stylesheet" type="text/css" href="css/homepage.css"/></head>
<body>
<div id="Container">
<!-------------------------------------------------------------------------------------------------->
<div id="top">
<div id="logo">LOGO</div>
<div id="small_nav">
<ul>
<li><a href="readme.html">设为首页</a></li>
<li><a href="readme.html">加入收藏</a></li>
<li><a href="readme.html">English</a></li>
</ul>
</div>
<br>
<div id="phone_intro"> 全国免费咨询热线:<special>400 **********</special></div>
</div>
<!-------------------------------------------------------------------------------------------------->
<div id="link">
<div id="nav">
<ul>
<li><a href="readme.html">网站首页</a></li>
<li><a href="readme.html">关于我们</a></li>
<li><a href="readme.html">产品展示</a></li>
<li><a href="readme.html">新闻中心</a></li>
<li><a href="readme.html">资质证书</a></li>
<li><a href="readme.html">人才招聘</a></li>
<li><a href="readme.html"