Wednesday, July 27, 2011

What is CSS - Liams Class

In Class we has to read the following article and answer the questions-

  1. How do you set the background colour of your website? 
  2. How do you set a background image and repeat it horizontally?
  3. How do you set the font size of all paragraphs to be 14px?
  4. How do you underline text?
  5. What is a pseudo-class?
  6. How do you set the colour of all links on your website to be red?
  7. How do you set the roll-over colour of all links to be orange?
  8. What is the Box Model?
  9. What are the two ways we can increase space around content?
  10. What is the purpose of a 'div' tag?
  11. When is a 'class' more appropriate to use than an 'id'?
  12. What is a floating element and when is it useful?


1. To set the background colour of the website the code used is body {background-color: #FF0000;}
2. The value to repeat the image horizontally is background-repeat: repeat-x an example of what this would like like in code would be  body {
  background-color: #FFCC66;
  background-image: url("butterfly.gif");
  background-repeat: no-repeat;

 h1 {
  color: #990000;
  background-color: #FC9804;
3. To set the font size to 14px on all paragrphs you would use the value 
h2 {font-size: 12pt;}
4. to underline text use the value h1 { text-decoration:underline;}
5. A pseudo-class allows you to take into account different conditions or events when defining a property for an HTML tag.
6. To change all links to red you would use the following tags - 
a { color:red; }
7. to change the link to be orange when you roll over a link you set the following values;
a:hover { color: orange; font-style: italic}
8 . A box model is the boxes which are created for HTML elements. It also contains options for adjusting margin, border, padding and content or each element
9. two ways to increase space around conext is by using margins and padding to. To change the value of space using margin values use the following;
body { margin: 100px 40 px 10 px 70px; }
to change the padding use the flowing:
padding: 20px 20px 20px 80px;
10. A div tag is used to group one or more block-level elements.
11. What is special about the attribute id is that there can not be two elements in the same document with the same id. Each id has to be unique. In other cases, you should use the class attribute instead*
12.  a floating element is when a box with its contents either floats to the right or to the left in a document this option is useful when you would want text to wrap around an image.

No comments:

Post a Comment