reading-notes

201 Read: Class 03 Notes

Summary: This class is about HTML Lists, Control Flow with JS, and the CSS Box Model

Ordered and Unordered Lists

The ol HTML element represents an ordered list of items — typically rendered as a numbered list. The ul element is for grouping a collection of items that do not have a numerical ordering, and their order in the list is meaningless.

This attribute sets the bullet style for the list. The values defined under HTML3.2 and the transitional version of HTML 4.0/4.01 are:

circle disc square

The ol and ul elements both represent a list of items. The difference is with the ol element, the order is meaningful. For example:

Steps in a recipe Turn-by-turn directions The list of ingredients in decreasing proportion on nutrition information labels

type Sets the numbering type:

a for lowercase letters A for uppercase letters i for lowercase Roman numerals I for uppercase Roman numerals 1 for numbers default

Sources:

https://developer.mozilla.org/en-US/docs/Web/HTML

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/ul

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/ol

CSS Box Model

Parts of a box

Content box: The area where your content is displayed; size it using properties like inline-size and block-size or width and height.

Padding box: The padding sits around the content as white space; size it using padding and related properties.

Border box: The border box wraps the content and any padding; size it using border and related properties.

Margin box: The margin is the outermost layer, wrapping the content, padding, and border as whitespace between this box and other elements; size it using margin and related properties.

Padding box: The padding sits around the content as white space; size it using padding and related properties.

Sources:

https://developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/The_box_model#what_is_the_css_box_model

https://developer.mozilla.org/en-US/docs/Web/HTML

Questions to Answer

What data types can you store inside of an Array?

Is the people array a valid JavaScript array? If so, how can I access the values stored? If not, why?

List five shorthand operators for assignment in javascript and describe what they do.

Read the code below and evaluate the last expression and explain what the result would be and why.

Describe a real world example of when a conditional statement should be used in a JavaScript program. Give an example of when a Loop is useful in JavaScript.

Sources:

https://developer.mozilla.org/en-US/docs/Learn/JavaScript/First_steps/Arrays

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Expressions_and_Operators

https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Building_blocks/conditionals

https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Building_blocks/Looping_code

Things I want to know more about

Coding Math

https://www.youtube.com/user/codingmath