Skip to content

Instantly share code, notes, and snippets.

@MrKioZ
Created November 19, 2019 19:00
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save MrKioZ/802c7b7b76584420eb4636f3684cfc7d to your computer and use it in GitHub Desktop.
Save MrKioZ/802c7b7b76584420eb4636f3684cfc7d to your computer and use it in GitHub Desktop.
My first css page
<!DOCTYPE html>
<html>
<title>Internet Jobs</title>
<style type="text/css">
::selection {
background: #ffb7b7; /* WebKit/Blink Browsers */
}
::-moz-selection {
background: #ffb7b7; /* Gecko Browsers */
}
*{
margin:0;
padding:0;
}
a{
text-decoration: none;
color: black;
}
a:hover{
color: gray;
}
a:active{
color:greenyellow;
}
body{
background-color: whitesmoke;
color: gray;
font-family: Arial, Helvetica, sans-serif;
font-size: 150%;
line-height: 1.6em;
}
.categories{
border:1px #ccc solid;
padding:.7%;
position: sticky;
color: rgb(189, 162, 240);
display: flex;
}
.categories ul{
display:flex;
list-style: none;
margin-left: 5%;
}
.categories li{
padding-bottom: 6px;
margin-left: 10%;
}
h1{
color:rgb(189, 162, 240);
text-align: center;
margin-bottom: 1.5%;
margin-top: .5%;
}
#headline{
text-align: center;
font-size: 250%;
margin-top: 10%;
color:slateblue;
font-weight: bolder;
}
.Chapter{
background-color: honeydew;
color:grey;
margin: auto;
margin-top: 6%;
margin-left: 5%;
margin-right: 5%;
text-align: center;
border:3px solid #ccc;
border-radius: 50px;
padding: 2%;
}
.Chapter p{
padding: 4%;
font-size: 150%;
}
footer{
text-align: center;
margin-top: 4.5%;
padding-bottom: 2.5%;
padding-top: 1.25%;
background-color: rgb(167, 167, 167);
}
</style>
<body>
<div class='categories'>
<h2>Website</h2>
<ul>
<li><a href='#'>Home</a></li>
<li><a href='#'>Blog</a></li>
<li><a href='#'>About</a></li>
<li><a href='#'>Contact</a></li>
</ul>
</div>
<div id='headline'><p>Internet Jobs</p></div>
<div class='Chapter'>
<h1>Blogger</h1>
<p>If there’s a niche you’re interested in and you can build a decent audience around it, starting a blog and using affiliate marketing to generate income is an incredible way to make money online.</p>
</div>
<div class='Chapter'>
<h1>YouTuber</h1>
<p>While YouTube recently changed its monetization program, if you’re able to hit their new minimum bar of 1,000 subscribers and 4,000 hours of view time in the past 12 months, it’s still an incredible place to make extra money online.</p>
</div>
<div class='Chapter'>
<h1>Developer</h1>
<p>Whether it’s an important consumer application, a specialist app to solve a particular niche problem, or even a time-wasting game you can play on your phone, you can create a massively successful business if you build software that helps people. (Look at the rise of Slack—the team communication software that went from side project to billion-dollar company in just 2 years.)</p>
</div>
<div class='Chapter'>
<h1>Designer</h1>
<p>Walk around your neighborhood or town and I’m sure you’ll see tons of great local businesses with terrible design. However, with increasingly easy-to-use tools like Adobe Illustrator, Venngage, Stencil, and Visme, just about anyone with a creative mindset and a good amount of motivation can start making money online by being a graphic designer for local companies.</p>
</div>
<footer>
This page was made by <a href='http://google.com'>Adam Sherif</a>
</footer>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment