STEM: Graphic Arts Merit Badge


  • Click on the “Create Your Own Logo Button” Above
  • Once open in Google Docs, Go to File
  • Then select “Make a Copy” to save your own file
  • Have fun creating your own logo

Coding HTML & CSS

Basic HTML and CSS Definitions

  • HTML: Hypertext Markup Language, a standardized system for tagging text files to achieve font, color, graphic, and hyperlink effects on World Wide Web pages
  • CSS: A cascading style sheet (CSS) is a Web page derived from multiple sources with a defined order of precedence where the definitions of any style element conflict.
  • Container: the container is the area enclosed by the beginning and ending tags. For example encloses an entire document while other tags may enclose a single word, paragraph, or other elements.
  • Divider or
    : The
    tag defines a division or a section in an HTML document. The tag is used to group block-elements to format them with CSS.
  • Class: The class attribute specifies one or more classnames for an element. The class attribute is mostly used to point to a class in a style sheet. However, it can also be used by a JavaScript (via the HTML DOM) to make changes to HTML elements with a specified class.
  • ID: The id attribute specifies a unique id for an HTML element (the value must be unique within the HTML document). The id attribute is most used to point to a style in a style sheet, and by JavaScript (via the HTML DOM) to manipulate the element with the specific id.

Here’s what the HTML code looks like for the paragraph above:

1 Column, 3 individual “Div”s with a single “Class”

Sample Div 1
Sample Div 2
Sample Div 3

3 Equal Columns, each with a unique “ID”

Scout 1

Scout 2

Alex Balboa