Pricing Table v2

Developer
Altitude
Size
3,175 Kb
Views
16,192
  1. Pricing Table v2 Previews
  2. Pricing Table v2 HTML Codes
  3. Pricing Table v2 CSS Codes

How do I make an pricing table v2?

What is a pricing table v2? How do you make a pricing table v2? This script and codes were developed by Altitude on 23 September 2022, Friday.

Pricing Table v2 Previews
IQ Test

Pricing Table v2 - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Pricing Table v2</title> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css"> <link rel="stylesheet" href="css/style.css">
</head>
<body> <div id='plans'> <div class='plan beginner'> <h2>Beginner Plan</h2> <p>This is our basic plan, with just enough to get you started</p> <h2 class='price'> $5.99 <small>per month</small> </h2> <ul> <li>Normal Feature</li> <li>Included Option</li> </ul> <a class='button' href='#'>Get Started</a> </div> <div class='plan intermediate'> <h2>Intermediate Plan</h2> <p>This is our basic plan, with just enough to get you started</p> <h2 class='price'> $9.99 <small>per month</small> </h2> <ul> <li>Normal Feature</li> <li>Included Option</li> </ul> <a class='button' href='#'>Get Started</a> </div> <div class='plan advanced'> <h2>Advanced Plan</h2> <p>This is our basic plan, with just enough to get you started</p> <h2 class='price'> $14.99 <small>per month</small> </h2> <ul> <li>Normal Feature</li> <li>Included Option</li> </ul> <a class='button' href='#'>Get Started</a> </div>
</div>
</body>
</html>

Pricing Table v2 - Script Codes CSS Codes

*, *:after, *:before { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
}
html { background: #fff; color: #444; padding: 40px;
}
h1, h2, h3, h4, h5, h6, p, ul { margin-top: 0; margin-bottom: 20px;
}
#plans .plan { position: relative; z-index: 0; background: #499; color: #c4e5e5; text-align: center; padding: 30px; width: 29%; margin: 0 1%; float: left; border-radius: 4px;
}
#plans .plan h2, #plans .plan h3 { color: white;
}
#plans .plan h2 { display: block; background: #5ab6b6; margin: -30px -30px 20px -30px; padding: 10px 0; font-weight: normal; font-size: 1em; text-transform: uppercase;
}
#plans .plan .price { padding: 30px 10px; margin: 0px -30px 20px -30px; font-size: 3em;
}
#plans .plan .price small { display: block; font-size: .25em;
}
#plans .plan ul { padding-left: 0; margin-top: -10px;
}
#plans .plan ul li { list-style: none; display: block; padding: 10px 0; border-bottom: 1px solid rgba(255, 255, 255, 0.25);
}
#plans .plan .button { display: inline-block; background: #7ee; color: #118888; text-decoration: none; padding: 1em 2em; text-align: center; border-radius: 4px;
}
#plans .plan.beginner .price { background: #4fc94f;
}
#plans .plan.intermediate .price { background: #f2a10d;
}
#plans .plan.advanced .price { background: #cc3333;
}
#plans:after { display: block; clear: both;
}
Pricing Table v2 - Script Codes
Pricing Table v2 - Script Codes
Home Page Home
Developer Altitude
Username altitudems
Uploaded September 23, 2022
Rating 3
Size 3,175 Kb
Views 16,192
Do you need developer help for Pricing Table v2?

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!

Altitude (altitudems) Script Codes
Name
CSS3 Buttons
Simple CSS Ribbon and Banner
VueJS Calendar Component
A Pen by Altitude
Simple Grid System
Custom Social Feeds
CSS3 Buttons Flat
VueJS Audio Mixer
Responsive, Fullscreen Slider
Jquery Tab Plugin
Create amazing blog posts with AI!

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!