CPSC 120, Fall 2011
About the First Test

The first test in CS 120 will be given in class on Wednesday, September 19. It will cover everyting that we have done so far, including the labs and the reading. However, you are not responsible for memorizing every detail of HTML, CSS, and JavaScript. This page includes a list of things that you should know. You can also consult the list of readings from the textbook, on the course web page at http://math.hws.edu/eck/cs120. (However, that list includes some reading on HTML tables, which we did not cover; there is nothing about <table> elements on the test.)

On the test, you should expect several types of questions. There will be some essay questions about definitions and concepts. There could be questions about the design of web sites or web pages. You will have to write some HTML code and some CSS code. You will have to write some simple JavaScript expressions and perhaps use them in buttons. You might be given some HTML, CSS, or JavaScript code and asked what it does.

Here are some terms and ideas that you should be familiar with:

Web browser
Web server
request/response (browser sends request, server sends response)
presentation (also called style)
separation of presentation from content, and why it's a good idea
tag (for example <h1>)
end tag (for example </h1>)
attribute (for example, src in <img src="me.png">)
structure of an html file
the "head" and "body" sections in html
links on a web page
absolute URLs such as  http://math.hws.edu/eck/index.html
relative URLs such as  page1.html, images/mypic.jpg, ../index.html
the <style> section of an html file
CSS rules
CSS selectors
CSS properties
block display and inline display for HTML elements
<div> and <span> and why they are used
HTML id and class attributes and how they are used
using <button> to make a page interactive
multi-page web sites
navigation of a web site; navigation links
putting CSS in a separate file, and why it is done

You should be able to write original HTML and CSS using:

HTML: <h1>, <h2>, <h3>
      <ul> and <li>
      <a href="...">
      <img src="...">
      <button onclick="...">
      the attribute  id="..."
      the attribute  class="..."

CSS properties:   color                 (with color names, like red and black)
                  margin, margin-left, margin-top, etc.                
                  padding, padding-left, padding-top, etc.
                  specifying sizes with measurements (2.5cm) and percentages (150%)

CSS selectors:    basic selectors ( tag names such as  h1  or  p )
                  id selectors    ( such as  #main  or  #content )
                  class selectors ( such as  .intro  or  p.address )

JavaScript:   know how to use document.getElementById("...")
              know hor to use a JavaScript command in <button>

              setting the style of an element 
                  (Example: document.getElementById("foo").style.color = "red")

              setting the innnerHTML of an element
                 (Example: document.getElementById("foo").innerHTML = "Hello")
              setting the src of an image
                 (Example: document.getElementById("pic").src = "MyVacation.jpg")

In addition, you should be able to understand code that uses:

       <link rel="stylesheet" type="text/css" href="...">
       <i>, <b>, and <tt>
       <div>, <span>
       <button onclick="...">
       the attribute  style="..."

CSS properties:  

       text-align                 (left, right, center)
       font-style                 (italic, normal)
       font-weight                (bold, normal)
       font-family                (serif, sans-serif, monospace)
       display                    (block, inline, none)
       border, border-left, etc.  (values such as  thin solid black )