首页 > web前端 > css教程 > 正文

常用CSS集合_经验交流

WBOY
发布: 2016-05-16 12:08:47
原创
1618 人浏览过

/**//*按钮样式*/
.ButtonCSS {}{
    font-family:"Tahoma", "宋体";
    字体大小:9pt; 颜色:#003399;
    边框:1px #003399 实心;
    颜色:006699;
    边框底部:#93bee2 1px 实心; 
    左边框:#93bee2 1px 实心; 
    右边框:#93bee2 1px 实心; 
    顶部边框:#93bee2 1px 实心;
    背景图片:url(../Images/bluebuttonbg.gif);
    背景颜色:#e8f4ff;
    光标:手;
    字体样式:正常;
    宽度:60px;
    高度:22px;
}

/**//*蓝色按钮样式*/
.blueButtonCss {}{
    font-family: "Tahoma", "宋体";
    字体大小:9pt; 颜色:#003366;
    边框:0px #93bee2 实心;
   /**//* 边框底部:#93bee2 1px solid; 
    左边框:#93bee2 1px 实心; 
    右边框:#93bee2 1px 实心; 
    顶部边框:#93bee2 1px 实心;*/
    background-image:url(../Images/blue_button_bg.gif);
    背景颜色:#ffffff;
    光标:手;
    字体样式:正常;
}

/**//*红色按钮样式*/
.redButtonCss {}{
    font-family: "Tahoma", "宋体";
    字体大小:9pt; 颜色:#0066cc;
    边框:1px #93bee2 实心;
    边框底部:#93bee2 1px 实心; 
    左边框:#93bee2 1px 实心; 
    右边框:#93bee2 1px 实心; 
    顶部边框:#93bee2 1px 实心;
    背景图片:url(../Images/redbuttonbg.gif);
    背景颜色:#ffffff;
    光标:手;
    字体样式:正常;
}
/**//*选择按钮样式*/
.selectButtonCss
{}{
    font-family: "Tahoma", "宋体";
    字体大小:9pt; 颜色:#0066cc;
    边框:1px #93bee2 实心;
    边框底部:#93bee2 1px 实心; 
    左边框:#93bee2 1px 实心; 
    右边框:#93bee2 1px 实心; 
    顶部边框:#93bee2 1px 实心;
    背景图片:url(../Images/blue_button_bg.gif);
    背景颜色:#ffffff;
    光标:手;
    字体样式:正常;
}    

/**//*绿色按钮样式*/
.greenButtonCss {}{
    font-family: "Tahoma", "宋体";
    字体大小:9pt; 颜色:#0066cc;
    边框:1px #93bee2 实心;
    边框底部:#93bee2 1px 实心; 
    左边框:#93bee2 1px 实心; 
    右边框:#93bee2 1px 实心; 
    顶部边框:#93bee2 1px 实心;
    背景图片:url(../Images/greenbuttonbg.gif);
    背景颜色:#ffffff;
    光标:手;
    字体样式:正常;
}
/**//*图像按钮*/
.imageButton
{}{
光标:手;    /**//*改变鼠标形状*/
}
/**//*页面正文样式*/
正文
{}{
    滚动条面颜色:#EDEDF3;
    滚动条突出显示颜色:#ffffff;
    滚动条阴影颜色:#93949F;
    scrollbar-3dlight-color:#EDEDF3;
    滚动条箭头颜色:#082468;
    滚动条轨道颜色:#F7F7F9;
    滚动条暗影颜色:#EDEDF3;

    字体大小:9pt;
    颜色:#003366;
    溢出:自动;
}
TD {}{ 字体大小:12px }
TH 
{}{
    字体大小:12px; 
}
/**//*************************************
下拉选择框显示风格
*************************************/
选择
{}{
    右边框:#000000 1px solid; 
    顶部边框:#FFFFFF 1px 实心; 
    字体大小:12px; 
    左边框:#FFFFFF 1px 实线;
    颜色:#003366; 
    边框底部:#000000 1px 实心; 
    背景颜色:#f4f4f4;
}

