符合SEO标准的div+css页面参考

最新推荐文章于 2023-04-20 10:46:48 发布

linkboy2004

最新推荐文章于 2023-04-20 10:46:48 发布

阅读量970

点赞数

分类专栏：网络相关文章标签： div css stylesheet float xhtml html

本文链接：https://blog.csdn.net/linkboy2004/article/details/1786930

版权

网络相关专栏收录该内容

36 篇文章 0 订阅

订阅专栏

下面的部分是著名设计师阿捷发表的div+css三行两列网页参考，星箭在此基础上做了小小的改动，以前乐思蜀也对阿捷的这个经典布局案例进行过修改，将左右代码互换，达到主体内容显示在前更方便搜索引擎抓取分析页面最重要内容的SEO目的，星箭也对阿捷的这个案例进行一番简单修改，主要是将左右代码互换，加入了h1,h2标签，对文字列表使用<li>等。

符合SEO标准的div+css页面参考

html部分：

< !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

css部分：

/*全局*/

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>div+css参考</title>
<meta name="keywords" content="div+css,div+css SEO,div+css参考" />
<meta name="description" content="介绍符合SEO标准的div+css页面参考，对阿捷的三行两列div+css案例进行修改，使之更符合SEO的需求" />
<meta name="author" content="星箭" />
<meta name="copyright" content="星箭SEO" />
<link href="css.css" rel="stylesheet" type="text/css" />
<base target="_blank" />
</head>
<body>
<div id="header">header</div>
<div id="contain">
<div id="mainbg">
<div id="right">
<div class="text">
<h1>right</h1>
<p>1</p><p>1</p><p>1</p><p>1</p><p>1</p>
</div>
</div>
<div id="left">
<div class="text">
<h2>left</h2>
<ul>
<li>leftnav</li>
<li>leftnav</li>
<li>leftnav</li>
<li>leftnav</li>
</ul>
</div>
</div>
</div>
</div>
<div id="footer">footer</div>
</body>
</html>
body{
background:#999;
text-align:center;
color: #333;
font-family:arial,"宋体",verdana,sans-serif;
}
/*头部*/
#header{width:776px;margin-right: auto;margin-left: auto; padding: 0px;background: #EEE;height:60px;text-align:left;}
/*主体内容*/
#contain{margin-right: auto;margin-left: auto;width: 776px;}
#mainbg{width:776px;padding: 0px;background: #60A179;float: left;}
.text{margin:0px;padding:20px;}
.text h1,h2{margin:0;padding:0;list-style:none;}
/*右侧*/
#right{float: right; margin: 2px 0px 2px 0px;padding:0px; width: 574px; background: #ccd2de;text-align:left;}
/*左侧导航*/
#left{float: left; margin: 2px 2px 0px 0px; padding: 0px; background: #F2F3F7;width: 200px;text-align:left;}
/*底部*/
#footer{clear:both;width:776px;margin-right: auto;margin-left: auto; padding: 0px;background: #EEE;height:60px;}

linkboy2004

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
符合SEO标准的div+css页面参考

下面的部分是著名设计师阿捷发表的div+css三行两列网页参考，星箭在此基础上做了小小的改动，以前乐思蜀也对阿捷的这个经典布局案例进行过修改，将左右代码互换，达到主体内容显示在前更方便搜索引擎抓取分析页面最重要内容的SEO目的，星箭也对阿捷的这个案例进行一番简单修改，主要是将左右代码互换，加入了h1,h2标签，对文字列表使用等。符合SEO标准的div+css页面参考html部分：
复制链接

扫一扫

专栏目录