Arnor
究極の素還尊
註冊時間: 2001-11-07
文章: 12905
來自: TAIWAN
|
 發表於: 星期六 六月 27, 2020 9:35 pm 文章標題: Webmail 的 CSS 分享專區 |
 |
|
最近對 CSS 有多做了一些研究及了解，玩了一些玩意兒，感覺還不賴，驚覺 CSS 真的博大精深，故拋磚引玉，分享一個 CSS 給各位，如果您對此也有所研究過，歡迎您分享自己的創作。
截圖:
style.css 內容為:
| 代碼: |
<!--
#raidenLogo{
width: 320;
filter: progid:DXImageTransform.Microsoft.MotionBlur(direction=135,strength=15);
}
body{
margin: 0px;
padding: 2px;
font-family: Arial, PMingLiU, Microsoft JhengHei, serif, sans-serif;
font-size: 16px;
background-color: white;
line-height: 15px;
}
body#addressBook{
background-image: url("BG_addressBook.jpg");
background-repeat: repeat-x;
background-attachment: fixed;
background-color: #4891C4;
background-position: bottom;
}
body#addressBook tr td{
color: black;
}
td{
font-family: Arial, PMingLiU, Microsoft JhengHei, serif, sans-serif;
font-size: 16px;
color: black;
}
form{
margin: 0px;
padding: 0px;
}
li{
list-style: none;
padding: 2px;
}
.tblStyle{
border-bottom: double 3px #816A65;
}
.tblStyle_top{
border-bottom: solid 1px #336699;
background-color: #336699;
}
.tblStyle2{
border: outset 2px #e0e0e0;
TABLE-LAYOUT: fixed;
word-wrap: break-word;
}
.menuStyle{
background-color: #4791c5;
width: 100%;
FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=#8BBFE5,endColorStr=#D4ECFA);
}
a{
color: blue;
}
a:link {
text-decoration: none;
}
a:visited {
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
a:active {
text-decoration: underline;
}
a.menuLink{
color: white;
text-decoration: none;
}
a.menuLink:hover{
color: ;
text-decoration: underline;
}
a.noLink{
cursor: hand;
text-decoration: none;
font-family: Arial, PMingLiU, Microsoft JhengHei, serif, sans-serif;
font-size: 16px;
color: black;
}
.folder{
cursor: pointer;
text-decoration: none;
font-family: Arial, PMingLiU, Microsoft JhengHei, serif, sans-serif;
font-size: 16px;
color: darkblue;
white-space: nowrap;
}
.copyright{
font-family: Arial, PMingLiU, Microsoft JhengHei, serif, sans-serif;
font-size: 9px;
color: white;
cursor: default;
}
#loginCopyright{
position: relative;
top: 50%;
margin-top: 205;
font-family: verdana;
font-size: 9px;
color: #336699;
}
#folderBody{
font-family: Arial, PMingLiU, Microsoft JhengHei, serif, sans-serif;
font-size: 16px;
border: solid 1px white;
background-color: #dbeaf5;
padding: 10px;
color: black;
}
#listBody{
background: white;
font-family: Arial, PMingLiU, Microsoft JhengHei, serif, sans-serif;
font-size: 16px;
padding: 2px;
text-decoration: none;
}
.tblTitle{
border: outset 1px #A79B82;
background: #a0a0a0;
text-align: center;
color: black;
}
.tblTitle2{
border: none 1px;
background: #76A5C7;
padding-left: 5px;
color: white;
}
.tblRowStyle{
background: #EBEBEB;
border: none 2px white;
color: black;
border-bottom:1px #aba8a1 solid;
}
.tblRowStyle:hover > td{
background: #e3e1e1;
border: none 2px white;
color: black;
border-bottom:1px #aba8a1 solid;
}
.fontStyle{
color: black;
}
.tblRowStyle2{
background: #EBEBEB;
border: none 2px white;
color: black;
}
.tblRowStyle2{
background: #EBEBEB;
border: none 2px white;
color: black;
border-bottom:1px #aba8a1 solid;
}
.time{
font-family: arial;
font-size: 12px;
}
.funcOfList{
//position: fixed;
//top: 60px;
//left: 0px;
//right: 0px;
border-bottom: solid 1px black;
padding: 10px;
//background-color: black;
}
.listInfo{
margin: 3px;
border: dashed 1px black;
padding: 3px;
color: black;
background-color: #dbeaf5;
letter-spacing: 1px;
line-height: 18px;
font-family: Arial, PMingLiU, Microsoft JhengHei, serif, sans-serif;
font-size: 16px;
text-decoration: none;
}
.listInfoNum{
color: red;
}
.pathStyle{
font-family: verdana;
color: blue;
}
.btn , .btn:active{
border-width: 1px;
border-color: #B2CFFB;
font-family: Tahoma, verdana;
font-size: 14px;
background-color: #D8D5B9;
color: black;
FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=#c0c0c0,endColorStr=#e0e0e0);
}
.btn_green , .btn_green:active{
border-width: 1px;
border-color: #B2CFFB;
font-family: Tahoma, Microsoft Sans Serif;
font-size: 14px;
background: #D8D5B9;
color: black;
FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=#c0c0c0,endColorStr=#e0e0e0);
}
.btn_red , .btn_red:active{
border-width: 1px;
border-color: #B2CFFB;
font-family: Tahoma, Microsoft Sans Serif;
font-size: 14px;
background: #D8D5B9;
color: black;
FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=#c0c0c0,endColorStr=#e0e0e0);
}
.btn_black, .btn_black:active{
border-width: 1px;
border-color: #B2CFFB;
font-family: Tahoma, Microsoft Sans Serif;
font-size: 14px;
background: #D8D5B9;
color: black;
FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=#c0c0c0,endColorStr=#e0e0e0);
}
.hostFont{
color: white;
}
.txt {
border: solid 1px #B2CFFB;
font-family: Arial, PMingLiU, Microsoft JhengHei, serif, sans-serif;
font-size: 16px;
color: darkblue;
background: white;
}
.mailbody{
border: solid 1px #B2CFFB;
font-family: Arial, PMingLiU, Microsoft JhengHei, serif, sans-serif;
font-size: 16px;
color: darkblue;
background: white;
}
.menuItem {
background-color: menu;
padding: 3px;
}
.highlightItem {
background-color: highlight;
color: white;
padding: 3px;
}
#loginDiv{
width: 100%;
height: 450;
position: absolute;
top: 50%;
margin-top: -200;
background-color: #4791c5;
border-top: double 4px #336699;
border-bottom: double 4px #336699;
}
#normalDiv{
display:;
}
#autoreplyDiv{
display: none;
}
#memoDiv{
display: none;
}
#addressDiv{
display: none;
}
#blacklistDiv{
display: none;
}
#pop3Div{
display: none;
}
#passDiv{
display: none;
}
.tabMenuHighlight{
background-color: #EBEBEB;
border: outset 2px #EBEBEB;
color: black;
padding-left: 3px;
cursor: hand;
width: 100%;
text-align: center;
}
.tabMenu{
background-color: gray;
border: inset 2px buttonface;
color: #d0d0d0;
padding-left: 3px;
cursor: hand;
width: 100%;
text-align: center;
}
.tabMain{
border: groove 2px #EBEBEB;
background-color: #EBEBEB;
padding: 5px;
}
.memo{
background: #dbeaf5;
border: solid 1px #B2CFFB;
font-family: Arial, PMingLiU, Microsoft JhengHei, serif, sans-serif;
font-size: 16px;
color: black;
}
.headerStyle{
width: 100%;
height: 100%;
background-color: #AB7B89;
font-family: Arial, PMingLiU, Microsoft JhengHei, serif, sans-serif;
font-size: 16px;
color: white;
padding: 5px;
}
.hrStyle{
}
.logoutBG{
background-image: url("BG_logout.jpg");
width: 380;
height: 220;
}
.logoutBG tr td{
font-family: Arial, PMingLiU, Microsoft JhengHei, serif, sans-serif;
font-size: 32px;
font-weight: bold;
color: white;
}
.loginBG{
background-image: url("BG_login.jpg");
width: 380;
height: 220;
}
.loginBG tr td{
color: white;
}
.information{
width:100%;
font-family: Arial, PMingLiU, Microsoft JhengHei, serif, sans-serif;
font-size:16px;
color: black;
background-color: ;
text-align: left;
}
.uploadBG{
background-image: url("BG_upload.jpg");
color: white;
}
.uploadBG table tr td{
color: white;
}
pre {
white-space: pre-wrap; /* css-3 */
white-space: -moz-pre-wrap !important; /* Mozilla, since 1999 */
white-space: -pre-wrap; /* Opera 4-6 */
white-space: -o-pre-wrap; /* Opera 7 */
word-wrap: break-word; /* Internet Explorer 5.5+ */
}
.thumbnail {
height: 100px;
}
input[type=checkbox] {
-ms-transform: scale(1.5); /* IE */
-moz-transform: scale(1.5); /* FF */
-webkit-transform: scale(1.5); /* Safari and Chrome */
-o-transform: scale(1.5); /* Opera */
padding: 5px;
margin: 5px;
}
input[type="button"], input[type="reset"], input[type="submit"], input[type="textarea"] {
-moz-box-shadow:inset 0px 1px 0px 0px #ffffff;
-webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;
box-shadow:inset 0px 1px 0px 0px #ffffff;
background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #f5f5f4), color-stop(1, #dededd) );
background:-moz-linear-gradient( center top, #f5f5f4 5%, #dededd 100% );
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f5f5f4', endColorstr='#dededd');
border:1px solid #cdcdc6;
background-color:#dbdbdb;
-moz-border-radius:3px;
-webkit-border-radius:3px;
border-radius:3px;
display:inline-block;
color:black !important;
font-family: Arial, PMingLiU, Microsoft JhengHei, serif, sans-serif;
font-size:16px;
font-weight:normal;
padding:3px 12px;
text-decoration:none;
}
input[type="text"], select, textarea, input[type="password"] {
-moz-box-shadow:inset 0px 1px 0px 0px #ffffff;
-webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;
box-shadow:inset 0px 1px 0px 0px #ffffff;
background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, white), color-stop(1, white) );
background:-moz-linear-gradient( center top, #f5f5f4 5%, #dededd 100% );
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=white, endColorstr=white);
border:1px solid #cdcdc6;
-moz-border-radius:6px;
-webkit-border-radius:6px;
border-radius:6px;
display:inline-block;
color:black !important;
font-family: Arial, PMingLiU, Microsoft JhengHei, serif, sans-serif;
font-size:16px;
font-weight:normal;
text-decoration:none;
}
-->
|
_________________
*若是想問問題的話, 請務必不要塗改任何 IP, 網域資料, 您若不願貼上IP或網域, 請改以電子郵件來詢問. 謝謝您的配合.*
*若是回報疑似軟體的運行或邏輯或資料處理有誤的問題, 小弟很樂意去了解您的情況, 但請務必以最新版來做回報, 如果以郵件詢問, 請參考 http://www.raidenmaild.com/tw/feedback.html 的說明, 最好標題加個 RaidenMAILD 字樣, 才不致會遺漏了您的信唷. 謝謝您的配合^^*
*在版上發文請遵守網路禮儀, 並請持著虛心敘述問題請教他人, 凡發現違反的文, 均一律刪除為優先, 不另行通知喔.
*與使用者教學相長腦力激盪是我輩成就感的來源, 誠心希望您能不吝指教.
*雷電MAILD 知識庫文件 http://www.raidenmaild.com/tw/kb/
素還尊
Team John Long.
Email: arnor@raidenmaild.com
公司網站 http://www.raidenmaild.com/company/ |
|