/**//*****************************************************
超级链接显示风格
*****************************************************/
A:链接,A:已访问{}{color:#223355;text-decoration: 无}
A:悬停{} {颜色:红色;文本装饰:无;}

A.highlight:链接,A.highlight:访问过{}{颜色:红色; 文本装饰:无}
A.highlight:悬停{}{颜色:红色; 文本装饰:下划线}

A.thisclass:链接,A.thisclass:访问过{}{颜色:#D9EBFD; 字体粗细:粗体; 文本装饰:无}
A.thisclass:悬停{}{}颜色:#FFFFFF;字体粗细:粗体; }

A.navlink:链接,A.navlink:访问过{}{color: #D9EBFD; 文本装饰:无}
A.navlink:hover {}{color: #FFFFFF; 文本装饰:无}


/**//*****************************************************
线条文本编辑框显示风格
*****************************************************/
.EditBox
{}{
    背景:#ffffff; 
    边框:1px 实心#B7B7B7;
    颜色:#003366;
    光标:文本;
    字体系列:“Arial”;
    字体大小:9pt;
    高度:18px;
    内边距:1px;
}
/**//****************************************************
多行文本框样式
*****************************************************/
.MultiEditBox
{}{
    背景:#f8f8f8;
    边框底部:#B7B7B7 1px solid;
    左边框:#B7B7B7 1px solid;
    右边框:#B7B7B7 1px 实心;
    边框顶部:#B7B7B7 1px solid;
    颜色:#000000;
    光标:文本;
    字体系列:“Arial”;
    字体大小:9pt;
    内边距:1px;
}

/**//*****************************************************
阴影风格的表单
*****************************************************/
.Shadow 
{}{
    位置:绝对;
    z-index:1000;
    顶部:0px;
    左:0px;
    背景:灰色;
    背景颜色:#FFCC00;
    过滤器 : progid:DXImageTransform.Microsoft.DropShadow(color=#FF404040,offX=2,offY=2,positives=true);
}
/**//**************************************** **************
只显一条横线的文字风格!
**************************************************** ******/
.logintxt
{}{
    右边框:#ffffff 0px solid; 
    顶部边框:#ffffff 0px 实心;
    字体大小:9pt; 
    左边框:#ffffff 0px 实心; 
    边框底部:#c0c​​0c0 1px 实心; 
    背景颜色:#ffffff
}
/**//*****************************************************
DataGrid页眉样式
*****************************************************/
.dgTitle
{}{
    高度:25px;
    颜色:#ffffff;
    字体大小:大;
    文本对齐:居中;
    垂直对齐:中间;
    背景图像:url(../images/tableTitle2.gif); 高度:25px

}

/**//*****************************************************
DataGrid数据显示样式
*****************************************************/
.dgItem
{}{
    高度:15px;
    文本对齐:居中;
    垂直对齐:中间;
}
/**//*****************************************************
文本框显示样式
*****************************************************/
.clarity
{}{
    右边框:#ffffff 0px solid; 
    顶部边框:#ffffff 0px 实心;
    字体大小:9pt; 
    左边框:#ffffff 0px 实心; 
    边框底部:#ffffff 0px 实心; 
}
TABLE.List {}{ border-top: 1px solid #000000; 边框底部:1px 实心#000000; }
TABLE.List TH,TABLE.List TD {}{} 填充:4px;背景颜色:#eeeeee;边框底部:2px 实心#ffffff;右边框:1px 实心#ffffff;左边框:1px固体#ffffff;颜色:#000000}
TABLE.List TH {}{}背景颜色:#0064a8;边框顶部:2px 固体#ffffff;颜色:#ffffff;字体粗细:正常;}
TABLE.List TH A:链接{}{COLOR:#ffffff; 文本装饰:无}
TABLE.List TH A:访问过 {}{COLOR:#ffffff; 文本装饰:无}
TABLE.List TH A:悬停 {}{COLOR:#ffffff; 文本装饰:下划线}

TABLE.Form TH、TABLE.Form TD {}{} 填充:4px;背景颜色:#f6f6f6;边框底部:1px 实心#F6F6F6;边框右:1 像素实心#ffffff;border-left:1px solid #ffffff;color:#000000}
TABLE.Form TH {}{ 背景颜色:#E8E8E8;border-top:1px solid #ffffff;color:#006699;font-大小:12px;字体粗细:正常;边框底部:1px;}
TABLE.Form TH A:链接{}{COLOR:#ffffff; 文本装饰:无}
TABLE.Form TH A:访问过{}{COLOR:#ffffff; 文本装饰:无}
TABLE.Form TH A:hover {}{COLOR: #ffffff; 文本装饰:下划线}

TABLE.Sample TD {}{ padding:2px;background-color:#f6f6f6;border-bottom:1px solid #000000;border-top:1px solid #000000;border-右:1px solid #000000;左边框:1px solid #000000;颜色:#000000}
TABLE.Sample TH {}{ 背景颜色:#AEC1D7;border-bottom:1px solid #000000;border-top :1px solid #000000;border-right:1px solid #000000;border-left:1px solid #000000;color:#000000;font-weight:normal;}

TABLE.SampleD TD {}{ 填充:2px;边框底部:1像素实心#000000;边框顶部:1像素实心#000000;边框右:1像素实心#000000;边框左:1像素实心#000000;颜色:#000000}
TABLE.SampleD TH {}{}边框底部:1像素实心#000000;边框顶部:1像素实心#000000;边框右:1像素实心#000000;边框左:1像素实心#000000;颜色:#000000;字体粗细:正常;}

TABLE.Form1 TH,TABLE.Form1 TD {}{ 填充:4px;背景颜色:#BED8F3;边框底部:1px 实心 #ffffff;边框右:1px 实心 #ffffff;边框-left:1px solid #ffffff;color:#000000}
/**//*****************************************************
 没有边框的输入框 
*****************************************************/
.NoneInput
{}{
    文本对齐:中心;
    宽度:99%;高度:99%;
    边框顶部样式:无;
    右边框样式:无;
    左边框样式:无;
    背景颜色:#f6f6f6;
    边框底部样式:无;
}

/**//*****************************************************
 扁平风格的表单样式
*****************************************************/

 

/**//**************************************************** *****/
表格
{}{
    边框折叠:折叠;
}

/**//*
进度条样式
*/
.bi-loading-status {}{
  /**//*位置:   绝对;*/
  宽度:        150px;
  内边距:1px;
  溢出:隐藏;
  背景颜色:灰色;  
}

 

.bi-loading-status .text {}{
  white-space:  nowrap;
  溢出:     隐藏;
  宽度:             100%;
  文本溢出:     省略号;
  内边距:      1px; 
}


.bi-loading-status .progress-bar {}{
  边框:       1px solid ThreeDSshadow;
  背景:   窗口;
  高度:       10px;
  宽度:        100%;
  内边距:1px;
  溢出:隐藏; 
}


.bi-loading-status .progress-bar div {}{
  背景:   突出显示;
  溢出:隐藏;
  高度:       100%;
  过滤器:       Alpha(Opacity=0, FinishOpacity=100, Style=1, StartX=0, StartY=0, FinishX=100, FinishY=0);
}
/**//*****************************************************
 表头背景
*****************************************************
 表头背景
**************************** **************************/
.tabletop {}{
    背景图像: url(../images/tableTitle2 .gif);高度:25px;
}
/**//*****************************************************
大标题
*****************************************************
大标题
**************************** *************************/
.tabletitle{}{
   字体系列:“Arial”;字体大小:12pt ; 颜色:#0066cc;字体粗细:粗体;过滤器:progid:DXImageTransform.Microsoft.DropShadow(颜色=#CCFFFF,offX=1,offY=1,正值=true);
}
/**//*****************************************************
小标题
*****************************************************
小标题
**************************** *************************/
.smalltitle{}{    背景颜色:#E8E8E8;字体大小:12px;字体粗细:正常;颜色:#006699; } .calendarborder{}{    边框:1px #B7B7B7 solid; }

相关标签:
来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
最新问题
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板