User:Michel W/Self-learning: Difference between revisions
No edit summary |
No edit summary |
||
Line 1: | Line 1: | ||
<div style=" font-family: Times New Roman; font-size: 16px; "> | <div style=" font-family: Times New Roman; font-size: 16px; "> | ||
== '''⭑HTML⭑''' == | |||
[https://github.com/Michelmsw My⭑Github⊹⊹⊹ ] | [https://github.com/Michelmsw My⭑Github⊹⊹⊹ ] | ||
Line 31: | Line 31: | ||
⊹Option + Command + I --- Google Chrome | ⊹Option + Command + I --- Google Chrome | ||
== | == ⭑CSS⭑ == | ||
⊹Syntax simple CSS selectors: | ⊹Syntax simple CSS selectors: |
Revision as of 15:50, 30 December 2023
⭑HTML⭑
⊹Well chosen content of H1 element is crucial to SEO.
Html Entities:
- Help avoid rendering issues
- Safeguard against more limited character encoding
- Provide characters not available on a keyboard
Instead of | < | > | & |
Use: | < ; | > ; | & ; |
Use nbsp;
HTML document ALWAYS appear together on 1 line
After the 1st word and after the 2nd word (with no spaces in between words and entity references)
⊹Option + Command + I --- Google Chrome
⭑CSS⭑
⊹Syntax simple CSS selectors:
- Element
- class (define with .)
- id (define with #)
⊹Combining Selectors:
- Element with class selectors (selector.class)
- Child (direct) selector (selector > selector)
- Descendant selector (selector selector)
-Didn't cover:
- Adjacent sibling selector (selector + selector)
- General sibling selector (selector ~ selector)
⊹Pseudo-Class Selector
- : link
- : visited
- : hover
- : active
- : nth-child
<link ref="stylesheet" href="style.css">
⊹Conflict Resolution:
- Origin precedence: Last declaration wins
- Inheritance: DOM Tree
- Specificity: Most specific selector combination wins
(Score) 1. Style="..." 2. ID 3. Class, pseudo-class, attribute 4. # of Elements
⊹Styling Text:
.style { font-family: Arial, Helvetica, sans-serif; color: #0000ff; font-style: italic; font-weight: bold; font-size: 24px; text-transform: uppercase; text-align: center; }