"
Team:Potsdam Bioware/PU Test
From 2011.igem.org
(Difference between revisions)
(Created page with "<html><head> <meta charset="utf-8"> <title>iGEM Potsdam 2011</title> <style> * { margin: 0; padding: 0; } html, body { ...") |
|||
| (31 intermediate revisions not shown) | |||
| Line 1: | Line 1: | ||
<html><head> | <html><head> | ||
| - | + | <!DOCTYPE html> | |
<meta charset="utf-8"> | <meta charset="utf-8"> | ||
<title>iGEM Potsdam 2011</title> | <title>iGEM Potsdam 2011</title> | ||
| - | |||
| - | |||
<style> | <style> | ||
| Line 23: | Line 21: | ||
height: 100%; | height: 100%; | ||
z-index: 1; | z-index: 1; | ||
| - | background-color: # | + | background-color: #FFFFFF; |
overflow: hidden; | overflow: hidden; | ||
| + | background:-moz-linear-gradient(top, #fff, #adf); /* Firefox */ | ||
| + | background:-webkit-gradient(linear, left top, left bottom, from(#fff), to(#adf)); /* Safari, Chrome */ | ||
| + | background:-webkit-linear-gradient(top, #fff, #adf); /* Safari, Chrome - neue Syntax! */ | ||
| + | background:-o-linear-gradient(top, #fff, #adf); /* Opera */ | ||
| + | background:-ms-linear-gradient(top, #fff, #adf); /* IE */ | ||
| + | background:linear-gradient(top, #fff, #adf); /* W3C Standard */ | ||
} | } | ||
#headstripe_full { | #headstripe_full { | ||
| Line 34: | Line 38: | ||
z-index: 2; | z-index: 2; | ||
background-color: #CCFFFF; | background-color: #CCFFFF; | ||
| + | /* Für WebKit (Safari, Chrome, etc.) */ background: -webkit-gradient(linear, left top, left bottom, from(#c8482c), to(#fff)); | ||
| + | background:-webkit-linear-gradient(top, ##c8482c, #fff); /* Safari, Chrome - neue Syntax! */ | ||
| + | /* Für Mozilla/Gecko (Firefox etc) */ background: -moz-linear-gradient(top, #c8482c, #fff); | ||
| + | /* aktueller W3C working draft */ background: linear-gradient(top, #c8482c, #fff); | ||
| + | |||
| + | /* Für Internet Explorer 5.5 - 7 */ | ||
| + | filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#c8482c, endColorstr=#ffffff); | ||
| + | zoom: 1; | ||
| + | |||
| + | /* Für Internet Explorer 8 */ | ||
| + | -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#c8482c, endColorstr=#ffffff)"; | ||
| + | } | ||
| + | |||
overflow: hidden; | overflow: hidden; | ||
} | } | ||
| Line 43: | Line 60: | ||
width: 100%; | width: 100%; | ||
height: 100px; | height: 100px; | ||
| - | z-index: | + | z-index: 1; |
background-color: #00FF00; | background-color: #00FF00; | ||
overflow: hidden; | overflow: hidden; | ||
| Line 53: | Line 70: | ||
left: 0px; | left: 0px; | ||
width: 150px; | width: 150px; | ||
| - | height: | + | height: 500px; |
z-index: 2; | z-index: 2; | ||
background-color: red; | background-color: red; | ||
| Line 64: | Line 81: | ||
left: 150px; | left: 150px; | ||
width: 600px; | width: 600px; | ||
| - | height: | + | height: 500px; |
z-index: 2; | z-index: 2; | ||
background-color: yellow; | background-color: yellow; | ||
| + | border-bottom: emboss #000 5px; | ||
overflow: auto; | overflow: auto; | ||
} | } | ||
| - | + | #first-letter{ | |
| + | display:block; | ||
| + | margin:1px 0 0 1px; | ||
| + | float: top; | ||
| + | float:left; | ||
| + | color:#000; | ||
| + | font-size:30px; | ||
| + | font-family:Georgia; | ||
| + | } | ||
#menue_content { | #menue_content { | ||
padding-top: 20px; | padding-top: 20px; | ||
| Line 81: | Line 107: | ||
padding-bottom: 30px; | padding-bottom: 30px; | ||
padding-left: 20px; | padding-left: 20px; | ||
| - | max-width: | + | max-width: 560px; |
background-color: lightblue; | background-color: lightblue; | ||
| + | background:-moz-radial-gradient(center, #fff, #adf); /* Firefox */ | ||
| + | background:-webkit-gradient(radial, center center, 80, center center, 400, from(#fff), to(#adf)); /* Safari, Chrome */ | ||
| + | background:-webkit-radial-gradient(center, #fff, #adf); /* Safari, Chrome - neue Syntax! */ | ||
| + | background:-o-radial-gradient(center, #fff, #adf); /* Opera, funktioniert noch nicht, aber sicherlich bald */ | ||
| + | background:-ms-radial-gradient(center, #fff, #adf); /* IE */ | ||
| + | background:radial-gradient(center, #fff, #adf); /* W3C Standard */ | ||
| + | } | ||
| + | |||
| + | #h2_test { | ||
| + | font-size: 30px; | ||
| + | font-family: sans-serif; | ||
| + | border-bottom-style: ridge; | ||
} | } | ||
| + | |||
| + | HR { | ||
| + | border: none 0; | ||
| + | border-top: 2px solid #ccc; | ||
| + | border-bottom: 2px solid #efefef; | ||
| + | width: 70%; | ||
| + | height: 1px; | ||
| + | margin: 5px auto; | ||
| + | text-align: left; | ||
| + | } | ||
</style> | </style> | ||
</head> | </head> | ||
| Line 116: | Line 164: | ||
<!-- ************************** --> | <!-- ************************** --> | ||
<div id="text_column"> | <div id="text_column"> | ||
| - | <div id="text_content">< | + | <div id="text_content"> |
| - | <p> | + | <h2 id="h2_test">TEXT</h2> |
| + | <hr> | ||
| + | <p id="first-letter">L</p>orem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur eget nunc eu lacus sagittis | ||
ullamcorper elementum commodo arcu. Aliquam vitae accumsan sem. Morbi ut nisi ligula. Suspendisse potenti. | ullamcorper elementum commodo arcu. Aliquam vitae accumsan sem. Morbi ut nisi ligula. Suspendisse potenti. | ||
Phasellus semper fermentum erat, eget tristique tellus egestas sed. In aliquet adipiscing leo ac ultricies. | Phasellus semper fermentum erat, eget tristique tellus egestas sed. In aliquet adipiscing leo ac ultricies. | ||
Latest revision as of 17:07, 19 September 2011
headstripe
TEXT
L
orem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur eget nunc eu lacus sagittis ullamcorper elementum commodo arcu. Aliquam vitae accumsan sem. Morbi ut nisi ligula. Suspendisse potenti. Phasellus semper fermentum erat, eget tristique tellus egestas sed. In aliquet adipiscing leo ac ultricies. Integer quis lectus magna. Duis et eros.+++++++++++++++++++++++++++++++++++++++++
