CSS Basics
CSS Structure
CSS stands for Cascading Styles Sheet
h1{
color: blue;
}
Working Within Inline Styles
<p style = “color: magenta; _________” > blah blah blah </p>
Inside opening tag
Writing Internal Styles
<style>
p {
color: magenta;
font-size: 30px;
}
</style>
Write in head element. Only exits in that page
External Styles the Best Way to Write Styles
Make app.css named file in same directory where you write all of CSS code in same place and if you change in one place the changes effects on all over webpages
p {
color: magenta;
font-size: 30px;
}
And then link to the web page with this code
Rel mean relationship and href means link
<link rel= “stylesheet” href=” app.css”>
Anatomy of CSS
#hamburger-button {
width: 30px;
height: 50px;.
border-radius: 20px;
background: rgb(250, 25, 250);
position: relative;
}
The Element Selector
The p selects all the paragraph of the webpage.
There is named of all elements like h1, h2 a, p etc.
You can learn more about selectors in next parts
Facebook
Twitter
LinkedIn
Pinterest
WhatsApp
More Posts
- 12th AKUEB Handwritten Notes
- 40+ Agency WordPress Template Kits FREE
- 50+ WordPress Template kits Free
- AI is Taking Over Web Design: Will Coders Lose Their Jobs?
- AKUEB 12th Notes
- All BS Department 1st Semester Past-papers
- Artificial Intelligence
- Artist Portfolio HTML CSS Project
- Assembly language Handwritten Notes
- BSCS 1st Semester Notes
- BSCS 2nd Semester Notes
- BSCS 3rd Semester Notes
- BSCS 4th Semester Notes
- BSCS 5th Semester Notes
- BSCS 6th Semester Notes
- BSCS 7th Semester Notes
- BSCS 8th Semester Notes
- Build a Full-Stack App with MERN Stack Pt 1
- Build a Full-Stack App with MERN Stack Pt 2
- Class 10th AKUEB Notes Biology, Physics & Chemistry
- CSS Basics
- CSS Grid vs. Flexbox: When to Use Each
- CSS Selectors
- Dark Mode in Web Development: Best Practices & Implementation
- Data Mining
- Data Structure & Algorithms Notes
- Database Management System Handwritten Notes
- Design and Analysis of Algorithms
- Distributed Database System
- DSA Handwritten Notes
- Hazel CV HTML CSS Project
- How to Build Your First Website from Scratch
- How to Deploy a Website Using GitHub Pages
- How to Use Tailwind CSS for Faster and Cleaner UI Development
- How Web3 is Transforming Web Development
- HTML CSS Landing Page
- HTML Forms
- HTML, CSS, and JS: A Beginner’s Guide to Web Development
- Introduction to HTML
- JavaScript ES6: Features Every Developer Should Know
- More HTML
- No-Code Vs. Traditional Coding: Which is the Future?
- Numerical Computing Handwritten Notes
- Random Color Generator Project
- Specificity and The Cascade
- Styling Text in CSS
- The Box Model
- The Evolution of JavaScript Frameworks: From jQuery to Next.js
- The World of CSS Colors
- Theory of Automata
- Top 10 JavaScript Libraries to Speed Up Development
- Understanding HTTP Status Codes and What They Mean
- Web Design Services Pakistan – Building Digital Brands That Inspire Confidence
- Web Design Trends for 2025: Improve User Experience
- What Is an API? A Simple Guide for Beginners
- Why Businesses Choose WordPress Website Design Pakistan for Online Success
- Wireless Communication Handwritten Notes
Table of Contents
Interesting Posts
12th AKUEB Handwritten Notes
03/10/2024
Theory of Automata
19/05/2025
Artist Portfolio HTML CSS Project
23/12/2024
Introduction to HTML
16/12/2024
AKUEB 12th Notes
20/09/2024
How to Build Your First Website from Scratch
05/05/2025
Ghulam Ahmad is an Excellent Writer, His magical words added value in growth of our life. Highly Recommended
