ReadingNotes

HTML Lists, Control Flow with JS, and the CSS Box Model

Ordered list

The html element for for ordered list is (ol). Ordered list is an list of items typically rendered as a number list.

Unoredered list

The ul is the html element that represents an unoredered list of items usually listed as a bulleted list.

CSS the box mdoel

Everything in CSS has a box around it it. Learning to understand these boxes is the key to being able to create more complicated layouts with CSS or just to align items with other items. Boxes have an inner display type and outer display type.

Outer display type

If a box has an outer display type of block then: The box will break onto a new line, The width and height properties are respected, padding margin and border will cause other elements to be pushed away from the box.

If a box has an outer display type of inline, then: The box will not break onto a new line. The width and height properties will not apply. Vertical padding, margins, and borders will apply but will not cause other inline boxes to move away from the box

Arrays

Arrays are described as list like objects; theyre basically single objects that contain multiple values stored in a list.

Arrays consists of square brackets and items that are seperated by commas. FOR example: const shopping = [‘bread’ , ‘milk’ , ‘cheese’ , ‘hummus’ , ‘noodles’]; console.log(shopping)

QUESTIONS

HTML QUESTIONS

  1. You should use unordered list when rearranging the order of the list items so it would not create confusion or change the meaning of the info on the list.
  2. You cant change bullet point styles in html. You can only change them in css.
  3. You use an ordered list when you need something done in an specific order like cooking steps. You use the unoredered list when you dont need something in a specific order.
  4. Type attribute and start attribute

CSS Questions

  1. Margin is like moving boxes around. Like i split 2 boexs in order to put some space in the middle. I added padding in between the boxes for when i put something there.

  2. Content is the text and images appear, padding clears an around the content, border goes around the padding and content, and margin clears an area outisde the border.

JavaScript Question

  1. Intergers, booleans, strings, objects.
  2. Yes it is, to access this you need to chain 2 square brackets to access deeper into arrays.
  3. +=, -=, *=, /=, %=
  4. You would get 10dog because its 2 strings so they combine but c is false, has no string value so it does nothing.
  5. If your variable equals x, do this for your program, else do this for your program.
  6. when you want to loop until condition is fulfilled, when asking the user for their credit card information.

Things i want to know more about

  1. i want to know more about arrays and how to use them.