Posts

"I am Saqib Jahangir. A passionate vlogger, software engineer, and avid traveler with a deep love for exploring the hidden gems of our beautiful planet. With a strong foundation in Application Development, Application Architecture & Database Design and Product Management, I bring over a decade of hands-on experience building secure, scalable, and resilient web applications for a diverse range of industries."

How CSS Works with HTML

  CSS (Cascading Style Sheets) is used to style and visually format HTML content. HTML provides the structure of a web page, and CSS controls how that content looks — such as its layout, colors, fonts, spacing, and positioning . Think of it Like This: ·          HTML is the frame of the webpage. ·          CSS is the styling and cosmetics that make it look nice. 🧠 How It Actually Works (Behind the Scenes) 1.       The browser loads your HTML file. 2.       It sees any CSS rules (inline, internal, or external). 3.       It applies the CSS rules to matching HTML elements. 4.       CSS rules “cascade,” meaning the most specific rule takes effect if there's a conflict. Types of CSS CSS (Cascading Style Sheets) has three main types based on how it is applied to HTML documents: ...
Read more

Span and div

  🔹 <span> — Inline Container ·          Purpose : Used to group inline elements for styling or scripting (like CSS or JavaScript). ·          Default Behavior : It does not break the line — it stays inline with surrounding text. ·          Common Use : Ideal for styling a part of text inside a paragraph, heading, etc. ✅ Example: < p >This is < span style = "color: red;" >important </ span > text. </ p > Here, only the word “important” will appear red, and the sentence stays on the same line. 🔸 <div> — Block-Level Container ·          Purpose : Used to group block-level content (like paragraphs, images, sections). ·          Default Behavior : It starts on a new line and takes up the full width available. · ...
Read more

What is CSS

✅ Definition CSS (Cascading Style Sheets) is a style sheet language used to control the appearance and layout of HTML elements on a web page. While HTML gives a webpage structure, CSS is what makes it look visually appealing . 🎯 Main Purpose of CSS To separate content (HTML) from presentation (CSS) To apply styles such as colors, fonts, spacing, and positioning To make websites responsive and adapt to different screen sizes 🔍 Why "Cascading"? The word “cascading” means that multiple style rules can apply , and the most specific or latest one wins . CSS uses a priority system : Inline styles (highest priority) Internal styles (in <style> tag in HTML) External stylesheets (linked via <link> ) Browser default styles (lowest priority) 🎨 What Can You Style with CSS? Text: font, size, color, spacing Boxes: borders, padding, margins, backgrounds Layouts: positioning elements, grid, flexbox Animations: transi...
Read more

Comments in HTML

  HTML comments are used to insert notes into the HTML code. These comments are not displayed in the browser and are helpful for: Describing the structure or purpose of the code Temporarily disabling parts of the code Leaving notes for yourself or other developers ✅ Syntax <!-- This is a comment --> You can also place comments on multiple lines: <!--   This is a multiline comment.   It helps explain more details in the code. --> 📌 Example <!DOCTYPE html> <html>   <head>     <title>HTML Comments Example</title>   </head>   <body>       <!-- Main heading of the page -->     <h1>Welcome to My Website</h1>       <p>This is a paragraph.</p>       <!--        <p>This paragraph is commented o...
Read more

HTML Entities and Special Characters

  In HTML, entities are used to display reserved characters , symbols , or special characters that cannot be typed directly or may be misunderstood by the browser. 🔹 Why Use HTML Entities? Some characters like < , > , & are reserved in HTML and will be interpreted as code if written directly. Entities help you display these characters correctly on the page. Example < p >5 &lt; 10 and 10 &gt; 5 </ p > < p >Use &amp; to write "and". </ p > < p >Price: 100 &euro; </ p > < p > &copy; 2025 Your Name. All rights reserved. </ p > Output: 5 < 10 and 10 > 5 Use & to write "and". Price: 100 € © Your Name. All rights reserved. 🔹 Using Unicode with &#code; You can also use numeric character references (decimal or hex): ·          &#169; → © ·          &#...
Read more