Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <head>
- <style>
- #div1 {
- background-color:white;
- width:150px;
- height: 150px;
- border: 20px solid blue;
- border-radius: 8%;
- opacity: 0.7;
- transform: rotate(45deg);
- position:absolute;
- top: -50;
- left: -50;
- text-align: right;
- font-size: 25px;
- font-weight: bold;
- }
- #div2 {
- background-color:white;
- width:150px;
- height: 150px;
- border: 20px solid red;
- border-radius: 8%;
- opacity: 0.6;
- transform: rotate(45deg);
- position: absolute;
- top: 75;
- left: 0;
- text-align: right;
- font-size: 25px;
- font-weight: bold;
- }
- #div3 {
- background-color: white;
- width: 100px;
- height: 100px;
- border: 20px solid purple;
- border-radius: 8%;
- opacity: 0.5;
- transform: rotate(0deg);
- position: absolute;
- top: -75;
- left: 100;
- text-align: left;
- font-size: 25px;
- font-weight: bold;
- }
- #div4 {
- background-color: white;
- width: 100px;
- height: 100px;
- border: 20px solid green;
- border-radius: 50%;
- opacity: 0.4;
- transform: rotate(45deg);
- position: absolute;
- top: 120;
- left: 250;
- text-align: left;
- font-size: 25px;
- font-weight: bold;
- }
- #div5 {
- background-color: white;
- width: 50px;
- height: 50px;
- border-top: 15px solid blue;
- border-left: 15px solid white;
- border-right: 15px solid blue;
- border-bottom: 15px solid white;
- border-radius: 8%;
- opacity: 0.3;
- transform: rotate(45deg);
- position: absolute;
- top: 150;
- left: 375;
- text-align: left;
- font-size: 25px;
- font-weight: bold;
- }
- </style>
- </head>
- <body>
- <div id="div1">Div1</div>
- <div id="div2">HTML CSS praktijktoets Frank Hummel</h3>
- <div id="div3">Div3</div>
- </div>
- <div id="div4">Div4</div>
- <div id="div5">Div5</div>
- </body>
- </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement