Team:Calgary/Sandbox
From 2012.igem.org
(Difference between revisions)
Line 4: | Line 4: | ||
<meta name="viewport" content="target-densitydpi=device-dpi, width=device-width, height=device-height, initial-scale=1.0" /> | <meta name="viewport" content="target-densitydpi=device-dpi, width=device-width, height=device-height, initial-scale=1.0" /> | ||
--> | --> | ||
- | |||
- | |||
<link rel='stylesheet' type='text/css' href='https://2012.igem.org/Team:Calgary/static/basicpagedesktop.css?action=raw&ctype=text/css' /> | <link rel='stylesheet' type='text/css' href='https://2012.igem.org/Team:Calgary/static/basicpagedesktop.css?action=raw&ctype=text/css' /> | ||
<style> | <style> | ||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
/*Typical smartphone device styles*/ | /*Typical smartphone device styles*/ | ||
Line 75: | Line 43: | ||
.thumbcaption{ | .thumbcaption{ | ||
font-size: 4em; | font-size: 4em; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | /*Desktop styles*/ | ||
+ | @media only screen and (min-device-width:481px){ | ||
+ | p{ | ||
+ | font-family: Arial; | ||
+ | font-size: 1.5em; | ||
+ | } | ||
+ | p.family{ | ||
+ | font-family: Myriad Pro, Gill Sans, Trebuchet MS, Arial, Sans-Serif; | ||
+ | font-size: 1.5em; | ||
+ | } | ||
+ | #box{ | ||
+ | width: 100%; | ||
+ | height: 30px; | ||
+ | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#cccccc', endColorstr='#000000'); /* for IE */ | ||
+ | background: -webkit-gradient(linear, left top, right bottom, from(#333), to(#efefef)); /* for webkit browsers */ | ||
+ | background: -moz-linear-gradient(left, #ccc, #000); /* for firefox 3.6+ */ | ||
+ | } | ||
+ | .arrow{ | ||
+ | width: 0; | ||
+ | height: 0; | ||
+ | border-top: 15px solid transparent; | ||
+ | border-bottom: 15px solid transparent; | ||
+ | border-left: 15px solid blue; | ||
} | } | ||
} | } | ||
Line 83: | Line 77: | ||
<div data-role="collapsible"> | <div data-role="collapsible"> | ||
<h3>Header</h3> | <h3>Header</h3> | ||
- | <p | + | <p>This is not a paragraph.</p> |
- | <p class=" | + | <p class="family">This is a test for font-family. Watch "Jeopardy!", Alex Trebek's fun TV quiz game.</p> |
- | + | ||
</div> | </div> | ||
<div class="arrow"></div> | <div class="arrow"></div> |
Revision as of 19:17, 18 June 2012
Header
This is not a paragraph.
This is a test for font-family. Watch "Jeopardy!", Alex Trebek's fun TV quiz game.