Scribd Logo
Upload

Welcome to Scribd!

  • HTML Notes

    Uploaded by

    anuveena
    8 views12 pages

    Original Title

    HTML NOTES

    Copyright

    © © All Rights Reserved

    Available Formats

    PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Flag for inappropriate content
    8 views12 pages

    HTML Notes

    Uploaded by

    anuveena

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Flag for inappropriate content
    of 12

    HTML

    STRUCTURE OF AN HTML DOCUMENT


    • <HTML> Tag: The <HTML> tag identifies the
    document as an HTML document. It is a container tag.
    • <HTML>
    The entire code to design a webpage is written
    • <HEAD> between the opening and the closing HTML tags.
    • <TITLE> Title of the webpage <HEAD> Tag: The <HEAD> tag is used to provide some
    </TITLE> additional information, including title, scripts used
    • </HEAD> and so on, about a webpage. It is also a container tag.
    • <BODY> <TITLE> Tag: The <TITLE> tag is used to specify the
    • Tags that define the content title of a webpage. The title appears on the Title bar
    of a webpage are written or on the tab in the browser window. It is also a
    here. container tag.
    • </BODY> <BODY> Tag: The <BODY> tag defines the content of a
    webpage that would be visible in the browser. It is
    • </HTML> also a container tag. All the tags that display text,
    images or links in a web page are written between the
    opening and the closing <BODY> tags.
    CREATING AND SAVING HTML DOCUMENTS

    Step 1:Use the Search box next to the Start button to open the Notepad
    window.
    Step 2
    Type the HTML code in the Notepad window
    Step 3
    Click on the File menu and choose the Save option. The Save As dialog box
    gets displayed.
    Step 4
    In the Save As dialog box, after selecting the appropriate folder, specify the
    name of the HTML file along with the extension .html or .htm in the File
    Name box as shown
    in Figure 6.4.
    Step 5
    Click on the Save button to save the file.
    Words to Know
    • HTML: HTML or Hyper Text Markup Language is used to design web
    pages.
    • WEBPAGE:A webpage is a page containing text, images, audio, videos
    and links to other webpages.
    • WEBSITE:A website is a group of web pages under a website name
    that is available publicly on the internet.
    • Attribute: A special keyword used inside an HTML tag to specify
    additional information about the tag and customise it.
    • Tag: HTML command that defines the manner in which the content
    should be formatted and displayed in the browser.
    • Web Browser: A software that lets you view the HTML page.
    • URL: URL or Uniform Resource Locator is the address of a web page
    or any other resource on the World Wide Web.
    HYPERLINK
    • A webpage can contain various links that take you directly to other pages and
    even specific parts of a given page. These links are known as hyperlinks.
    • Hyperlinks allow visitors to navigate between Web sites by clicking on words,
    phrases, and images. Thus you can create hyperlinks using text or images
    available on a webpage.
    • A link is specified using HTML tag <a>. This tag is called anchor tag and anything
    between the opening <a> tag and the closing </a> tag becomes part of the link
    and a user can click that part to reach to the linked document. Following is the
    simple syntax to use <a> tag.
    • <a href = "Document URL" ... attributes-list>Link Text</a>
    • Eg: <a href = "http://www.gcis.edu.in/index.php">GCIS</a>
    HTML Images

    • Images can improve the design and the appearance of a web page.
    The HTML <img> tag is used to embed an image in a web page.
    • Images are not technically inserted into a web page; images are linked
    to web pages. The <img> tag creates a holding space for the
    referenced image.
    • The <img> tag is empty, it contains attributes only, and does not have
    a closing tag.
    • SYNTAX:<img src=“path " >
    Image Size - Width and Height
    • use the width and height attributes:
    • The width and height attributes always define the width and height of
    the image in pixels.
    • Eg: <img src="html5.gif" width="128" height="128">
    • If you have your images in a sub-folder, you must include the folder
    name in the src attribute:
    Background Color

    • You can set the background color for webpage


    • Syntax:<tagname style="background-color:colorname;“>
    • Eg:<body style="background-color:DodgerBlue;">
    Changing the texi formatting
    • The HTML style attribute is used to add styles to an element, such as
    color, font, size, and more.
    • SYNTAX: <tagname style="property:value;">
    • Text Color:
    • Eg:<h1 style="color:blue;">This is a heading</h1>
    <p style="color:red;">This is a paragraph.</p>
    • Fonts: Font-family property defines the font to be used for an HTML
    element:
    • Eg:<h1 style="font-family:verdana;">This is a heading</h1>
    • Text Size:font-size property defines the text size for an HTML element:
    • Eg:<h1 style="font-size:300%;">This is a heading</h1>
    • Text Alignment:text-align property defines the horizontal text alignment
    for an HTML element:
    • Eg:<h1 style="text-align:center;">Centered Heading</h1>
    • TO ADD MULTIPLE STYLE IN SINGLE LINE
    • Eg:<p>style=“font-size:24;font-color:darkblue; text-align:center“</p>
    HTML Lists
    • Unordered HTML List • Ordered HTML List
    • An unordered list starts with the • An ordered list starts with the
    <ul> tag. Each list item starts <ol> tag. Each list item starts
    with the <li> tag. with the <li> tag.
    • The list items will be marked • The list items will be marked
    with bullets (small black circles) with numbers by default:
    by default: • <ol>
    • <ul> <li>Coffee</li>
    <li>Coffee</li> <li>Tea</li>
    <li>Tea</li> <li>Milk</li>
    <li>Milk</li> </ol>
    </ul>

    You might also like