GFGC CHIKKABASUR(HTML)
Download as PPTX, PDF•0 likes•37 views
This document provides an introduction to HTML (Hypertext Markup Language) and its basic tags and structures. It discusses what HTML is, common tags like <b> and <i> for bold and italics, nested tags, the basic structure of an HTML page with <html>, <head>, <title>, and <body> tags. It also covers how to format text, add headings, comments, images and more using HTML tags.
GFGC CHIKKABASUR(HTML)
- 1. GOVT FIRST GRADE COLLEGE CHIKKABASUR Department of Computer Applications CLASS : Bcom ii Year SUBJECT : Computer APPLICATIONS II TOPIC NAME : Introduction HTML Presented By : Prof. SHRIDEVI S G Dept of Computer Applications
- 3. What is HTML? • HTML, otherwise known as HyperText Markup Language, is the language used to create Web pages • Using HTML, you can create a Web page with text, graphics, sound, and video
- 4. Tags • The essence of HTML programming is tags • A tag is a keyword enclosed by angle brackets ( Example: <I> ) • There are opening and closing tags for many but not all tags; The affected text is between the two tags
- 5. More Tags... • The opening and closing tags use the same command except the closing tag contains and additional forward slash / • For example, the expression <B> Warning </B> would cause the word ‘Warning’ to appear in bold face on a Web page
- 6. Nested Tags • Whenever you have HTML tags within other HTML tags, you must close the nearest tag first • Example: <H1> <I> The Nation </I> </H1>
- 7. Structure of a Web Page • All Web pages share a common structure • All Web pages should contain a pair of <HTML>, <HEAD>, <TITLE>, and <BODY> tags <HTML> <HEAD> <TITLE> Example </TITLE> </HEAD> <BODY> This is where you would include the text and images on your Web page. </BODY> </HTML>
- 8. The <TITLE> Tag • Choose the title of your Web page carefully; The title of a Web page determines its ranking in certain search engines • The title will also appear on Favorite lists, History lists, and Bookmark lists to identify your page
- 9. Text Formatting • Manipulating text in HTML can be tricky; Oftentimes, what you see is NOT what you get • For instance, special HTML tags are needed to create paragraphs, move to the next line, and create headings
- 10. Text Formatting Tags <B> Bold Face </B> <I> Italics </I> <U> Underline </U> <P> New Paragraph </P> <BR> Next Line
- 11. Changing the Font • The expression <FONT FACE = “fontname”> … </FONT> can be used to change the font of the enclosed text • To change the size of text use the expression <FONT SIZE=n> …. </FONT> where n is a number between 1 and 7
- 12. Changing the Font • To change the color, use <FONT COLOR=“red”>…. </FONT>; The color can also be defined using hexadecimal representation ( Example: #ffffff ) • These attributes can be combined to change the font, size, and color of the text all at once; For example, <FONT SIZE=4 FACE=“Courier” COLOR=“red”> …. </FONT>
- 13. Headings • Web pages are typically organized into sections with headings; To create a heading use the expression <Hn>….</Hn> where n is a number between 1 and 7 • In this case, the 1 corresponds to the largest size heading while the 7 corresponds to the smallest size
- 14. Aligning Text • The ALIGN attribute can be inserted in the <P> and <Hn> tags to right justify, center, or left justify the text • For example, <H1 ALIGN=CENTER> The New York Times </H1> would create a centered heading of the largest size
- 15. Comment Statements • Comment statements are notes in the HTML code that explain the important features of the code • The comments do not appear on the Web page itself but are a useful reference to the author of the page and other programmers • To create a comment statement use the <!-- …. --> tags
- 16. The Infamous Blink Tag • It is possible to make text blink using the <BLINK> … </BLINK> tag • However, it is best to use this feature at most sparingly or not at all; What seems like a good idea to a Web designer can become very annoying to a Web user • The <BLINK> tag is not supported by Internet Explorer
- 17. Page Formatting • To define the background color, use the BGCOLOR attribute in the <BODY> tag • To define the text color, use the TEXT attribute in the <BODY> tag • To define the size of the text, type <BASEFONT SIZE=n>
- 18. Example <HTML> <HEAD> <TITLE> Example </TITLE> </HEAD> <BODY BGCOLOR=“black” TEXT=“white”> <BASEFONT SIZE=7> This is where you would include the text and images on your Web page. </BODY> </HTML>
- 19. Inserting Images • Type <IMG SRC = “image.ext”>, where image.ext indicates the location of the image file • The WIDTH=n and HEIGHT=n attributes can be used to adjust the size of an image • The attribute BORDER=n can be used to add a border n pixels thick around the image
- 20. Alternate Text • Some browsers don’t support images. In this case, the ALT attribute can be used to create text that appears instead of the image. • Example: <IMG SRC=“satellite.jpg” ALT = “Picture of satellite”>
- 21. THANK YOU