Header 1

here is where i'm going to take notes on html stuff, so i can have one place where i can easily check how to do something if i forget! there will be everything i learn here, from super simple to however advanced i get! i may or may not make this page accessible from the home page, not sure yet.

most, if not all, things in this page are going to be phrased in a way that makes it easy for me to understand and remember. this might not make the most sense to other people! i'll try my best to take notes accurately, so i hope nothing here is incorrect. but just like any site with html tutorials may phrase things different, this one is the same.

the sections are in order of most basic first, but some things will be at the top to make it more convenient to reference this page

    contents
  1. basic text formatting
  2. symbols and characters
  3. lists (wip)
  4. basic html terms (big wip)

basic text formatting

  • use <b>text</b> for bolded text
  • use <i>text</i> for italicized text
  • use <u>text</u> for underlined text
  • use <s>text</s> for strikthrough text

    put headers here

symbols and characters

some symbols that are used while coding cannot be used in plain/basic text, since they'll be read as part of the code and cause an error or just not show up. to get around this, an entity is needed.

  • &amp; = &
  • &lt; = <
  • &gt; = >
  • &quot; = "

lists

there are two types of lists: ordered lists and unordered lists.

ordered lists look like this:

    title
  1. point
  2. point
  3. point

and unordered lists look like this:

    title
  • point
  • point
  • point

to make a list,

  1. use the opening tags <ol> or <ul> for ordered or unordered lists, respectively.
  2. after the opening tag, put any text you want to be in the title. titles are not necessary for the list to work and can be completely skipped!
  3. use the tag <li>, regardless of the type of list being made, to make a point in the list. put whatever text you want in that point after the tag. this tag doesn't need a closing tag, so either repeat this step, or go on to finish the list!
  4. don't forget the closing tag when you're done! (i like to type both of the tags before i type the content of the list in between them.)
  • you can put another list within a list to make a sub-point underneath a point.
    • like this!
    • to do so, just follow the steps to make a list, but after the <li> tag.
      • this can also be done multiple times!
  • the <br> and <p> tags can also be used within a list
      they look like this:
    • there's nothing after this point
    • after this point is the <p> tag

    • after this point is nothing,
      • but the list inside of it has the <br> tag after it's closing tag.
      • the tag works with only one of them only when its after a list itself rather than just a point.

    • this point is on it's own, so after this it is two <br> tags

    • there's nothing under this tag
      • and a list inside of it to see how it looks
    • and here's another regular point.

basic html terms

  • tags - what html uses to work! coding with html is coding using tags and text.
    • there are two types/parts of tags: opening and closing.
      the opening tag goes before the text that a tag affects, and the closing tag goes after.
      both tags say something to the text to tell it what to do. with most tags used, the closing tag is super important since it tells the text where to stop doing what it's doing.
      (accidentally putting another opening tag instead of a closing one can mess up a whole document! i've already done so a couple times making this page...)
    • tags look like this: <opening>text</closing>

  • elements - the parts that make up a page
    • the text and tags surrounding said text together make up an element - the beginning and end of an element are what tags are used to define.
    • for example, <title> and </title> are tags, while <title>text</title> is the title element.

  • body - what shows up when viewing the site in a browser; the main content of the document
    • the body tags tell the code what to show when somebody is viewing the product/output, anything outside of them will not show

  • attributes are in the tutorial i'm reading but i'm not really using them much yet so i'll add them here later

  • note to self when a listed point is on its own it needs 2 breaks after, if it has points underneath/inside of it like those above they only need one break for the same space


this file is just to hold the template im using for my site so i can easily copy and paste it. note to self: do not alter anything in this file!

html/css by
pomelo ;)