Kolorwanie:
Status:
12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364
<html>
<head>
	<style>
		#trojkat {
			width: 0;
			height: 0;
			border-left: 200px solid transparent;
			border-right: 200px solid transparent;
			border-bottom: 200px solid blue;
			transform: translate(200px, 100px);
		}
		
		#kwadrat {
			background-color: orange;
			width: 400px;
			height: 200px;
			transform: translate(200px, 100px);
		}
		
		#okno1 {
			background-color: green;
			width: 80px;
			height: 80px;
			position: relative; left: 240px; top: -60px;
			transition: all .8s ease-in-out;
		}
		
		#okno2 {
			background-color: green;
			width: 80px;
			height: 80px;
			position: relative; left: 480px; top: -140px;
			transition: all .8s ease-in-out;
		}
		
		#drzwi {
			background-color: brown;
			width: 60px;
			height: 140px;
			position: relative; left: 370px; top: -200px;
			transition: all .8s ease-in-out;
		}
		
		#okno1:hover {
			transform: rotateX(180deg);
		}
		
		#okno2:hover {
			transform: rotateY(180deg);
		}
		
		#drzwi:hover {
			transform: translate(40px, 0px);
		}
	</style>
</head>
<body>
	<div id="trojkat"></div>
	<div id="kwadrat"></div>
	<div id="okno1"></div>
	<div id="okno2"></div>
	<div id="drzwi"></div>
</body>
</html>

Copyrights 2014-2019 © Wklejaj.pl Wszelkie prawa zastrzeżone.