Presentation is loading. Please wait.

Presentation is loading. Please wait.

Need to define two things: › The destination › Something to click on to get there  Tag is click here  Can be text, special character or image (next.

Similar presentations


Presentation on theme: "Need to define two things: › The destination › Something to click on to get there  Tag is click here  Can be text, special character or image (next."— Presentation transcript:

1

2 Need to define two things: › The destination › Something to click on to get there  Tag is click here  Can be text, special character or image (next week)  Can change the text format

3  Always link to an anchor point  Implicit anchor point at top of page › Anchor referenced as null  Adding other anchor points › Insert named anchor point › id=“anchor” on any tag

4  To point to an anchor point on SAME page link text top of page

5  To point to an anchor point on SAME page link text top of page  In order to access anchor point on another page Link text

6  Can use any formatting that you want  Links have states (visited or not, hovering)  Can change attributes for all states with a { Property: value; }

7  Characteristics of tags that can have their own attributes  Not reflected in HTML  In CSS: tag:pseudo-element

8 Link states a:link -- a normal, unvisited link a:visited -- a link the user has visited a:hover -- a link when the user mouses over it a:active -- a link the moment it is clicked Note: CSS order important hover must come after link & visited active must come after hover LoVe HAte a:link { color: #FC5BD4; } a:visited { color: black; }

9  Long pages › Avoid too much scrolling › Links to subsections › Link to top  Lots of topics › Use a “table of contents” of links

10  Use full url Link text  To force open in a new tab (window) Link text GOOD PRACTICE REQUIRED IN THIS CLASS

11  Header, includes › h1 title › Nav(igation)  Section or div for main body  Footer

12  Paragraph in each section may want to look different › Smaller in header or footer  Lists › No bullets › In a line › Different spacing

13  Name the context in the css by using a space header p { text-align: center; } footer p { text-align: right; }


Download ppt "Need to define two things: › The destination › Something to click on to get there  Tag is click here  Can be text, special character or image (next."

Similar presentations


Ads by Google