Skip to content

Instantly share code, notes, and snippets.

@BaskSerg

BaskSerg/style.css

Created November 6, 2017 08:46
Show Gist options
  • Save BaskSerg/7443d429b5038080f5e20a13158514bf to your computer and use it in GitHub Desktop.
Save BaskSerg/7443d429b5038080f5e20a13158514bf to your computer and use it in GitHub Desktop.
Download ZIP
Table Responsive 1
Raw
style.css
/* CSS Mini Reset */
html, body, div, form, fieldset, legend, label
{
margin: 0;
padding: 0;
}
table
{
border-collapse: collapse;
border-spacing: 0;
}
th, td
{
text-align: left;
vertical-align: top;
}
h1, h2, h3, h4, h5, h6, th, td, caption { font-weight:normal; }
img { border: 0; }
body {
font-family: "Open Sans", sans-serif;
line-height: 1.25;
}
.wrapper {
padding: 0 2px;
}
table.price_list_table {
margin: auto;
}
table.price_list_table tr:nth-child(2n+1) {
background-color: #fcfcfc;
}
table.price_list_table td, table.price_list_table th {
border:1px solid #ececec;
}
table.price_list_table th {
text-align: center !important;
font-size: 16px !important;
}
table.price_list_table th, table.price_list_table td {
line-height: 150%;
text-align: center;
padding: 6px !important;
}
table.price_list_table th.plhead{
background: #eee;
text-align: center;
}
table.price_list_table tr td {
font-size: 15px;
}
table.price_list_table tr td:first-child{
text-align: left;
font-size:13px;
}
td.pl-off {
background-color: #ddd;
}
td.pl-on {
color: #d31f26;
}
Raw
table.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Table</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="wrapper">
<table class="price_list_table">
<thead>
<tr>
<th>Seo optimization</th>
<th>Basic</th>
<th>Standard</th>
<th>Professional</th>
<th>Individual</th>
</tr>
</thead>
<tbody>
<tr>
<td>Monthly price(CDN)</td>
<td class="pl-on">$499</td>
<td class="pl-on">$799</td>
<td class="pl-on">$1 499</td>
<td class="pl-on">$2 499</td>
</tr>
<tr>
<td>Keywords Optimization</td>
<td class="pl-on">10</td>
<td class="pl-on">25</td>
<td class="pl-on">50</td>
<td class="pl-on">100</td>
</tr>
<tr>
<th colspan="5" class="plhead">Initial Review &amp; Analysis</th>
</tr>
<tr>
<td>Website Analysis</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
</tr>
<tr>
<td>Initial Backlinks Analysis</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
</tr>
<tr>
<td>Google Penalty Check</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
</tr>
<tr>
<td>Competition Analysis</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
</tr>
<tr>
<td>Keyword Research</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
</tr>
<tr>
<th colspan="5" class="plhead">On Page Optimization</th>
</tr>
<tr>
<td>On page Changes</td>
<td class="pl-on">Up to 10 pages</td>
<td class="pl-on">Up to 25 pages</td>
<td class="pl-on">Up to 50 pages</td>
<td class="pl-on">Up to 100 pages</td>
</tr>
<tr>
<td>Title Tags Optimization</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
</tr>
<tr>
<td>META Tags Optimization</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
</tr>
<tr>
<td>Content Optimization</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
</tr>
<tr>
<td>HTML Code Optimization</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
</tr>
<tr>
<td>Website Responsive Check*</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
</tr>
<tr>
<td>Website Permalinks Analysis*</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
</tr>
<tr>
<td>Schema Markup Analysis*</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
</tr>
<tr>
<td>Page Speed Analysis*</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
</tr>
<tr>
<td>Internal Linking Optimization</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
</tr>
<tr>
<td>Heading Tags Optimization</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
</tr>
<tr>
<td>Canonicalization/301 Redirect</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
</tr>
<tr>
<td>Images Optimization</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
</tr>
<tr>
<td>Hyperlink Optimization</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
</tr>
<tr>
<td>Robots.txt Creation/Optimization</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
</tr>
<tr>
<td>Sitemap Creation</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
</tr>
<tr>
<td>Google Webmaster Tools Setup</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
</tr>
<tr>
<td>Bing Webmaster Tools Setup</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
</tr>
<tr>
<td>Google Analytics Setup &amp; Integration</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
</tr>
<tr>
<th colspan="5" class="plhead">Content Marketing &amp; Link Building</th>
</tr>
<tr>
<td>On page Changes</td>
<td class="pl-on">Up to 10 pages</td>
<td class="pl-on">Up to 25 pages</td>
<td class="pl-on">Up to 50 pages</td>
<td class="pl-on">Up to 100 pages</td>
</tr>
<tr>
<td>Guest Blogging</td>
<td class="pl-on">1</td>
<td class="pl-on">3</td>
<td class="pl-on">5</td>
<td class="pl-on">10</td>
</tr>
<tr>
<td>Guest Blogging</td>
<td class="pl-on">1</td>
<td class="pl-on">3</td>
<td class="pl-on">5</td>
<td class="pl-on">10</td>
</tr>
<tr>
<td>Blog Posts on Client’s Website</td>
<td class="pl-off">&nbsp;</td>
<td class="pl-off">&nbsp;</td>
<td class="pl-on">2</td>
<td class="pl-on">4</td>
</tr>
<tr>
<td>Custom graphics and/or illustrations to support your blogs</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
</tr>
<tr>
<td>Contextual links</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
</tr>
<tr>
<td>Keyword used in anchor text</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
</tr>
<tr>
<td>Add SEO data to each post (Meta tags etc.)</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
</tr>
<tr>
<td>Share each blog post across social media networks</td>
<td class="pl-off">&nbsp;</td>
<td class="pl-off">&nbsp;</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
</tr>
<tr>
<td>Infographics Creation 1 in Every</td>
<td class="pl-off">&nbsp;</td>
<td class="pl-off">&nbsp;</td>
<td class="pl-on">6th Month</td>
<td class="pl-on">3rd Month</td>
</tr>
<tr>
<td>Share each Infographic on social media networks</td>
<td class="pl-off">&nbsp;</td>
<td class="pl-off">&nbsp;</td>
<td class="pl-on">v</td>
<td class="pl-on">v</td>
</tr>
<tr>
<td>Premium Press Release 1 in Every 6th Month</td>
<td class="pl-off">&nbsp;</td>
<td class="pl-off">&nbsp;</td>
<td class="pl-off">&nbsp;</td>
<td class="pl-on">v</td>
</tr>
<tr>
<td>Search Engine Submissions</td>
<td class="pl-on">2</td>
<td class="pl-on">4</td>
<td class="pl-on">7</td>
<td class="pl-on">14</td>
</tr>
<tr>
<td>Blogs Social Bookmarking Links</td>
<td class="pl-on">10</td>
<td class="pl-on">20</td>
<td class="pl-on">30</td>
<td class="pl-on">50</td>
</tr>
<tr>
<td>Social Bookmarking Links</td>
<td class="pl-on">20</td>
<td class="pl-on">30</td>
<td class="pl-on">50</td>
<td class="pl-on">100</td>
</tr>
<tr>
<td>Classified Submissions</td>
<td class="pl-on">10</td>
<td class="pl-on">20</td>
<td class="pl-on">30</td>
<td class="pl-on">50</td>
</tr>
<tr>
<th colspan="5" class="plhead">Local Optimization</th>
</tr>
<tr>
<td>Location optimization</td>
<td class="pl-on">1</td>
<td class="pl-on">2</td>
<td class="pl-on">4</td>
<td class="pl-on">8</td>
</tr>
<tr>
<td>NAP Syndication</td>
<td class="pl-off">&nbsp;</td>
<td class="pl-off">&nbsp;</td>
<td class="pl-off">&nbsp;</td>
<td class="pl-off">&nbsp;</td>
</tr>
<tr>
<td>Google Business Page Creation</td>
<td class="pl-off">&nbsp;</td>
<td class="pl-off">&nbsp;</td>
<td class="pl-off">&nbsp;</td>
<td class="pl-off">&nbsp;</td>
</tr>
<tr>
<td>Bing Local Listing Creation</td>
<td class="pl-off">&nbsp;</td>
<td class="pl-off">&nbsp;</td>
<td class="pl-off">&nbsp;</td>
<td class="pl-off">&nbsp;</td>
</tr>
<tr>
<td>Local Business Listings</td>
<td class="pl-on">3</td>
<td class="pl-on">5</td>
<td class="pl-on">7</td>
<td class="pl-on">10</td>
</tr>
</tbody>
</table>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment