Use the attached handout and the files to complete Tutorial 1
this is the project styles below.
body{background-color:Gray;} /*This sets the style of the table that includes the top links table,*/ /*including the table, the link element <a> and the cell element <td> */ .top_links { width:670px; border:1px solid #663300; font:normal small-caps; text-align:center; margin:0px 0px 0px auto; padding:0px } .top_links a{text-decoration:none; color:#663300; font-weight:bold} .top_links td{ background-color:silver; border-left:1px solid #663300} .top_links td:hover a{color:#FFCC99} .top_links td:hover{background-color:#663300} /*This table includes all contents of the page: the menus and the main area*/ .outerTable { border:1px solid #663300; background-color:White; margin:30px auto 10px auto; width:860px; padding:0px; } /*This table includes the left menu and the right section, */ /*where the main contents of the page is*/ .contents_table { width:860px; padding:10px } /*This table includes only the left menu*/ .contents_table_left { width:180px; vertical-align:top; } /*This sets the styles of the left menu, inluding the table, */ /*the button elements <input>, the cell elements <td>, and the top cell*/ .left_menu{width:150px; text-align:center} .left_menu input {width:80px} .left_menu td {padding:5px} .left_menu td#left_menu_top { font-size:smaller; font-weight:bold; color:White; background-color:#804141; padding-bottom:10px; padding-top:10px } /*This table includes the right section of the page with contents*/ .contents_table_right { width:680px; } /*This sets the styles of the footer and the link elements <a> of the footer*/ .bottom_menu { width: 450px; font-size:smaller; font-weight:bold; color:#FFCC99; margin:0px auto 0px auto } .bottom_menu a{color:#FFCC99;} /*This is the style of the six panels on the Calalog page that contain product info*/ .panel_styles { width:200px; height:200px; display:block; float:left; } .panel_styles img { border:none; }


0 comments