Making Common CSS instances for Web Learning

 

/** // * Button style */
. Buttoncss {}{
Font-family: "tahoma", "";
Font-size: 9pt, color: #003399;
Border: 1px #003399 solid;
Color: 006699;
Border-bottom: #93bee2 1px solid;
Border-left: #93bee2 1px solid;
Border-Right: #93bee2 1px solid;
Border-top: #93bee2 1px solid;
Background-image: URL (../images/bluebuttonbg.gif );
Background-color: # e8f4ff;
Cursor: hand;
Font-style: normal;
Width: 60px;
Height: 22px;
}

/** // * Blue button style */
. Bluebuttoncss {}{
Font-family: "tahoma", "";
Font-size: 9pt, color: #003366;
Border: 0px #93bee2 solid;
/** // * Border-bottom: #93bee2 1px solid;
Border-left: #93bee2 1px solid;
Border-Right: #93bee2 1px solid;
Border-top: #93bee2 1px solid ;*/
Background-image: URL (../images/blue_button_bg.gif );
Background-color: # ffffff;
Cursor: hand;
Font-style: normal;
}

/** // * Red button style */
. Redbuttoncss {}{
Font-family: "tahoma", "";
Font-size: 9pt; color: # 0066cc;
Border: 1px #93bee2 solid;
Border-bottom: #93bee2 1px solid;
Border-left: #93bee2 1px solid;
Border-Right: #93bee2 1px solid;
Border-top: #93bee2 1px solid;
Background-image: URL (../images/redbuttonbg.gif );
Background-color: # ffffff;
Cursor: hand;
Font-style: normal;
}
/** // * Select the button style */
. Selectbuttoncss
{}{
Font-family: "tahoma", "";
Font-size: 9pt; color: # 0066cc;
Border: 1px #93bee2 solid;
Border-bottom: #93bee2 1px solid;
Border-left: #93bee2 1px solid;
Border-Right: #93bee2 1px solid;
Border-top: #93bee2 1px solid;
Background-image: URL (../images/blue_button_bg.gif );
Background-color: # ffffff;
Cursor: hand;
Font-style: normal;
}

/** // * Green button style */
. Greenbuttoncss {}{
Font-family: "tahoma", "";
Font-size: 9pt; color: # 0066cc;
Border: 1px #93bee2 solid;
Border-bottom: #93bee2 1px solid;
Border-left: #93bee2 1px solid;
Border-Right: #93bee2 1px solid;
Border-top: #93bee2 1px solid;
Background-image: URL (../images/greenbuttonbg.gif );
Background-color: # ffffff;
Cursor: hand;
Font-style: normal;
}
/** // * Image button */
. Imagebutton
{}{
Cursor: hand;/** // * change the Mouse shape */
}
/** // * Page body style */
Body
{}{
Scrollbar-face-color: # ededf3;
Scrollbar-Highlight-color: # ffffff;
Scrollbar-shadow-color: # 93949f;
Scrollbar-3dlight-color: # ededf3;
Scrollbar-arrow-color: #082468;
Scrollbar-track-color: # f7f7f9;
Scrollbar-darkshadow-color: # ededf3;

Font-size: 9pt;
Color: #003366;
Overflow: auto;
}
TD {}{ font-size: 12px}
Th
{}{
Font-size: 12px;
}
/**//*********************************** **
Show style in the drop-down box
*************************************/
Select
{}{
Border-Right: #000000 1px solid;
Border-top: # ffffff 1px solid;
Font-size: 12px;
Border-left: # ffffff 1px solid;
Color: #003366;
Border-bottom: #000000 1px solid;
Background-color: # f4f4f4;
}

