Playing with CSS
How do I make an playing with css?
What is a playing with css? How do you make a playing with css? This script and codes were developed by Aaron Happe on 09 November 2022, Wednesday.
Playing with CSS - Script Codes HTML Codes
<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Playing with CSS</title> <link rel="stylesheet" href="css/style.css">
</head>
<body> <head> <script src="https://www.kirupa.com/prefixfree.min.js"></script>
</head>
<body> <div>@</div> <p>Drop Away!</p> </body>
</html> <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script> <script src="js/index.js"></script>
</body>
</html>
Playing with CSS - Script Codes CSS Codes
body { text-align: center; background-color: #99defe; font-family: Helvetica, Arial, sans-serif;
}
div { display: inline-block; padding: 0 .2em; margin-top: .25em; background-color: orange; border-left: 1px solid #e8d1b9; border-top: 1px solid #e8d1b9; box-shadow: 1px 2px 3px #664200; line-height: 1.5em; font-style: bold; font-size: 10em; color: hsla(0, 0%, 0%, 0.6); text-shadow: 1px 4px 6px orange, 0 0 0 hsla(0, 0%, 0%, 0.6), 1px 4px 6px orange; cursor: pointer; transition: all 1.5s ease-in-out;
}
div:hover { background-color: #7dd3fa; transform: translateY(4em) rotate(45deg); border-left: 1px solid #9fe7fe; border-top: 1px solid #9fe7fe; box-shadow: 1px 2px 3px #325464; text-shadow: 1px 4px 6px #7dd3fa, 0 0 0 hsla(0, 0%, 0%, 0.6), 1px 4px 6px #7dd3fa;
}
.clickClass { background-color: #7dd3fa; transform: translateY(4em) rotate(45deg); border-left: 1px solid #9fe7fe; border-top: 1px solid #9fe7fe; box-shadow: 1px 2px 3px #325464; text-shadow: 1px 4px 6px #7dd3fa, 0 0 0 hsla(0, 0%, 0%, 0.6), 1px 4px 6px #7dd3fa;
}
Playing with CSS - Script Codes JS Codes
$('div').on('click', function(){ $(this).addClass('clickClass');
})
Developer | Aaron Happe |
Username | aaronhappe |
Uploaded | November 09, 2022 |
Rating | 3 |
Size | 1,978 Kb |
Views | 12,144 |
Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!
Name | Size |
A Pen by Aaron Happe | 5,525 Kb |
FF - Accordion Layout - DT | 5,191 Kb |
Shop Record Bookmarklet | 7,448 Kb |
Prototype for BZees filters. | 2,560 Kb |
CSS animations. | 2,526 Kb |
Testing Script | 1,628 Kb |
Shoprecord - bookmarkletCSS | 1,597 Kb |
Snap SVG exploration | 3,250 Kb |
Wimpiest Chat Room Ever | 1,725 Kb |
Tutorial | 3,498 Kb |
Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!
Name | Username | Size |
Free css icon set v2 - one div | Ben_jammin | 0 Kb |
404 Error Page | WebSonick | 3,203 Kb |
Font stack | Adrianjacob | 1,868 Kb |
The Fly | GianlucaGuarini | 3,405 Kb |
Sexy Social Buttons | Ipiyale | 2,226 Kb |
Alumni ECA | MatheusLima92 | 3,777 Kb |
Shopping cart | Andiio | 6,581 Kb |
Canvas Fireworks | Jackrugile | 6,200 Kb |
SCSS Social Icons Flat | Mattsince87 | 3,482 Kb |
Mondrian | Chrisarmstrong | 2,787 Kb |
Surf anonymously, prevent hackers from acquiring your IP address, send anonymous email, and encrypt your Internet connection. High speed, ultra secure, and easy to use. Instant setup. Hide Your IP Now!