CSS样式表范例

                                              /*CSS样式表范例*/

/* 此标签内是注释 */
/* 自定义的标签也可以是中文命名*/
/* 如果以"."开头的自定义标签(即适用于所有元素的标签)FrontPage会自动添加到样式列表框中*/

/*  1。在网页源代码里加入如下代码可以连接到样式表：  */

/*  <link type="text/css" href="_private/style.css" rel="stylesheet">  */

/*  根据具体情况设置 href 的值。  */

/*  2。大小的单位     */

/*  px   象素         */
/*  pt   磅           */
/*  mm   毫米         */
/*  cm   厘米         */
/*  em   1em=12pt     */
/*  pc   1pc=12pt     */
/*  in   英寸         */

/*  3。角度的单位     */

/*  deg    度         */
/*  grad   梯度       */
/*  rad    弧度       */

/*  4。频率的单位     */

/*  Hz                */
/*  kHz               */

/*  ————————————————————————————————————    */

/*  设置前景色  */
.About_color        
 {
 color:rgb(255,0,0); 
 }

/*  设置背景  */ 
.About_background
 {
 background-color:#00FF00;                 /*   设置背景色，none 是默认值，可以更改为颜色值      */
 background-image:url('../images/bluearrow.gif');         
             /*   设置背景图片，url 里可以是绝对地址，也可以是相对地址 */
 background-repeat:repeat-x;             /*   设置背景图片的重复方式，可选值有：                */
                 /*   repeat     沿X轴和Y轴两个方向重复显示图片            */
                  /*   repeat-x   沿X轴方向重复显示图片          */
                 /*   repeat-y   沿Y轴方向重复显示图片       */
                /*   no-repeat  不重复图片          */
 background-attachment:fixed                     /*   设置水印，fixed 开启水印效果，scroll 关闭水印        */
  
 }

 /*  颜色可以是十六进制数值、rgb()函数或CSS承认的颜色名称。如：    */
 
 /*  none    透明      */
 /*  red     红色      */
 /*  green   绿色      */
 /*  blue    蓝色      */
 /*  white   白色      */

 

/*   设置字体  */
.About_font
 {
 
 font-family : "科信创意体","符号字体","Arial Black","华文新魏";   
 
            /* 设置字体，可以设定优先值，如果第一字体无效则引用第二字体。 */
            
 font-size : 2em;          /* 设置字号                */
 
 font-style: normal;                         /* 设置字体倾斜程度，可选值有：normal、italic、oblique     */
 
 font-weight : bold;            /* 设置字重程度，默认值为normal，可选值有：       */
 
            /* normal、bold、bolder、lighter 及数字表达式      */
            
 font-variant:normal       /* 可选值有：normal、small-caps。
            /* 一个使用了 small-caps 属性的元素中的小写字母看起来要    */
            /* 比正常的大写字母小一些。           */
 }
 
/*  设置文本属性  */
.About_text
 {
 text-indent:2em;       /* 设置文本缩进程度                */
 
 Alignment:center;       /* 设置文本对齐方式，可选值有：left、center、right、justify   */
 
 
 text-decoration :none;         /* 设置文本修饰方式，可选值有：          */
            /* none             无修饰           */
            /* underline        下划线           */
            /* overline   上划线           */
            /* line-through  删除线           */
            /* blink   闪烁           */
            
 text-shadow:black;       /* 设置文本阴影，可设为 black            */
 
 letter-spacing:auto;       /* 文本的字间距               */
 
 word-spacing:2em;            /* 设置单词间距                */
 
 text-transform:uppercase;       /* 设置大小写，可选值有：             */
            /* capitalize   每句句首成为大写          */
            /* uppercase    全部大写           */
            /* lowercase    全部小写           */
 }
 
/*  设置列表  */
.About_list
 {
 list-style-type:disc        /* 设置项目符号样式，可选值有：       */
              /* disc   圆           */
              /* circle  空心圆           */
              /* square  方形          */
              /* decimal  十进制数值         */
              /* lower-roman  小写罗马数字       */
              /* upper-roman  大写罗马数字         */
              /* lower-alpha  小写希腊字母        */
              /* upper-alpha  大写希腊字母       */
 /*    list-style-image:url(_private/bluearrow.gif) 设置项目符号为图片       */
 }
 
/*  设置边框   */
.About_border
 {     
 /* 设置 box 的边框宽值   */
 border-top-width:2px;
 border-right-width:2px;
 border-bottom-width:5px;
 border-left-width:5px;    /*   也可以用 border-width : 上 右 下 左  */
 
 /*  设置 box 的边框颜色值  */
 border-top-color:red;
 border-right-color:#CC0000;
 border-bottom-color:blue;
 border-left-color:#00CCCC;     /*   也可以用 border-color : 上 右 下 左  */
 
 /*  设置 box 的边框样式  */
 border-top-style:double;
 border-right-style:dotted;
 border-bottom-style:dashed;
 border-left-style:solid;     /*   也可以用 border-style : 上 右 下 左  */
 
 /*  border-style 的可选值有：       */
 
 /*  none    无边框  */
 /*  solid   实线    */
 /*  double  双线    */
 /*  dotted  点线    */
 /*  dashed  长短线  */
 
 border-collapse: collapse;     /* 单元格边距无  */
  
 }

.About_line
 {
 line-height : 50px;  /* 设置行高  */
 }

.About_margin    
 {          /*  margin 的属性 */
 margin-top : 5px;         /* 上 */
 margin-right : 2pt;       /* 右 */
 margin-botton : 2em;      /* 下 */
 margin-left : 2pt;        /* 左 */
           /*  当只有两个参数时，margin 表现为 上下、左右 */
           /*  当只有三个参数时，margin 表现为 上、左右、下 */
           /*  当有四个参数时，margin 表现为 上、右、下、左 */
 }
 
.About_padding    /* padding 值和 margin 值类似，它表示Box的边与Box内部文本之间的距离。 */
 {
 padding-top : 5px;         /* 上 */
 padding-right : 2pt;       /* 右 */
 padding-botton : 2em;      /* 下 */
 padding-left : 2pt;        /* 左 */
 }

/* 定义元素位置 */
.About_position{

 position:static;     /*定义元素位置，可选值有：*/
          /*static(固有位置)、relative(屏幕相对位置)、absolute(屏幕绝对位置)*/
          
 direction:ltr;      /*决定Box的排列方式，可选值有：ltr、rtl*/
 
 float:none;       /*决定Box的飘浮位置，可选值有：left、right、none*/
 
 clear:none;       /*禁止其它元素飘浮在Box旁边位置，可选值有：*/
          /*left、right、both、none*/
          
 top:auto;       /*精确定义元素的位置*/
 right:auto;
 botton:auto;
 left:auto; 
 
 z-index:auto;      /*CSS允许元素的重叠显示，此属性定义元素的层次关系，值可为数字*/
 
 width:auto;       /*精确定义元素的宽度*/
          /*CSS允许有 max-width(最大宽度) 属性和 min-width(最小宽度) 属*/
          /*性，把元素宽度定义在最大宽度和最小宽度之间*/
          
 height:auto;      /*精确定义元素的高度*/
          /*CSS允许有 max-height(最大高度) 属性和 min-height(最小高度) */
          /*属性，把元素宽度定义在最大高度和最小高度之间*/
          
 overflow:visible;     /*设置当元素不足显示全部内容时的状态，可选值有：*/
          /*visible(扩大面积以显示所有内容)*/
          /*hidden(隐藏超出范围的内容)*/
          /*scroll(在元素的右边显示一个滚动条)*/
          /*auto(在需要时显示滚动条)*/
 }
 
 
 
/************************************************************************************/
/*html中的标签*/
/************************************************************************************/

/*超链接：常规*/
A:link {
 COLOR: #0033cc; text-decoration: none
}

/*超链接：*/
A:visited {
 COLOR: #0033cc; text-decoration: none
}

/*超链接：已访问*/
A:active {
 COLOR: #ff0000; text-decoration: none
}

/*超链接：悬停*/
A:hover {
 COLOR: #000000; text-decoration: underline
}
 
/*定义悬停于元素的鼠标样式*/
About_Cursor{
 cursor:auto;  /*默认*/
 
 /*可选值：*/
 /*default:  普通鼠标样式*/
 /*hand:   手型*/
 /*pointer:  手型*/
 /*crosshair: 细十字架*/
 /*move:   移动*/
 /*text:   文本*/
 /*wait:   忙*/
 /*help:   帮助*/

 /*e-resize:  一些改变大小的鼠标样式*/ 
 /*ne-resize:*/
 /*nw-resize:*/
 /*n-resize:*/
 /*se-resize:*/
 /*sw-resize:*/
 /*s-resize:*/
 /*w-resize:*/
 
 /*<url>:  自定义*/

 }
/*设置滚动条样式*/
body {
 margin:0px;
 scrollbar-face-color: #DEE3E7;
 scrollbar-highlight-color: #FFFFFF;
 scrollbar-shadow-color: #DEE3E7;
 scrollbar-3dlight-color: #D1D7DC;
 scrollbar-arrow-color:  #006699;
 scrollbar-track-color: #EFEFEF;
 scrollbar-darkshadow-color: #98AAB1;
}