界面设计和版式设计 ASP.NET项目开发指南:界面设计（1）

ASP.NET项目开发指南:界面设计（1）  

　　   界面设计（ ）

　　 样式

　　有时Web站点需要一个前台界面 这可能相当容易 只要打开常用的编辑器 然后编写一页一页的页面即可 但当突然被告知要修改页面的布局 样式 或者其他基本的UI内容就相当麻烦了 恐怕没有什么比因为颜色或者其他微不足道的原因而让人不得不重新编写页面更糟糕的事情了 为了避免这类维护方面的噩梦发生 用户界面最好要做到易于维护和修改

　　通常使用级联样式表来划分不同类型的UI元素 如标题 各种表 背景色以及字型 这样将有一个主样式表来帮助提供一致的外观 这些类真正的优点在于任何时候在修改任何用户接口元素时 只需修改CSS文件中的记录项 而不用担心跟踪每一个页面（此页面显示要修改的特定UI元素）

　　下面给出主样式表源文件ST_GinShopManage css 如程序 所示

　　程序   ST_GinShopManage css

　　   H               {

　　                   font family: Verdana Arial;

　　                   font size: medium;

　　                   }

　　   H               {

　　                   font family: Verdana Arial;

　　                   font size: small;

　　                   }

　　   BODY            {

　　                   font family: Verdana Arial;

　　                   font size: x small;

　　                   margin: ;

　　                   }

　　   TABLE           {

　　                   font family: Verdana Arial;

　　                   font size: x small;

　　                   }

　　   INPUT

　　                {

　　                   font size: x small;

　　                   font family: Verdana Arial;

　　                }

　　   SELECT

　　                {

　　                  font size: x small;

　　                  font family: Verdana Arial;

　　               }

　　   a:link          {

　　                   color: #FF ;

　　                   font weight: bold;

　　                   text decoration: none;

　　                   }

　　   a:active        {

　　                   color: #FF ;

　　                   font weight: bold;

　　                   text decoration: none;

　　                   }

　　   a:visited       {

　　                   color: #FF ;

　　                   font weight: bold;

　　                   text decoration: none;

　　                   }

　　   a:hover         {

　　                   color: #FF ;

　　                   font weight: bold;

　　                   text decoration: underline;

　　                   }

　　   navtable       {

　　                   background color: # ;

　　                   color: #FFFFFF;

　　                   font weight: bold;

　　                   }

　　   navtext        {

　　                   color: #FFFFFF;

　　                   font weight: bold;

　　                   }

　　   navlink:link   {

　　                   color: silver;

　　                   text decoration: none;

　　                   }

　　   navlink:active {

　　                   color: silver;

　　                   text decoration: none;

　　                   }

　　   navlink:visited {

　　                   color: silver;

　　                   text decoration: none;

　　                   }

　　   navlink:hover  {

　　                   color: white;

　　                   text decoration: underline;

　　                   }

　　   rheader        {

　　                   background color: # ;

　　                   color: white;

　　                   font weight: bold;

　　                   }

　　   rheadercol      {

　　                   border color: black;

　　                   border style: solid;

　　                   border width: ;

　　                   }

　　   rheadercoll     {

　　                   border color: black;

　　                   border right: ;

　　                   border style: solid;

　　                   border width: ;

　　                   }

　　   rheadercolr     {

　　                   border color: black;

　　                   border left: ;

　　                   border style: solid;

　　                   border width: ;

　　                   }

　　 rbody         {

　　                  background color: #FFFFFF;

　　                  }

　　 rbodycol        {

　　                  border color: black;

　　                  border style: solid;

　　                  border top: ;

　　                  border width: ;

　　                  }

　　 smalltext       {

　　                  COLOR: gray;

　　                  FONT FAMILY: Verdana Arial;

　　                  FONT SIZE: pt;

　　                  LINE HEIGHT: %

　　                  }

      返回目录ASP NET项目开发指南

      编辑推荐

       ASP NET MVC 框架揭秘

       ASP NET开发宝典