Wietse Neven wietseneven
wietseneven
/ index.html
Created
April 26, 2012 19:51
— forked from koenveldhuizen/index.html
random post with jQuery
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> | |
| <html xmlns="http://www.w3.org/1999/xhtml"> | |
| <head> | |
| <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> | |
| <title>Untitled Document</title> | |
| <link href="style.css" rel="stylesheet" type="text/css" /> | |
| </head> | |
| <body> | |
| <div id="container"> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /** | |
| * Cheers! | |
| */ | |
| @import url(http://fonts.googleapis.com/css?family=Lobster); | |
| @import url(http://fonts.googleapis.com/css?family=Mate+SC); | |
| .cork { | |
| width:120px; | |
| height:30px; | |
| background:silver; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /** | |
| * CSS3 Ribbon | |
| */ | |
| *, *:after,*:before {-webkit-box-sizing:border-box;-moz-box-sizing: border-box;box-sizing: border-box;} | |
| div { | |
| font-size: 15px !important; | |
| width: 50%; | |
| position: relative; | |
| background: rgb(186, 137, 182); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /** | |
| * Standard 'known' pseudo classes | |
| */ | |
| body { | |
| text-align:center; | |
| font:50px/130px 'Lobster 1.4'; | |
| } | |
| a:link {color:#FF0000;} /* unvisited link */ | |
| a:visited {color:#00FF00;} /* visited link */ | |
| a:hover {color:#FF00FF;} /* mouse over link */ |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /** | |
| * CSS3 logo enschede | |
| */ | |
| @import url(http://fonts.googleapis.com/css?family=Noto+Serif:400italic|Sanchez); | |
| body { | |
| background: white; | |
| min-height: 100%; | |
| } | |
| div { | |
| width:250px; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /** | |
| * CSS3 Ribbon | |
| */ | |
| *, *:after,*:before {-webkit-box-sizing:border-box;-moz-box-sizing: border-box;box-sizing: border-box;} | |
| div { | |
| font-size: 15px !important; | |
| width: 50%; | |
| position: relative; | |
| background: rgb(186, 137, 182); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /** | |
| * Pseudo elements in an article | |
| */ | |
| html { | |
| background: #f06; | |
| background: linear-gradient(45deg, #f06, yellow); | |
| min-height: 100%; | |
| font-family:helvetica; | |
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /** | |
| * CSS pseudo childs | |
| */ | |
| /* Eerste en laatste */ | |
| .first-last li:first-child { | |
| background:red; | |
| color:white; | |
| } | |
| .first-last li:last-child { | |
| background:blue; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /** | |
| * Just for fun™: Mr. Border-Radius in pure CSS | |
| */ | |
| .mr-border-radius { | |
| width: 540px; | |
| height: 420px; | |
| border-radius: 40px; | |
| margin: 60px auto 0; | |
| background: radial-gradient(hsl(40, 100%, 70%), hsl(40, 100%, 50%)); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /* Image grayscale effect */ | |
| #grayscale img:hover { | |
| filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 10+, Firefox on Android */ | |
| filter: gray; /* IE6-9 */ | |
| -webkit-filter: grayscale(100%); /* Chrome 19+, Safari 6+, Safari 6+ iOS */ | |
| } |
OlderNewer