Styling
Set text color to White:
Q 1: what hex code does this produce?
Answer:FFFFFF
h1 {
font-family: Arial, Helvetica, sans-serif;
font-size: 2em;
font-weight: bold;
font-variant: small-caps;
color: #FFFFFF;
background-color: #000066;
text-align: center;
}
Question 2: Does the background stop where the text stops?
Does the background stay a fixed width when you move the right side of the browser window in to the center?
What does this tell you about a block level tag?
Answer: The backgroung does not stop where the text stops, it stays the same size but goes completley across the page. A block level tag has a clear box around it.
Style whole page
Q 3a: What has changed about the text?
Ans: It changed style and size. It became shorter but more spread out.
Preview in I.E, View —> Text Size (change)
Q 3b: What happens (if anything)?
Ans: The bullets next to the text get larger or smaller when the text size is changed in view.
Preview in Netscape, View —> Text Zoom (change)
Q 3c: What happens now?
Ans: The text becomes bigger but everything else stays the same including the pictures and the spaces. The web site appears more cramped because of the oversized text.
Styling Image box
Q 4a: Does anything show in the DW Design pane?
Some of text and the pictures overlap and make it hard to read in the DW Design pane but nothing else I can see has changed.
Preview with Netscape.
Q4b : What do you see in the Netscape browser?
There is a very faint yellow line surrounding the pictures, the text does not overlap the line.
Q4c : What do you conclude?
The border spaces the text away from the picture so it is easier to
read and a lot less cramped. It only shows up on the site and not the
design pane.
I forgot to put the URL for my page the first time but here it is.
Question 1: In the img tag what do the attributes
width and height represent?
What units are they in? The width and the height attributes represent the size of the graphic. The unit it is in is pixels.
Question 2: What attribute codes appear?
pimg src="../graphics/_39091308_robinson203.jpg" name="jason_robinson" width="203" height="152" id="jason_robinson" //p
I could not put any of the arrows in because my blog thought they were commands.
Question 3: Which text appears as the pop-up.
The alt or title text?
The title test appears as, "Jason's got the ball."
Question 4: Now which text appears as the pop-up.
The alt or title text?So why does one need both alt and title attributes
on a graphic?
Even though I believe the alt text is suppossed to pop up the title
text popped up. I am not sure why both the alt and the title attributes
are needed.
Question 5: What's happened to the picture?
Has the image size changed?
What else gives you a clue that something's amiss
Once I changed the height and width the picture changed to a smaller
size to conform to the new size. The picture is distorted and unclear.
Unlike the original numbers, the new sizes that I put in are bold.
Question 6a: Where does the caption text appear?
It appears right under the graphic.
Question 6b: What happens to the graphic and caption?
The graphic moves directly to the far right of the screen and the
caption stays on the left, but moves up so it is across from the middle
of the picture.
Question 6c: Now what happens?
The graphic moves directly back to the left and the caption moves right
next to the graphic on the right side. The caption stays in the middle
of the graphic.
Question 7: What code gets added?
pahref="http://news.bbc.co.uk/sport2/hi/rugby_union/rugby_world_cup/team_pages/england/players_to_watch/2944000.stm"
Question 8: What has changed about the graphic?
The graphic now has a thicker black line bordering it.
Question 9: What happens when you click on the graphic
(2 things)? When I click on the graphic, a new window opens and it is
the source page of the graphic. It is not possible to go back. the
internet trail can not be followed backwards. A hand instead of a
pointer is shown.
Go to my graphics page