梦想飞翔 - 2006
记录生活,记录点滴~
首页
生活点滴
影音娱乐
游戏生活
学习相关
标签
留言本
搜索
Dec
31
[转载]常用的css样式
学习
/**//*按钮样式*/ .buttoncss { background: #E8F4FF url(../Images/bluebuttonbg.gif); border: 1px #003399 solid; border-bottom: #93BEE2 1px solid; border-left: #93BEE2 1px solid; border-right: #93BEE2 1px solid; border-top: #93BEE2 1px solid; color: #003399; color: 006699; cursor: hand; font: normal 9pt "Tahoma", "宋体"; height: 22px; width: 60px; } /**//*蓝色按钮样式*/ .bluebuttoncss { background: #FFFFFF url(../Images/blue_button_bg.gif); border: 0px #93BEE2 solid; /**/ color: #003366; cursor: hand; font: normal 9pt "Tahoma", "宋体"; } /**//*红色按钮样式*/ .redbuttoncss { background: #FFFFFF url(../Images/redbuttonbg.gif); border: 1px #93BEE2 solid; border-bottom: #93BEE2 1px solid; border-left: #93BEE2 1px solid; border-right: #93BEE2 1px solid; border-top: #93BEE2 1px solid; color: #0066CC; cursor: hand; font: normal 9pt "Tahoma", "宋体"; } /**//*选择按钮样式*/ .selectbuttoncss { background: #FFFFFF url(../Images/blue_button_bg.gif); border: 1px #93BEE2 solid; border-bottom: #93BEE2 1px solid; border-left: #93BEE2 1px solid; border-right: #93BEE2 1px solid; border-top: #93BEE2 1px solid; color: #0066CC; cursor: hand; font: normal 9pt "Tahoma", "宋体"; } /**//*绿色按钮样式*/ .greenbuttoncss { background: #FFFFFF url(../Images/greenbuttonbg.gif); border: 1px #93BEE2 solid; border-bottom: #93BEE2 1px solid; border-left: #93BEE2 1px solid; border-right: #93BEE2 1px solid; border-top: #93BEE2 1px solid; color: #0066CC; cursor: hand; font: normal 9pt "Tahoma", "宋体"; } /**//*图像按钮*/ .imagebutton { cursor: hand; /**/ } /**//*页面正文样式*/ body { color: #003366; font-size: 9pt; overflow: auto; scrollbar-3dlight-color: #EDEDF3; scrollbar-arrow-color: #082468; scrollbar-darkshadow-color: #EDEDF3; scrollbar-face-color: #EDEDF3; scrollbar-highlight-color: #FFFFFF; scrollbar-shadow-color: #93949F; scrollbar-track-color: #F7F7F9; } /**//************************************* 下拉选择框显示风格 *************************************/ select { background: #F4F4F4; border-bottom: #000000 1px solid; border-left: #FFFFFF 1px solid; border-right: #000000 1px solid; border-top: #FFFFFF 1px solid; color: #003366; font-size: 12px; } /**//***************************************************** 超级链接显示风格 *****************************************************/ a:link, a:visited{ color: #223355; text-decoration: none; } a.highlight:hover { color: #FF0000; text-decoration: underline; } a.thisclass:link, a.thisclass:visited { color: #D9EBFD; font-weight: bold; text-decoration: none; } a.thisclass:hover { color: #FFFFFF; font-weight: bold; } a.navlink:link, a.navlink:visited { color: #D9EBFD; text-decoration: none; } /**//***************************************************** 线条文本编辑框显示风格 *****************************************************/ .editbox { background: #FFFFFF; border: 1px solid #B7B7B7; color: #003366; cursor: text; font: 9pt "Arial"; height: 18px; padding: 1px; } /**//**************************************************** 多行文本框样式 *****************************************************/ .multieditbox { background: #F8F8F8; border-bottom: #B7B7B7 1px solid; border-left: #B7B7B7 1px solid; border-right: #B7B7B7 1px solid; border-top: #B7B7B7 1px solid; color: #000000; cursor: text; font: 9pt "Arial"; padding: 1px; } /**//***************************************************** 阴影风格的表单 *****************************************************/ .shadow { background: #808080; background: #FFCC00; filter: progid:DXImageTransform.Microsoft.DropShadow(color=#FF404040,offX=2,offY=2,positives=true); left: 0px; position: absolute; top: 0px; z-index: 1000; } /**//***************************************************** 只显一条横线的Text的样式! *****************************************************/ .logintxt { background: #FFFFFF; border-bottom: #C0C0C0 1px solid; border-left: #FFFFFF 0px solid; border-right: #FFFFFF 0px solid; border-top: #FFFFFF 0px solid; font-size: 9pt; } /**//***************************************************** DataGrid页眉样式 *****************************************************/ .dgtitle { background: url(../images/tableTitle2.gif); color: #FFFFFF; font-size: large; height: 25px; height: 25px; text-align: center; vertical-align: middle; } /**//***************************************************** DataGrid数据显示样式 *****************************************************/ .dgitem { height: 15px; text-align: center; vertical-align: middle; } /**//***************************************************** 文本框显示样式 *****************************************************/ .clarity { border-bottom: #FFFFFF 0px solid; border-left: #FFFFFF 0px solid; border-right: #FFFFFF 0px solid; border-top: #FFFFFF 0px solid; font-size: 9pt; } table.list { border-bottom: 1px solid #000000; border-top: 1px solid #000000; } table.list th,table.list td { background: #EEEEEE; border-bottom: 2px solid #FFFFFF; border-left: 1px solid #FFFFFF; border-right: 1px solid #FFFFFF; color: #000000; padding: 4px; } table.list th { background: #0064A8; border-top: 2px solid #FFFFFF; color: #FFFFFF; font-weight: normal; } table.form th,table.form td { background: #F6F6F6; border-bottom: 1px solid #F6F6F6; border-left: 1px solid #FFFFFF; border-right: 1px solid #FFFFFF; color: #000000; padding: 4px; } table.form th { background: #E8E8E8; border-bottom: 1px; border-top: 1px solid #FFFFFF; color: #006699; font-size: 12px; font-weight: normal; } table.sample td { background: #F6F6F6; border-bottom: 1px solid #000000; border-left: 1px solid #000000; border-right: 1px solid #000000; border-top: 1px solid #000000; color: #000000; padding: 2px; } table.sample th { background: #AEC1D7; border-bottom: 1px solid #000000; border-left: 1px solid #000000; border-right: 1px solid #000000; border-top: 1px solid #000000; color: #000000; font-weight: normal; } table.sampled td { border-bottom: 1px solid #000000; border-left: 1px solid #000000; border-right: 1px solid #000000; border-top: 1px solid #000000; color: #000000; padding: 2px; } table.sampled th { border-bottom: 1px solid #000000; border-left: 1px solid #000000; border-right: 1px solid #000000; border-top: 1px solid #000000; color: #000000; font-weight: normal; } table.form1 th,table.form1 td { background: #BED8F3; border-bottom: 1px solid #FFFFFF; border-left: 1px solid #FFFFFF; border-right: 1px solid #FFFFFF; color: #000000; padding: 4px; } /**//***************************************************** 没有边框的输入框 *****************************************************/ .noneinput { background: #F6F6F6; border-bottom-style: none; border-left-style: none; border-right-style: none; border-top-style: none; height: 99%; text-align: center; width: 99%; } /**//***************************************************** 扁平风格的表单样式 *****************************************************/ /**//*****************************************************/ table { border-collapse: collapse; } /**//* 进度条样式 */ .bi-loading-status { background: #808080; overflow: hidden; padding: 1px; width: 150px; /*position: absolute;*/ } .bi-loading-status .text { overflow: hidden; padding: 1px; text-overflow: ellipsis; white-space: nowrap; width: 100%; } .bi-loading-status .progress-bar { background: window; border: 1px solid ThreeDShadow; height: 10px; overflow: hidden; padding: 1px; width: 100%; } .bi-loading-status .progress-bar div { background: Highlight; filter: Alpha(Opacity=0, FinishOpacity=100, Style=1, StartX=0, StartY=0, FinishX=100, FinishY=0); height: 100%; overflow: hidden; } /**//***************************************************** 表头背景 *****************************************************/ .tabletop { background: url(../images/tableTitle2.gif); height: 25px; } /**//***************************************************** 大标题 *****************************************************/ .tabletitle{ color: #0066CC; filter: progid:DXImageTransform.Microsoft.DropShadow(color=#CCFFFF,offX=1,offY=1,positives=true); font: bolder 12pt "Arial"; } /**//***************************************************** 小标题 *****************************************************/ .smalltitle{ background: #E8E8E8; color: #006699; font-size: 12px; font-weight: normal; } .calendarborder{ border: 1px #B7B7B7 solid; } td, th { font-size: 12px; } a:hover, a.highlight:link, a.highlight:visited { color: #FF0000; text-decoration: none; } table.list th a:hover, table.form th a:hover { color: #FFFFFF; text-decoration: underline; } table.list th a:visited, table.form th a:link, table.form th a:visited, a.navlink:hover, table.list th a:link { color: #FFFFFF; text-decoration: none; }
tags:
to "[转载]常用的css样式"
Leave a Reply
名称(*)
邮箱
网站链接
验证(*)
正文(*)(留言最长字数:1000)
记住我,下次回复时不用重新输入个人信息
网站分类
最新评论及回复
文章归档
Meta
Admin
Entries (RSS)
Comments (RSS)
Z-Blog
最新评论及回复