diff options
Diffstat (limited to 'examples/6_English_matchingProductsAndWords/css/lesson.css')
| -rwxr-xr-x | examples/6_English_matchingProductsAndWords/css/lesson.css | 245 |
1 files changed, 37 insertions, 208 deletions
diff --git a/examples/6_English_matchingProductsAndWords/css/lesson.css b/examples/6_English_matchingProductsAndWords/css/lesson.css index 6bc2bdc..3fe81fa 100755 --- a/examples/6_English_matchingProductsAndWords/css/lesson.css +++ b/examples/6_English_matchingProductsAndWords/css/lesson.css @@ -1,147 +1,48 @@ -@CHARSET "ISO-8859-1";
@CHARSET "UTF-8";
/****** Page Styles ****/
-body {
- font-family: Verdana, Arial, Helvetica, sans-serif;
- font-size: 10pt;
- margin: 0px;
- background-color: #FFFFCC;
-}
-#header {
- background-image: url(../assets/image/bg_header.png);
- background-repeat: repeat-x;
- height: 89px;
- width: 100%;
- position: absolute;
- left: 0px;
- top: 0px;
-}
-#topbtn_left {
- float: left;
- height: 60px;
- width: 60px;
- padding-top: 13px;
- padding-left: 5px;
-}
-
-
- #linkBack{
- width: 60px; height: 59px;
- background:url(../assets/image/btn_back.png);
- }
- #linkBack:hover{
- background:url(../assets/image/btn_back_hover.png);
- }
-
-#lesson_title {
- float: left;
- font-family: Verdana, Arial, Helvetica, sans-serif;
- font-size: 16pt;
- font-weight: bold;
- color: #FFFFFF;
- margin-left: 10px;
- background-image: url(../assets/image/bg_title_block.png);
-}
-#topbtn_right {
- float: right;
- height: 60px;
- width: 60px;
- padding-top: 13px;
- padding-right: 5px;
-}
- #linkHelp{
- width: 60px; height: 60px;
- background:url(../assets/image/btn_help.png);
- }
- #linkHelp:hover{
- background:url(../assets/image/btn_help_hover.png);
- }
- #linkOle{
- width: 60px; height: 60px;
- background:url(../assets/image/btn_ole.png);
- }
- #linkOle:hover{
- background:url(../assets/image/btn_ole_hover.png);
- }
- #linkNext{
- width: 60px; height: 60px;
- background:url(../assets/image/btn_next.png);
- }
- #linkNext:hover{
- background:url(../assets/image/btn_next_hover.png);
- }
-#footer {
- background-image: url(../assets/image/bg_footer.png);
- background-repeat: repeat-x;
- position: absolute;
- height: 69px;
- width: 100%;
- left: 0px;
- bottom: 0px;
-}
-#score_box {
- float: left;
- padding-left: 10px;
- padding-top: 10px;
- font-family: Verdana, Arial, Helvetica, sans-serif;
- color: #FFFF00;
- font-size: 16pt;
- font-weight: bold;
-}
-#botbtn_right {
- float: right;
- height: 55px;
- width: 251px;
- padding-right: 5px;
- padding-top: 5px;
+
+#clickBox{
+ margin-top: -5px;
+ padding:4px;
+ border:2px dashed blue;
+ background-color:white;
+ color:black;
}
- #linkStart{
- width: 251px; height: 55px;
- background:url(../assets/image/btn_start.png);
- }
- #linkStart:hover{
- background:url(../assets/image/btn_start_hover.png);
- }
- #linkStart:active{
- background:url(../assets/image/btn_start_mouse_down.png);
- }
- #linkPlayAgain{
- width: 251px; height: 55px;
- background:url(../assets/image/btn_play_again.png);
- }
- #linkPlayAgain:hover{
- background:url(../assets/image/btn_play_again_hover.png);
- }
- #linkPlayAgain:active{
- background:url(../assets/image/btn_play_again_mouse_down.png);
- }
/**** End of the page style ****/
/**** Game Styles ****/
-a{
- color:white;
+#content a{
+ float:left;
+ width: 9em;
+ height: 9em;
+ padding: 0;
+ background-color: #99E6FF;
+ margin: 0 0.6em 0.6em 0;
+ text-align:center;
+ font-size: 6em/8em;
+ font-weight:bold;
+ color:black;
+
}
-#currentTitle{
- width: 150px;
- height: 80xp;
- font:25px/30px "Courier New", Courier, monospace;
- font-weight: bold;
- color: red;
+
+#content a>div{
+ margin: auto auto auto auto;
+ line-height: 9em;
}
+
#content{
- margin: 0px auto;
- margin-top: 90px;
- width: 95%;
- height: 375px;
-}
-#section{
- margin: 0px auto;
- width: 620px;
+ margin-top: 2em;
+ margin-right: auto;
+ margin-bottom: 0;
+ margin-left:auto;
+ width: 78%;
+ height: 100%;
}
+
#gameOver{
margin-top:150px;
text-align:center;
@@ -165,21 +66,11 @@ a{ }
+
.default{
float:left;
- width: 90px;
- height: 90px;
- background-color: #99E6FF;
- margin: 0.2em;
- text-align:center;
- font: 15px/85px Verdana, Geneva, Arial, Helvetica, sans-serif;
- font-weight:bold;
- color:black;
-}
-.showText{
- float:left;
- width: 90px;
- height: 90px;
+ width: 90px;
+ height: 90px;
background-color: #99E6FF;
margin: 0.2em;
text-align:center;
@@ -187,73 +78,11 @@ a{ font-weight:bold;
color:black;
}
+
.matched{
float:left;
- width: 90px;
- height: 90px;
+ width: 9.6em;
+ height: 9.6em;
background-color: blue;
}
-#timerBar {
- float: left;
- width: 215px;
- height:35px;
- padding-left: 10px;
- padding-top: 0px;
- font-family: Verdana, Arial, Helvetica, sans-serif;
- color: #FFFF00;
- font-size: 16pt;
- font-weight: bold;
-}
-#timerTitle{
- float: left;
- margin-top: 20px;
- width: 50px;
- height: 35px;
-}
-
-.timerBoxes{ /* Show the timer running after the game has began.... */
-float:right;
-margin: 0.5em 0 0 0.1em;
-width: 35px;
-height: 30px;
-border: 2px dotted green;
-padding: 3px;
-color: blue;
-font : bold 25px Arial Black, Times New Roman;
-background: #ACC;
-}
-
-#clickDisplay{
- float: left;
- width: 150px;
- height:35px;
- margin-left: 50px;
- padding-left: 20px;
- padding-top: 0px;
- font-family: Verdana, Arial, Helvetica, sans-serif;
- color: #FFFF00;
- font-size: 16pt;
- font-weight: bold;
-}
-#clickTitle{
- float: left;
- margin-top: 20px;
- width: 50px;
- height: 35px;
-
-}
-
-#clickBox{
-float:right;
-margin: 0.5em 0 0 0.1em;
-height: 30px;
-border: 2px dotted green;
-padding: 3px;
-color: red;
-font : bold 25px Arial Black, Times New Roman;
-background: #ACC;
-}
-
-
-
|