start links and images of html section

2023-04-04 03:22:32 -07:00 · 2023-04-04 03:22:32 -07:00 · 4d2367c3cb
commit 4d2367c3cb
parent f8cf891438
8 changed files with 69 additions and 5 deletions
--- a/Markdown/TheOdinProjectNotes.md
+++ b/Markdown/TheOdinProjectNotes.md
@ -54,7 +54,7 @@ cat ~/.ssh/id_ed25519.pub
 git remote set-url origin https://'username':'password'@repositorylink
 ```
 ## Using Git
- Check git version by using ```git --version```
+- Check git version by using `git --version`
 - After creating a new repository you can clone it to your current directory by using ``` git clone <repolink>```
 - After the cloning, check the url with ```git remote -v``` 
 - Use ```git status``` to check the status of the current files within your directory
@ -175,13 +175,77 @@ git remote set-url origin https://'username':'password'@repositorylink
 </html>
 ```
 - **VSCode can generate the entire boilerplate by entering `!` into a blank `.html` document**
-## Working With Text
+### Working With Text
-### Paragraphs
+#### Paragraphs
 - If text is not preceded by a `<p>`, then it will all clump together as one large body of text
 - ![](images/chrome_dnDCL9ylH1.png)
 - ![](images/chrome_r0YaBjn2YV.png)
-### Headings
+#### Headings
 - These use the `<hx>` tag where `x` is the number that changes the font
  - `<h6>` is the smallest font
 - ![](images/chrome_drT4PQKjhb.png)
- 
+#### Strong Element
 - The `<strong>` tag makes text **bold**
 - It also marks text as important semantically 
  - This affects tools like screen readers for visual impairments
  - It will change the tone of the voice for the content within the `<strong>` tag
 ```HTML
 <strong>Showing bolded wording</strong>
 ```
 - ![](images/chrome_qSqVJNFNTe.png)
 #### Em Element
 - The `<em>` tag makes text italic and also emphasises in text to speech
 - ![](images/chrome_qzKKOkOr72.png)
 #### Nesting and Indentation
 - Elements are nested for legibility 
  - Also known as parent/child/sibling elements
  - Similar to braces for code
 ```HTML
 <html>
  <head>
  </head>
  <body>
    <p>Lorem ipsum dolor sit amet.</p>
  </body>
 </html>
 ```
 - ![](images/chrome_AhnmdRAmL7.png)
 #### HTML Comments
 - Comments are not visible when the page is rendered
  - Useful for reading page format when performing maintenance
  - Comments are written with `<!--     -->`, where the comment is inside the whitespace
 ```HTML
 <h1> View the html to see the hidden comments </h1>
 <!-- I am a html comment -->
 <p>Some paragraph text</p>
 <!-- I am another html comment -->
 ```
 - ![](images/chrome_jpELgY8wjN.png)
 ### Lists
 - Lists are one of the most commonly usedd elements/data structures because they neatly organize many items
 #### Unordered Lists 
 - The order is random or irrelevant, then using an unordered list is the right choice
 - It's created by using the `<ul>` tag, with each element inside of the list using the `<li>` tag
 ```HTML
 <ul>
  <li>Item 1</li>
  <li>Item 2</li>
  <li>Item 3</li>
 </ul>
 ```
 - ![](images/capture1.png)
 #### Ordered Lists
 - Useful when the order of the list matters
 - It's created by using the `<ol>` tag instead with the same `<li>` elements inside of it
 ```HTML
 <ol>
  <li>Item 1</li>
  <li>Item 2</li>
  <li>Item 3</li>
 </ol>
 ```
 - ![](images/capture3.png)
 ### Links and Images
--- a/Markdown/images/capture1.png
+++ b/Markdown/images/capture1.png
--- a/Markdown/images/capture3.png
+++ b/Markdown/images/capture3.png
--- a/Markdown/images/chrome_3i5DrmVUD3.png
+++ b/Markdown/images/chrome_3i5DrmVUD3.png
--- a/Markdown/images/chrome_AhnmdRAmL7.png
+++ b/Markdown/images/chrome_AhnmdRAmL7.png
--- a/Markdown/images/chrome_jpELgY8wjN.png
+++ b/Markdown/images/chrome_jpELgY8wjN.png
--- a/Markdown/images/chrome_qSqVJNFNTe.png
+++ b/Markdown/images/chrome_qSqVJNFNTe.png
--- a/Markdown/images/chrome_qzKKOkOr72.png
+++ b/Markdown/images/chrome_qzKKOkOr72.png