Team:UC Chile/style
From 2012.igem.org
(Difference between revisions)
(Created page with "<html><style type="text/css"> - →BE SURE TO INCLUDE THE CSS RESET FOUND IN THE DEMO PAGE'S CSS: /*------------------------------------*\ NAV \*-------------------------------...") |
|||
(136 intermediate revisions not shown) | |||
Line 1: | Line 1: | ||
<html><style type="text/css"> | <html><style type="text/css"> | ||
- | /* | + | /*------------------------------------*\ |
+ | RESET | ||
+ | \*------------------------------------*/ | ||
+ | |||
+ | //From DTU-DENMARK 2011 -> Thanks guys! | ||
+ | |||
+ | #contentSub, #search-controls, .firstHeading, #footer-box, #catlinks, #p-logo { | ||
+ | display:none;} | ||
+ | #top-section { | ||
+ | border: none; | ||
+ | height: 0px;} | ||
+ | #content { | ||
+ | border: none;} | ||
+ | /* Removes "teams" from the menubar */ | ||
+ | #menubar > ul > li:last-child { | ||
+ | display: none;} | ||
+ | /* Resizes the menubar to fik the links (default is 400px) */ | ||
+ | #menubar { | ||
+ | width: auto;} | ||
+ | // Eliminating iGEM Stuff | ||
+ | |||
+ | #contentSub { | ||
+ | display:none; | ||
+ | } | ||
+ | |||
+ | #bodyContent{ | ||
+ | background: white; | ||
+ | color: black; | ||
+ | } | ||
+ | |||
+ | #siteSub { | ||
+ | display:none; | ||
+ | } | ||
+ | |||
+ | #search-controls { | ||
+ | display:none; | ||
+ | } | ||
+ | |||
+ | .firstHeading { | ||
+ | display:none; | ||
+ | } | ||
+ | |||
+ | #search-controls { | ||
+ | margin-top:30px; | ||
+ | } | ||
+ | |||
+ | #footer-box { | ||
+ | display:none; | ||
+ | } | ||
+ | |||
+ | /* GENERAL CONFIGURATION */ | ||
+ | |||
+ | body { | ||
+ | background: #145224; /* defines the default background color of the document*/ | ||
+ | |||
+ | /* background-image:url('https://static.igem.org/mediawiki/2012/1/1d/B_image.png'); */ | ||
+ | |||
+ | color: white; /* defines the default font-color of the document*/ | ||
+ | |||
+ | } | ||
+ | a { | ||
+ | color: blue; /* defines the default color of links */ | ||
+ | } | ||
+ | a:hover { | ||
+ | color: red; /* defines the default color of links hovered by the cursor */ | ||
+ | } | ||
+ | |||
/*------------------------------------*\ | /*------------------------------------*\ | ||
NAV | NAV | ||
\*------------------------------------*/ | \*------------------------------------*/ | ||
+ | #navbar{ | ||
+ | width: 100%; | ||
+ | height: 33px; | ||
+ | background-color: #333; | ||
+ | border-top: 1px solid white; | ||
+ | } | ||
+ | |||
#nav{ | #nav{ | ||
list-style:none; | list-style:none; | ||
- | |||
- | |||
- | |||
float:left; | float:left; | ||
width:100%; | width:100%; | ||
- | + | font-weight: bold; | |
position:relative; | position:relative; | ||
z-index:5; | z-index:5; | ||
- | |||
} | } | ||
#nav li{ | #nav li{ | ||
float:left; | float:left; | ||
- | margin-right: | + | margin-right:0px; |
- | + | top: 0px; | |
+ | position:relative; | ||
+ | width: 110px; | ||
+ | |||
} | } | ||
#nav a{ | #nav a{ | ||
display:block; | display:block; | ||
- | |||
color:#fff; | color:#fff; | ||
- | + | padding: 5px; | |
text-decoration:none; | text-decoration:none; | ||
} | } | ||
Line 34: | Line 105: | ||
text-decoration:underline; | text-decoration:underline; | ||
} | } | ||
- | + | #nav li: hover{ | |
+ | border-bottom: 1px solid white; | ||
+ | z-index:2; | ||
+ | } | ||
/*--- DROPDOWN ---*/ | /*--- DROPDOWN ---*/ | ||
#nav ul{ | #nav ul{ | ||
- | background:#fff; | + | background:#fff; |
- | + | ||
list-style:none; | list-style:none; | ||
position:absolute; | position:absolute; | ||
left:-9999px; /* Hide off-screen when not needed (this is more accessible than display:none;) */ | left:-9999px; /* Hide off-screen when not needed (this is more accessible than display:none;) */ | ||
+ | border-bottom: 1px solid black; | ||
+ | |||
} | } | ||
+ | |||
#nav ul li{ | #nav ul li{ | ||
- | |||
float:none; | float:none; | ||
} | } | ||
#nav ul a{ | #nav ul a{ | ||
- | |||
} | } | ||
- | #nav li:hover ul{ | + | #nav li:hover ul{ |
- | left: | + | left:0px; |
+ | top: 0px; | ||
+ | margin-top: 29px; | ||
} | } | ||
- | #nav li:hover a{ | + | #nav li:hover a{ |
- | background:# | + | background: #111; |
- | text-decoration: | + | text-decoration:none; |
} | } | ||
#nav li:hover ul a{ /* The persistent hover state does however create a global style for links even before they're hovered. Here we undo these effects. */ | #nav li:hover ul a{ /* The persistent hover state does however create a global style for links even before they're hovered. Here we undo these effects. */ | ||
text-decoration:none; | text-decoration:none; | ||
} | } | ||
+ | |||
#nav li:hover ul li a:hover{ /* Here we define the most explicit hover states--what happens when you hover each individual link. */ | #nav li:hover ul li a:hover{ /* Here we define the most explicit hover states--what happens when you hover each individual link. */ | ||
- | background: | + | background:white; |
+ | color: black; | ||
} | } | ||
- | + | .selflink{ | |
- | + | margin-top: 5px; | |
- | + | ||
- | + | ||
} | } | ||
- | + | .center{ | |
- | + | text-align: center; | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | . | + | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
} | } | ||
</style> | </style> | ||
</html> | </html> |
Latest revision as of 15:53, 31 March 2012