In this comprehensive CSS crash course, we cover all the essential CSS concepts and properties you need to start styling beautiful web pages. Here's what we explore:
- Inline Styles: Adding styles directly to HTML elements using the
style
attribute - Internal Styles: Using the
<style>
tag within the<head>
section - External Stylesheets: Linking CSS files using
<link rel="stylesheet">
- Tag Selector: Targeting elements by their tag name (e.g.,
h2 { ... }
) - ID Selector: Targeting elements by their ID (e.g.,
#mera-h2 { ... }
) - Class Selector: Targeting elements by their class (e.g.,
.purple-li { ... }
)
color
- Changing text colorfont-size
- Adjusting the size of textfont-weight
- Making text bold or lightertext-align
- Aligning text (left, right, center)
background-color
- Setting background colorborder
- Adding borders (solid, dashed, dotted)margin
- Creating space outside elementspadding
- Creating space inside elementswidth
&height
- Controlling element size
- Styling list items with classes
- Creating and styling tables (
table
,tr
,td
,th
,thead
,tbody
)
- Flexbox: Arranging elements in flexible layouts using
display: flex
,justify-content
, andalign-items
- Building a simple navbar and main content area with Flexbox
This repository contains all the code examples and practice files used in the video tutorial. Feel free to clone, fork, and experiment with the code!
Feel free to use this code for your learning and projects!
Made with ❤️ by Developer Junaid