Scribd
Upload
106 views18 pages

John Ryan B. Lorca Instructor I: (An Introduction)

HTML is a markup language used to define the structure and layout of web pages. HTML uses tags placed within angle brackets to denote elements like paragraphs, headings, links, images, and more. Common tags include <p> for paragraphs, <b> for bold text, <a> for links, and <img> for images. An HTML document has a basic structure with <html>, <head>, and <body> tags. Tables, colors, and other elements can be added using tags like <table>, <font color>, and more.

Uploaded by

Eric Nilo
Copyright
© Attribution Non-Commercial (BY-NC)
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
106 views18 pages

John Ryan B. Lorca Instructor I: (An Introduction)

HTML is a markup language used to define the structure and layout of web pages. HTML uses tags placed within angle brackets to denote elements like paragraphs, headings, links, images, and more. Common tags include <p> for paragraphs, <b> for bold text, <a> for links, and <img> for images. An HTML document has a basic structure with <html>, <head>, and <body> tags. Tables, colors, and other elements can be added using tags like <table>, <font color>, and more.

Uploaded by

Eric Nilo
Copyright
© Attribution Non-Commercial (BY-NC)
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
You are on page 1/ 18

HTML

(An Introduction)

John Ryan B. Lorca Instructor I

What is HTML?
Hypertext Markup Language (HTML) A text markup language used to create documents for the web. HTML defines the structure and layout of a web document by using a variety of tags and attributes. The file extension are .html or .htm

HTML Tags
Tags are positioned within the HTML code to apply a certain format It is denoted by <tag_name>, which may have to be closed Example:
<html> ... </html> <br /> -> tag enclosing the HTML code -> line break

HTML Tags: Attributes


Tags do have attributes/properties to set Example:
<font> tag have:
face color Size

usage: <font size=3>some text</font>

General Structure of HTML Code


<html> <head><title></title> <body> some code here </body> </html>

Some Useful Tags


<b>some text</b> - make text bold <strong>some text</strong> - make text bold <i>some text</i> - make text italic <em>some text</em> - make text italic <u>some text</u> - make text underlined <sup>some text</sup> - make text superscript <sub>some text</sub> - make text subscript <br /> - line break <hr /> - horizontal line
6

<font> tag
<font face=Verdana>some text</font> <font color=red>some text</font>

<font size=4>some text</font>


<font face=Verdana color=red size=4>some text</font>

<p> tag (paragraph)


<p>The quick brown fox jumps over the lazy dog.</p> <p align=center>The quick brown fox jumps over the lazy dog.</p>

Align: justify, left (default), right


8

<img> tag (inserting image)


Absolute Path
<img src=c:\myfolder\images\pic.jpg />

Relative Path
<img src=images/pic.jpg />

Linking Pages
Links (or hyperlinks) are text or images or other objects that, when clicked, redirects the browser page/location to another page/location Format: <a href=some_page.html>some text</a>

10

Linking Within the Page


<a href=#test>Next Section</a> Some text...some text ...some text ...some text ...some text ...some text ...some text... <a name=test>New Section</a> Some text...some text ...some text ...some text ...some text ...some text ...some text...
11

<marquee> tag
Makes text, images, or other objects move Directions: up, down, left (default), right Format:
<marquee>some text</marquee> <marquee direction=up>some text</marquee>

12

<blink> tag
Make text blink (only available to Mozilla and some other browsers) Format:
<blink>blinking_text</blink>

13

HTML Table
<table border=1> <tr> <td>some text</td> <td>some text</td> some text some text </tr> <tr> some text some text <td>some text</td> <td>some text</td> </tr> </table>

HTML Table: Merging Cells


<table border=1> <tr> <td colspan=2>some text</td> </tr> <tr> <td>some text</td> <td>some text</td> </tr> some text </table>

some text some text


15

HTML Table: Merging Cells


<table border=1> <tr> <td rowspan=2>some text</td> <td>some text</td> </tr> <tr> <td>some text</td> </tr> some text some text </table>
some text
16

Web Colors
English Names
red green blue

Hexadecimal
#FF0000 (red) #00FF00 (green) #0000FF (blue)
17

References
www.w3schools.com Microsoft Help Center

18

You might also like