0% found this document useful (0 votes)
6 views3 pages

HTML Css Notes

This document provides an overview of HTML and CSS, detailing their roles in web development. It covers basic HTML tags, CSS selectors, the CSS box model, properties, and best practices for responsive design. Additionally, it includes links to resources for further learning.

Uploaded by

inchara27s
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
6 views3 pages

HTML Css Notes

This document provides an overview of HTML and CSS, detailing their roles in web development. It covers basic HTML tags, CSS selectors, the CSS box model, properties, and best practices for responsive design. Additionally, it includes links to resources for further learning.

Uploaded by

inchara27s
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 3

HTML and CSS Notes

HTML and CSS Notes

HTML (Hypertext Markup Language):

- HTML is the standard language for creating web pages.

- It describes the structure of a web page using markup.

- HTML elements are represented by tags such as <html>, <head>, <body>, <p>, etc.

- Attributes provide additional information about elements, e.g., <a href="url">.

Basic HTML Tags:

1. <!DOCTYPE html>: Declares the document type.

2. <html>: Root element of an HTML page.

3. <head>: Contains metadata and links to stylesheets or scripts.

4. <body>: Contains the content visible on the page.

5. <h1> to <h6>: Header tags for different levels of headings.

6. <p>: Paragraph tag.

7. <a>: Anchor tag for hyperlinks.

8. <img>: Embeds images.

CSS (Cascading Style Sheets):

- CSS is used to style HTML elements and control the layout of web pages.

- It can be applied inline, internally, or externally using stylesheets.

- CSS syntax: selector { property: value; }

CSS Selectors:

1. Element Selector: Selects all elements of a specific type (e.g., p {}).

Page 1
HTML and CSS Notes

2. ID Selector: Uses an ID attribute (#id).

3. Class Selector: Uses a class attribute (.class).

4. Group Selector: Groups multiple selectors (e.g., h1, h2 {}).

CSS Box Model:

- Content: The content of the element.

- Padding: Space between content and border.

- Border: Surrounds the padding.

- Margin: Space outside the border.

CSS Properties:

1. color: Sets text color.

2. background-color: Sets background color.

3. font-size: Sets the size of the text.

4. margin/padding: Sets space around elements.

Responsive Design:

- Use media queries to create layouts that adapt to different screen sizes.

- Example: @media (max-width: 600px) { body { background-color: lightblue; } }

Best Practices:

- Use semantic HTML for better accessibility.

- Keep CSS in an external file for maintainability.

- Validate your code to ensure browser compatibility.

Additional Resources:

Page 2
HTML and CSS Notes

- W3Schools (https://www.w3schools.com)

- MDN Web Docs (https://developer.mozilla.org)

Page 3

You might also like