Basic HTML Tags
1. <html>: Defines the beginning and end of an HTML document.
2. <head>: Contains metadata about the document (e.g., title, styles, scripts).
3. <title>: Sets the title of the web page displayed on the browser tab.
4. <body>: Contains all the visible content of the web page.
5. <h1> to <h6>: Define headings, with <h1> being the largest and <h6> the smallest.
6. <p>: Defines a paragraph.
7. <a>: Creates a hyperlink.
8. <img>: Embeds an image.
9. <ul> / <ol> / <li>: Creates unordered lists, ordered lists, and list items.
10. <div>: Defines a division or section in a document for styling or grouping.
HTML for Forms
1. <form>: Creates an HTML form for user input.
2. <input>: Defines an input field, like text, radio buttons, or checkboxes.
3. <label>: Labels an input field for better accessibility.
4. <textarea>: Allows for multi-line text input.
5. <select> / <option>: Creates a dropdown list.
HTML for Slideshows
1. <div>: Used as a container for each slide.
2. <img>: Displays images within the slideshow.
3. <button>: Creates buttons for navigation (e.g., next/previous slide
Other Useful Tags
1. <span>: Inline container for styling a specific text or section.
2. <table> / <tr> / <td>: Defines a table, rows, and cells, respectively.
3. <style>: Embeds CSS directly into the document.
4. <script>: Embeds JavaScript code or links to an external script.
5. <footer>: Represents the footer section of a document.
Here are CSS properties and their meanings, categorized for clarity:
CSS Properties for Text
1. color: Sets the color of the text.
o Example value: red, #000000, rgb(255, 0, 0)
2. font-size: Defines the size of the text.
o Example value: 16px, 1.5em
3. font-family: Specifies the font of the text.
o Example value: "Arial", "Times New Roman"
4. font-weight: Determines the thickness of the text.
o Example value: normal, bold, 300
5. text-align: Aligns text horizontally.
o Example value: left, center, justify
CSS Properties for Box Model
1. margin: Creates space outside an element's border.
o Example value: 10px, auto
2. padding: Creates space between content and the border.
o Example value: 10px 15px
3. border: Sets the border around an element.
o Example value: 1px solid black
4. width / height: Sets the dimensions of an element.
o Example value: 100px, 50%
CSS for Background
1. background-color: Sets the background color of an element.
o Example value: blue, #f0f0f0
2. background-image: Adds an image as the background.
o Example value: url('image.jpg')
3. background-size: Controls the size of the background image.
o Example value: cover, contain
CSS for Positioning
1. position: Specifies how an element is positioned in a document.
o Example value: static, absolute, fixed
2. top / left / right / bottom: Moves the element relative to its position.
o Example value: 10px, 5%
3. z-index: Defines the stack order of elements.
o Example value: 1, 10
CSS for Flexbox and Grid
1. display: Defines the layout model of an element.
o Example value: flex, grid, block, inline
2. justify-content: Aligns items horizontally in a flex or grid container.
o Example value: center, space-between
3. align-items: Aligns items vertically in a flex or grid container.
o Example value: flex-start, stretch
CSS Animations and Transitions
1. transition: Adds a smooth change between property values.
o Example value: all 0.3s ease
2. animation: Defines keyframe animations for an element.
o Example value: slideIn 2s infinite
CSS for Responsive Design
1. @media: Adds rules for specific screen sizes.
o Example: @media (max-width: 600px)
2. max-width: Sets the maximum width of an element.
o Example value: 1200px
