引用 网站设计规范1.0

 

引用

帥虎网站设计规范1.0
<DIV g_t_left c07 content?>1. 图片(除了LOGO,图像类图片外)一般做为背景,上面是带链接的文字。特指栏目图片,栏目图片要加ALT标签,图像类图片也要加ALT标签,其它可免去。
2. 表格边框线尽量采用CSS实现。
3. 正文文字用12号字宋体,标题用14号粗体。
4. 页面头文件的设置;参照“首页示范代码”;
5. 图片的大不,图像,BANNER等要求高的图片除外,一般采用GIF格式,并且保证图片大小在10K以下,BANNER图片控制在<=40K;
6. 表格
强调不要使用太多的嵌套表格和复杂的表格,而且整个页面表格模块化。表格的定义尽量使用像素,尤其大模块的表格。最内层的表格可以采用百分比。
7. 网站文件命名规范
" 文件命名的原则:以最少的字母达到最容易理解的意义。所有单英文单词文件名都必须为小写,所有组合英文单词文件名第二个起第一个字母大写,如productList.jsp;
8. 网站目录设置规范
目录建立的原则:以最少的层次提供最清晰简便的访问结构。根目录只允许存放index.html以及其他必须的系统文件。每个主要功能模块(主菜单)建立一个相应的独立目录。根目录下的images为存放公用图片目录,每个目录下私有图片存放于各自独立images目录. 例如:\product\images  \about\images 所有的js文件存放在根目录下统一目录\js 所有的CSS文件存放在根目录下的style目录;
9. 关于链接
采用相对站点根目录的绝对地址,(用DW建站点时设置一下这项就可)。
10. 保持干净的html代码,但要适当做注释,尤其首页各个模块的开始、结束都要做相应注释。












首页示范代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh-CN" lang="zh-CN">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>晨砻科技公司--IT服务</title>
<base target="_blank" /><!-- 默认所有链接新窗口打开 -->
<meta content="" />
<meta content="" />
<meta content="index, follow" />
<meta content="index, follow" />
</head>
<body>










<!-- 导航 -->
<!-- 内容开始 -->
<!-- **模块开始 -->

<!-- 页脚 -->
</body>
</html>

下面是我整理的一套比较全的CSS,比较适合中小企业网站。

/* 默认项 */
body { font-family:"宋体", arial;margin:0;  font-size:12px; color:#000;line-height:150%;}
div,form,img,ul,ol,li,dl,dt,dd}
h1,h2,h3,h4,h5,h6}
table,td,tr,th{font-size:12px;}



body {
 margin-left: 0px;
 margin-top: 0px;
 margin-right: 0px;
 margin-bottom: 0px;
 scrollbar-face-color: #f6f6f6;
 scrollbar-highlight-color: #ffffff;
 scrollbar-shadow-color: #cccccc;
 scrollbar-3dlight-color: #cccccc;
 scrollbar-arrow-color: #330000;
 scrollbar-track-color: #fefefe;
 scrollbar-darkshadow-color: #ffffff;
 }











input {
 font-size: 12px;
 color: #006;
 background: #f7f7f7;
 border: #6C95BC solid 1px;
 }
ul





/* 默认链接颜色 */ 
a.:link{color:#000000;text-decoration:none;}
a.:visited{color:#333333;text-decoration:none;}
a.:hover {color:#999999;text-decoration:none;}


/* 默认链接颜色 */
.title14{color:#000000;font-size:14px;font-weight:bold;line-height:150%;text-decoration:none;}
 a.title:link{color:#000000;text-decoration:none;}
 a.title:visited{color:#333333;text-decoration:none;}
 a.title:hover {color:#999999;text-decoration:none;}
.content13 {
 font-size: 13px;line-height: 150%;color: #000000;text-decoration: none;
 }
.black12{color:#000000;font-size:12px;line-height:150%;text-decoration:none;}
 a.black:link{color:#000000;text-decoration:none;}
 a.black:visited{color:#333333;text-decoration:none;}
 a.black:hover {color:#999999;text-decoration:none;}
.black14{color:#000000;font-size:14px;line-height:150%;text-decoration:none;}
 a.black14:link{color:#000000;text-decoration:none;}
 a.black14:visited{color:#333333;text-decoration:none;}
 a.black14:hover {color:#999999;text-decoration:none;}
.title_white14{color:#FFFFFF;font-size:14px;font-weight:bold;line-height:150%;text-decoration:none;}
 a.title_white14:link{color:#FFFFFF;text-decoration:none;}
 a.title_white14:visited{color:#FFFFFF;text-decoration:none;}
 a.title_white14:hover {color:#FFFFFF;text-decoration:none;}


















.white12{color:#FFFFFF;font-size:12px;line-height:150%;text-decoration:none;}
 a.white12:link{color:#FFFFFF;text-decoration:none;}
 a.white12:visited{color:#FFFFFF;text-decoration:none;}
 a.white12:hover {color:#FFFFFF;text-decoration:none;}


.blue12{color:#005fbf;font-size:12px;line-height:150%;text-decoration:none;}
 a.blue12:link{color:#0059b4;text-decoration:none;}
 a.blue12:visited{color:#47a2ff;text-decoration:none;}
 a.blue12:hover {color:#ffa800;text-decoration:none;}


.red_14{color:#da111b;font-size:12px;font-weight:bold;line-height:150%;text-decoration:none;}
 a.red_14:link{color:#da111b;text-decoration:none;}
 a.red_14:visited{color:#da111b;text-decoration:none;}
 a.red_14:hover {color:#da111b;text-decoration:none;}


.red12{color:#DA111b;font-size:12px;font-weight:bold;line-height:150%;text-decoration:none;}
 a.red12:link{color:#DA111b;text-decoration:none;}
 a.red12:visited{color:#DA111b;text-decoration:none;}
 a.red12:hover {color:#DA111b;text-decoration:none;} 
 
 
/* 表格颜色 */
.Tableborder_and_bg_blue {
 border-right: #036 1px solid; background-color: #ebf7ff
 }
.Tableborder_and_bg_yellow{
 border-right: #b07c00 1px solid;  background-color: #feffdd
 }











.Tableborder_and_bg_gray{
 border-right: #cccccc 1px solid;  background-color: #fafafa
 }
.Tableborder_gray{
 border-right: #cccccc 1px solid; 
 }
.Tableborder_blue{
 border-right: #b3d7f5 1px solid; 
 }
.Tableborder_yellow{
 border-right: #f2e8aa 1px solid; 
 }
.Tableborder_red{
 border-right: #cd0000 1px solid; 
 }
.Tableborder_gray {
 
 
 }
.Tableborder_gray td{
 
 
 } 






















你可能感兴趣的:(html,jsp,css,XHTML)