/**//*********************************** ******************
Hyperlink display style
**************************************** *************/
A: Link, A: visited {}{ color: #223355; text-Decoration: None}
A: hover {}{ color: red; text-Decoration: none ;}

A. highlight: Link, A. highlight: visited {}{ color: red; text-Decoration: None}
A. highlight: hover {}{ color: red; 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}
A. navlink: hover {}{ color: # ffffff; text-Decoration: None}

/**//*********************************** ******************
Display style of line text editing box
**************************************** *************/
. Editbox
{}{
Background: # ffffff;
Border: 1px solid # b7b7b7;
Color: #003366;
Cursor: text;
Font-family: "Arial ";
Font-size: 9pt;
Height: 18px;
Padding: 1px;
}
/**//*********************************** *****************
Multi-line text box style
**************************************** *************/
. 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-family: "Arial ";
Font-size: 9pt;
Padding: 1px;
}

/**//*********************************** ******************
Shadow form
**************************************** *************/
. Shadow
{}{
Position: absolute;
Z-index: 1000;
Top: 0px;
Left: 0px;
Background: Gray;
Background-color: # ffcc00;
Filter: progid: DXImageTransform. Microsoft. dropshadow (color = # ff404040, offx = 2, offy = 2, positives = true );
}
/**//*********************************** ******************
Only display the text style of a horizontal line!
**************************************** *************/
. Logintxt
{}{
Border-Right: # ffffff 0px solid;
Border-top: # ffffff 0px solid;
Font-size: 9pt;
Border-left: # ffffff 0px solid;
Border-bottom: # c0c0c0 1px solid;
Background-color: # ffffff
}
/**//*********************************** ******************
DataGrid Header style
**************************************** *************/
. Dgtitle
{}{
Height: 25px;
Color: # ffffff;
Font-size: large;
Text-align: center;
Vertical-align: middle;
Background-image: URL (../images/tabletitle2.gif); Height: 25px

}

/**//*********************************** ******************
DataGrid data display style
**************************************** *************/
. Dgitem
{}{
Height: 15px;
Text-align: center;
Vertical-align: middle;
}
/**//*********************************** ******************
Text Box display style
**************************************** *************/
. Clarity
{}{
Border-Right: # ffffff 0px solid;
Border-top: # ffffff 0px solid;
Font-size: 9pt;
Border-left: # ffffff 0px solid;
Border-bottom: # ffffff 0px solid;
}
Table. List {}{ border-top: 1px solid #000000; border-bottom: 1px solid #000000 ;}
Table. list th, table. list TD {}{ padding: 4px; Background-color: # eeeeee; border-bottom: 2px solid # ffffff; border-Right: 1px solid # ffffff; border-left: 1px solid # ffffff; color: #000000}
Table. List th {}{ background-color: #0064a8; border-top: 2px solid # ffffff; color: # ffffff; font-weight: normal ;}
Table. List th A: link {}{ color: # ffffff; text-Decoration: None}
Table. List th A: visited {}{ color: # ffffff; text-Decoration: None}
Table. List th A: hover {}{ color: # ffffff; text-Decoration: underline}

Table. form th, table. form TD {}{ padding: 4px; Background-color: # f6f6f6; border-bottom: 1px solid # f6f6f6; border-Right: 1px solid # ffffff; border-left: 1px solid # ffffff; color: #000000}
Table. form th {}{ background-color: # e8e8e8; border-top: 1px solid # ffffff; color: #006699; font-size: 12px; font-weight: normal; border-bottom: 1px ;}
Table. Form th A: link {}{ color: # ffffff; text-Decoration: None}
Table. Form th A: visited {}{ color: # ffffff; text-Decoration: None}
Table. Form th A: hover {}{ color: # ffffff; text-Decoration: underline}

Table. sample TD {}{ padding: 2px; Background-color: # f6f6f6; border-bottom: 1px solid #000000; border-top: 1px solid #000000; border-right: 1px solid #000000; border-left: 1px solid #000000; color: #000000}
Table. sample th {}{ background-color: # 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 {}{ padding: 2px; border-bottom: 1px solid #000000; border-top: 1px solid #000000; border-Right: 1px solid #000000; border-left: 1px solid #000000; color: #000000}
Table. sampled th {}{ 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. form1 th, table. form1 TD {}{ padding: 4px; Background-color: # bed8f3; border-bottom: 1px solid # ffffff; border-Right: 1px solid # ffffff; border-left: 1px solid # ffffff; color: #000000}
/**//*********************************** ******************
Input box without Borders
**************************************** *************/
. Noneinput
{}{
Text-align: center;
Width: 99%; Height: 99%;
Border-top-style: none;
Border-right-style: none;
Border-left-style: none;
Background-color: # f6f6f6;
Border-bottom-style: none;
}

/**//*********************************** ******************
Flat style form styles
**************************************** *************/

 

/**//*********************************** ******************/
Table
{}{
Border-collapse: collapse;
}

/**//*
Progress bar style
*/
. Bi-loading-status {}{
/** // * Position: absolute ;*/
Width: 150px;
Padding: 1px;
Overflow: hidden;
Background-color: Gray;
}

 

. Bi-loading-status. Text {}{
White-space: nowrap;
Overflow: hidden;
Width: 100%;
Text-overflow: ellipsis;
Padding: 1px;
}
 

. Bi-loading-status. Progress-bar {}{
Border: 1px solid threedshadow;
Background: window;
Height: 10px;
Width: 100%;
Padding: 1px;
Overflow: hidden;
}
 

. Bi-loading-status. Progress-bar Div {}{
Background: highlight;
Overflow: hidden;
Height: 100%;
Filter: alpha (opacity = 0, finishopacity = 100, style = 1, startx = 0, starty = 0, finishx = 100, finishy = 0 );
}
/**//*********************************** ******************
Header background
**************************************** *************/
. Tabletop {}{
Background-image: URL (../images/tabletitle2.gif); Height: 25px;
}
/**//*********************************** ******************
Title
**************************************** *************/
. Tabletitle {}{
Font-family: "Arial"; font-size: 12pt; color: # 0066cc; font-weight: bolder; filter: progid: DXImageTransform. microsoft. dropshadow (color = # ccffff, offx = 1, offy = 1, positives = true );
}
/**//*********************************** ******************
Subtitles
**************************************** *************/
. Smalltitle {}{
Background-color: # e8e8e8; font-size: 12px; font-weight: normal; color: #006699;
}
. Calendarborder {}{
Border: 1px # b7b7b7 solid;
}