The basics you'll use every day
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Page Title</title>
</head>
<body>
<!-- Your content goes here -->
</body>
</html>
<h1>Main Title</h1>
<h2>Section Title</h2>
<h3>Subsection</h3>
<p>Paragraph text</p>
<strong>Bold text</strong>
<em>Italic text</em>
<br> <!-- Line break -->
<a href="https://example.com">Click here</a>
<a href="page.html">Internal link</a>
<a href="#section">Jump to section</a>
<img src="photo.jpg" alt="Description of image">
<!-- Bullet list -->
<ul>
<li>Item one</li>
<li>Item two</li>
</ul>
<!-- Numbered list -->
<ol>
<li>First</li>
<li>Second</li>
</ol>
<div class="container">Block container</div>
<span class="highlight">Inline text</span>
<style>
/* Your CSS here */
</style>
/* By tag */
p { color: white; }
/* By class */
.my-class { color: white; }
/* By ID */
#my-id { color: white; }
color: white; /* Text color */
background: #0a0a0a; /* Hex code */
background: rgb(10,10,10); /* RGB */
font-size: 16px;
font-weight: bold; /* or 400, 600, etc */
text-align: center;
line-height: 1.6;
margin: 20px; /* All sides */
margin-top: 10px; /* Just top */
padding: 10px 20px; /* Top/bottom, left/right */
border: 1px solid #222;
border-radius: 8px; /* Rounded corners */
width: 100%;
max-width: 900px;
height: auto;