1 / 14

HTML

HTML. What is HTML?. HTML is a language for creating web pages. HTML stands for H yper T ext M arkup L anguage A markup language has tags which are codes that tell the browser how to display the text. HTML documents contain both HTML tags and plain text. Un formatted Web Page.

diep
Download Presentation

HTML

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. HTML

  2. What is HTML? • HTML is a language for creating web pages. • HTML stands for Hyper Text Markup Language • A markup language has tags which are codes that tell the browser how to display the text. • HTML documents containboth HTML tags and plaintext

  3. Unformatted Web Page I Have a Dream By Martin Luther King, Jr. delivered 28 August 1963, at the Lincoln Memorial, Washington D.C. I have a dream that one day this nation will rise up and live out the true meaning of its creed: "We hold these truths to be self-evident, that all men are created equal." I have a dream that one day on the red hills of Georgia, the sons of former slaves and the sons of former slave owners will be able to sit down together at the table of brotherhood. I have a dream that one day even the state of Mississippi, a state sweltering with the heat of injustice, sweltering with the heat of oppression, will be transformed into an oasis of freedom and justice. I have a dream that my four little children will one day live in a nation where they will not be judged by the color of their skin but by the content of their character. If I just typed in the text, and I didn’t format the web page with tags, it would look like this

  4. Formatted Web Page After I format the web pages with tags, it looks like this

  5. What are HTML Tags??? • HTML tags are letters surrounded by angle brackets like <html> or <body> • The browser does not display the HTML tags, but uses the tags to determine how the content of the web page is to be displayed to the user. • HTML tags normally come in pairs like <p>and </p> or <title> and </title>, and the first tag is called either the start tag or the opening tag, and the second tag is called the end tag or the closing tag • The end tag is written like the start tag, except with a forward slash before the tag name

  6. HTML Page Structure <!DOCTYPE html> <html> <body> <h1>My First Heading</h1> <p>My first paragraph.</p> </body> </html> Below is a visualization of the HTML code on the left:

  7. Heading tag • HTML headings are defined with the <h1> to <h6> tags. • The smaller the number, the larger the heading Example <h1>This is a heading</h1> <h2>This is a heading</h2> <h3>This is a heading</h3>

  8. Paragraph tags Line Break tags HTML paragraphs are defined with the <p> tag. Blank lines are inserted between paragraphs A <br /> tag after a line forces the text after it to start on the next line. It does not insert a blank line. This text is on the first line. And this text starts on the next line. Example Code: <p>This is a paragraph.</p> <p>This is another paragraph.</p> Example Code: This text is on the first line. <br/> And this text starts on the next line. This is a paragraph. This is another paragraph.

  9. Image tags In HTML, images are defined with the <img> tag. • The <img> tag defines the attributes of the image only, and has no closing tag. • To display an image on a page, you need to use the srcattribute, which stands for source Syntax for defining an image: <imgsrc=”location" alt=”description"> “location” tells where the image is stored. “description” contains a word or words that will display if the user’s browser can’t see the image. If you put an image tag between two paragraphs, the browser shows the first paragraph, then the image, and then the second paragraph.

  10. Formatting tags <b>This text is bold</b> <i>This text is italic</i> <u>This text is underlined</u> <font color=“red” size=“5” font=“courier”>This text is red, size 5, and Courier</font> This text is bold This text is italic This text is underlined This text is red, size 5, and Courier.

  11. Hyperlink tags and attributes <a href="url”>link text</a> The <a> tag defines the text as a hyperlink. The hrefattribute tells the browser where the link is on the internet. Example: <a href="http://www.lewisteach.com">Computer Lab Website</a> which will display like this: Computer Lab Website and clicking on it will take you to www.lewisteach.com

  12. Title tag and Head tag • The <title> tag tells the user the name of the website. • The <title> tag must be enclosed in the <head> section at the beginning of the webpage. The <head> section has information about the web page that is not displayed. Example: <head> <title>Computer Lab Website</title> </head>

  13. Comment tags The programmer can insert comments that are notes for only the programmer to see. Comments are not displayed on the web page so they can’t be seen by the user. A comment is written like this: <!-- This is a comment --> Note: There is an exclamation point after the opening bracket, but not before the closing bracket.

  14. Let’s create a web page!

More Related