Skip to content

Instantly share code, notes, and snippets.

@NaomiKC92
Last active April 29, 2019 10:20
Show Gist options
  • Save NaomiKC92/8e19f0061ca63dfbbbab2837ca1f4dbe to your computer and use it in GitHub Desktop.
Save NaomiKC92/8e19f0061ca63dfbbbab2837ca1f4dbe to your computer and use it in GitHub Desktop.

DAY 1

  1. HTML structures the webpage. It separates it into different sections like headings vs body paragraphs and pictures.
  2. Tags are like bookends, they hold the text between them and they also explain what kind of information is there. The text between the tags are the elements.
  3. Attributes provide more information about what is in between the tags. They sit at the front and contain details like name, language or color. 4.The head contains information about the page and usually comes before the body. The body is what is in the main browser window. The title is shown in the top of the browser and on the tab for that page.
  4. To view the source of a webpage, you right click on the open page and select 'View Page Source.'
  5. is the heading element, used for the headings of different sections on the page. makes the enclosed text bold. makes the text italicized. /sup> is used to make things superscrip, such as writing the fourth of July in numbers would be 4th of July to raise the 'th.' makes specified characters subscript, like footnotes inn a textbook.
  6. Empty elements don't contain any text. An empty element might be used to indicate a break between paragraphs. They only have one tag instead of an opening and a closing tag.
  7. Semantic markup doesn't affect the way the webpage looks at all. It is mostly used to add detail to the information displayed and is useful for screen readers which will know what to emphasize or when something is in quotes, as is explained in the textbook.
  8. The three new semantic elements in HTML 5 include the element, and . These are used mostly to add detail to the webpage for developers, screen readers and search engines. It shows what is most important on the page.

CodePen https://codepen.io/naomikc92/pen/zXyzap

DAY 2

  1. Ordered lists use numbers while UNordered lists use bullet points. Definition lists provide a term and then the definition is indented on the next line. 2. Here is the wording you will click on
  2. To make a link open in a new window, you would add 'target="_blank"' inside of the tag. It's good practice to inform the site visitor that clicking the link will open the window in a new tab. 4.To link to a different part of the same page, you should add a list of contents and identify, with the id attribute, which points on the page to jump to.

CSS

  1. CSS tells what needs to be done to each element in HTML. Adding backgrounds, changing font family, color, size, etc... 2.CSS stands for cascading style sheets. Cascading refers to the styling using generic rules to apply to the whole page using specifications within to target certain elements.
  2. CSS rules will always have a selector and a declaration. The declaration will be in curly brackets and contains a property and a value.
  3. You could use a element in an HTML document to tell where to find the CSS file that would style the page.
  4. When building a site with more than one page, you should use an external style sheet because it allows you to use one file for all pages rather than altering every page individually. 6.Color hex codes are six-digit codes that represent how much red, green and blue are in the makeup. They are preceded by a pound sign.
  5. HSL stands for Hue, Saturation and Lightness.
  6. Serif, Sans-Serif and Monospace. Serif has details on the ends of letters, while Sans-Serif have straight edges and Monospace letters are all the same width.
  7. Pixel, Percentage and EMS are the three main units used when specifying font size.

Day 3

  1. The type attribute will determine the behavior of the input.
  2. The "select" element creates a dropdown list.
  3. "input type= "submit" .." will send a form to a server. So, "submit" would be the type attribute.
  4. "fieldset" groups related form controls together\

Part 2

  1. Borders are what separate boxes from each other. Margins are outside of the border, sometimes used to separate two boxes. Padding is the space between the border and the content it contains.
  2. 1px is the top, 2px is the right, 5px is the bottom and 10px is the left side.
  3. Block level elements appear like they have a line break between them while in line elements can appear on one line with others.
  4. Fixed positioning keeps an element in the same spot. It doesn't move with the page because it's attached to the browser. The z-index is important with this because it controls which elements will appear when scrolling. The higher its number, the closer it is to the front or top layer.
  5. Fixed width layouts don't change size as the user changes the size of the browsers. Liqiud layouts change size with the altering of the browser window. Fixed width is usually measured in pixels while liquid layouts are measured by percentage.

DAY 4

Chapter 5:

  1. It provides a text description for an image in the event you cannot see the image.
  2. If it is a block image element, the image will be on it's own line with no other contemt. If it is an inline image element, it will share a line with other text or images.
  3. JPEG image file formats is good for pictures with a lot of different colors while PNG is best when posting pictures with few or dull colors or large areas with one color.

Chapter 16:

  1. It is much easier to specify image dimensions across the whole website rather than putting it in HTML.
  2. Sprites are what one image on multiple parts of a website are. They are useful because the browser only needs to collect one image rather than multiple of the same thing.

DAY 5
  1. To declare a variable, you must announce it and name it. ie: var quantity. The equal sign is an assignment operator. It tells what you are assigning the variable as.
  2. Numbers are used for calculating sums and counting. String data is just text of letters and characters in single quotation marks. Boolean data types answer True or False questions.
    1. The name must begin with a letter, dollar sign or underscore, never a number.
    2. You cannot use a dash or a period in a variable name. It may contain numbers, letters, dollar signs or underscores.
    3. You cannot use 'keywords' or 'reserved' words.
    4. All variables are case sensitive.
    5. Use a name that describes the kind of information the variable contains. ie: age, firstName, lastName
    6. If variable name is more than one word, use Capital letters at the beginning of each new word or use underscores to separate them.
  3. Arrays are useful when the list length is unknown and when dealing with a lsit of related items. You access a value to make a change in an array by selecting the item and assigning it a new value of it's own.
  4. Expressions can be as simple as assigning a value to a variable or it can be the returned value of two or more separate values. A statement performs an action.
  5. Arithmetic operators perform basic math tasks. The only String Operator is '+' and it is used to jion two or more strings to make one value. Assignment operators just assign a value to a variable.

DAY 6

  1. In the second example, the function is only named. No task has been assigned to that function.
  2. Parameters are the variables inside the curly braces after a function is declared. Arguments are values passed into code to perform the required calculation.
  3. It's used to return a value to the code that called the function.
  4. Local variables can be removed once they have finished performing their task and can return two different values if run more than once. Global variables would be useful if you needed to repeat the same function on more than one set of variables throughout the script.

DAY 7

file:///Users/naomicampos/Capstone/index.html

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment