1 / 21

Chinese Building

Chinese Building. Today’s Topic. Review last lab Links. Skeleton of a html page. < html> <head> </head> <body> </body> </html >. Attributes. Attributes supplement information an elements (tags) give to the browser -- tags tell browsers what to do

raleigh
Download Presentation

Chinese Building

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Chinese Building

  2. Today’s Topic • Review last lab • Links

  3. Skeleton of a html page <html> <head> </head> <body> </body> </html>

  4. Attributes • Attributes supplement information an elements (tags) give to the browser -- tags tell browsers what to do -- attributes tell browsers how to do

  5. <HR>horizon line • <HR>’s attributes (1) size <hr size = 10> (2) width < hr width= 50> <hr width= 50%> (3) align <hr align=left> <hr align = right>

  6. Formatting Text(1) • Headers six levers <h1> … <h6> <H1> … </H1> .. <H6> … </H6>

  7. Font --Formatting Text(2) • The <FONT> tag uses following attributes: • Size: can be relative (+2, -2 ,etc..) or absolute (1-5) • Color: for now you can make this red, blue, etc... <FONT size='+2' color='red'>Born: November 16, 42 BC</FONT><BR>

  8. Control Size? • Absolute size (1.. 7) <font size= 4> … </font>

  9. Changing the actual Font? • In that case use the face attribute <FONT face='arial'> Navigating the Internet </FONT><BR>

  10. Background Color • The bgcolor of the <BODY> tag <BODY bgcolor='yellow'> a summary is at plaza.ufl.edu/yuyang/lab4/bgcolor.htm

  11. <CENTER> tag • Causes enclosed block to be centered <CENTER> …… </CENTER>

  12. Links • Relative • Links to things on your website • Absolute • Links to things not on your website • Others • Things like email links

  13. Absolute Links • These are the complete urls that you see in a browser address bar. • Specify the absolute location of a website or a page Ex. http://www.yahoo.com http://www.cise.ufl.edu/class/cgs3066sp04

  14. Relative Links • Relative to what? • Relative to our current page, could be just a filename • myimage.jpg • Or a directory and filename • pictures/myimage.jpg • Relative to our site • /myimage.jpg

  15. Mail Link • This works somewhat like a absolute link • mailto:yuyang@cise.ufl.edu <A HREF=mailto:yuyang@ufl.edu>… </A>

  16. More about mailto link <A href="mailto:someone@ufl.edu? cc=someone1@ufl.edu& bcc=someone2@ufl.edu& subject=Summer%20Party& body=Hello%20world! "> Send mail! </A>

  17. How do we put it on our page • The Anchor tag <A> • Has a attribute href which value is our link • Inside the Anchor block we put the text or image that we want to click. <A href='http://www.yahoo.com'>Yahoo</A> <A href=“lab1.html”>Lab 1</A>

  18. Open a link in a new browser window <a href=“mypage.htm" target="_blank"> My page </a>

  19. Link to a location on the same page • Pagemark (bookmark) #mymark Define: <A NAME=“mymark”> …</A> Usage: <A href=“#mymark”> … </A>

  20. Link to named anchor in other pages • In page one, page1.html, we have <A name=“anchor1”> Here are </A>… In page two, we can write <A href=“page1.html#anchor1> …. </A>

  21. Assignment

More Related