Anchor Tags<a> </a> Used to create links in a Web page and must specify the page, file, or location to which it links Link to a Web site <a href=”URL”>linktext</a> a href: hypertext reference URL: Name of the URL or linked page or file linktext: The clickable word or phrase that appears on the Web page
Anchor Tags<a> </a> Link for E-Mail The anchor tags <a> </a> are also used to create an e-mail link <a href=”mailto:firstname.lastname@example.org”>linktext</a> mailto: Uses the word mailto to indicate it is an email link followed by a colon and the e-mail address to which to send the message Linktext: Clickable text is typically the e-mail address used in the e-mail link
Setting Link Targets (for links within the same page) To create links within the same Web page, the targets for the links need to be created first.
A target is a named location within a Web page to which a link can be created.
Setting Link Targets (for links within the same page) The <a> tag specifies a target (named location) in the same file. Links to link targets are created using the <a> tag with the name attribute, using the form: <a name=”targetname”> </a> Name: Uses the NAME attribute instead of the HREF attribute Targetname: Must be a unique name on that Web page Space: No text displays; the target is not intended to display as a clickable link
Adding Links to Link Targets Links to link targets are created using the <a> tag with the name attribute <a href=”#targetname”> </a> #: Note the use of the pound sign # Targetname: Name of the link target in that Web page
Adding an Image Link The <a></a> tags are used to set the image as a clickable element for the link <a href=”name of image”>
The end tag </a> will be added after the image tag (img)
Format Text in Bold <b> </b> = physical style (specify a particular font change that is interpreted strictly by browsers)
<strong> </strong> = logical style (allow browsers to interpret the tag based on browser settings—relative to other text in a Web page) which browsers interpret as displaying the text in bold font
Adding an Image with Wrapped Text You MUST enter a <br /> tag to end the text wrapping!!!!
To end right-aligned text wrap, <br clear=”right”/> To end left-aligned text wrap, <br clear=”left”/> To end both left and right, <br clear=”all”/>
The align attribute also supports values to align text with the top, middle or bottom of the image—vertically (P 102)
Using Horizontal and Vertical Spacing Using Horizontal and Vertical Spacing Use hspace (horizontal spacing) and vspace (vertical spacing) attributes to control the spacing between and around images <imgsrc=”name” align=”right” alt=” “ width=” “ height=” “ hspace=”20” />
Thumbnail Images (smaller version of image) The HTML code to add a thumbnail image that links to a larger image <a href=”largeimage.gif”> <imgsrc=”thumbnail.gif” /></a>
Background Image Must be added in the <body> tag <body background=” “>
Font Tag Attributes <font color= “either name or number of color”> <font color = “yellow”> </font> <font face = “fontname”> <font name = “tahoma”> </font> <font size= “value”> One to seven; three is the default <font size = “7”> </font>
Anchor Tags Name a link target: <a name = “top”> </a> Add a link to that target: <a href = “#top”> </a> Link to another Web site: <a href = “http:google.com”> </a> Link to a file: < a href = “project3.htm”> </a> E-mail link: <a href = mailto:email@example.com> </a>