Web Technology · Unit 2 · 10 hrs
Hyper Text Markup Language
Exam-focused notes for Hyper Text Markup Language (Web Technology, CSC329): what the TU syllabus asks and how it has actually been tested, with 11 solved past questions from this unit.
What this unit covers
- Introduction to HTML
- Elements of HTML Document
- HTML Elements and HTML Attributes
- Headings
- Paragraph
- Division
- Formating: b, i, small, sup, sub
- Spacing: Pre, Br
- Formatting Text Phrases: span, strong, tt
- Image element
- Anchors
- Lists: Ordered and Unordered and Definition
- Tables
- Frames
- Forms: Form Elements, ID attributes, Class Attributes of HTML Elements
- Meta Tag
- Audio
- Video
- Canvas
- Main
- Section
- Article
- Header
- Footer
- Aside
- Nav
- Figure Tags
- HTML Events: Window Events, Form Element Events, Keyboard Events, Mouse Events
Audio
Write an HTML script using audio tag. Set the autoplay, preload and loop properties to appropriate values. [5]
The following HTML script demonstrates the use of the <audio tag with autoplay, preload, and loop properties set to appropriate values. --- Attribute Value Used Description ------------------------------------ controls (boolean) Adds audio controls like pla...
Full solved answer →HTML Events
Write an HTML script to demonstrate the onkeydown and onkeypress events. [5]
Keyboard Events are: Attribute Description ------ onkeydown Fires/runs when a user is pressing a key onkeypress Fires when user presses a key onkeyup Fires when user releases a key These are event handlers written inside HTML tags that execute JavaScript wh...
Full solved answer →What is onload event in HTML? Write an HTML script that displays alert message 'Hello Nepal' in onload event. [5]
The onload event is an event handler in HTML/JavaScript that is triggered automatically when a web page (or an element such as an image) has completely finished loading in the browser. It is commonly used with the <body tag. - It belongs to the category of ...
Full solved answer →What are HTML keyboard events? Write a script to display a message 'Hello world' on keypress event. [5]
Keyboard events are events that are triggered when a user interacts with the keyboard. The three keyboard event attributes are: Attribute Description ------------------------ onkeydown Fires/runs when a user is pressing a key (key held down) onkeypress Fire...
Full solved answer →Tables
Write a HTML script to create a table with three rows and three columns. The second row third column should contain a text 'TU' with link set to www.tu.edu.np. The height of second row should be set to 200px. [5]
--- Element / Attribute Purpose ------ <table border="1" Creates the table with a visible border <tr Defines each table row <td Defines each table data cell (column) <tr height="200px" Sets the height of the second row to 200px <a href="http://www.tu.edu.np...
Full solved answer →Lists
Write a HTML script to generate following list of items; 1. Coffee : I. Black coffee II. Green coffee 2. Tea A: Black tea B. Green tea [5]
The question requires: - Outer ordered list (numbered: 1, 2) for Coffee and Tea - Inner ordered list under Coffee with Roman numerals (I, II) for Black coffee and Green coffee - Inner ordered list under Tea with uppercase letters (A, B) for Black tea and Gr...
Full solved answer →Create a HTML page containing ordered and unordered lists. Set the value of ordered list type to 'A'. The list should start at 'D'. [5]
- Unordered list: Uses <ul tag; items marked with bullets by default using <li tag. - Ordered list: Uses <ol tag; items marked with numbers by default using <li tag. - The type attribute in <ol changes the marker style (e.g., type="A" for uppercase letters)...
Full solved answer →Canvas
Create a HTML page containing a div having id 'div1'. The div should contain canvas element. The id of canvas should be 'mycanvas'. The height and width of canvas should be 200 and 300. [5]
The question asks us to create an HTML page with: - A <div element with id="div1" - Inside the div, a <canvas element with id="mycanvas" - Canvas height = 200 and width = 300 --- --- Part Description ------------------- <!DOCTYPE html Declares the document ...
Full solved answer →Image element
Create an HTML page with its body containing a div. The div should contain an image within it. Create a link on the image to redirect to the url http://www.tuiost.edu.np. Set the title of the page to “iost”. Add Meta tag on the page. [5]
--- Part Tag / Attribute Purpose --------- Page Title <titleiost</title Sets the browser tab title to "iost" Meta Tags <meta ... Provides metadata about the page (charset, description, keywords, author, viewport) Div Container <div Block-level container wra...
Full solved answer →Header
Create a HTML page with tags header, article and footer. Insert alink containing mail to [email protected] in the footer tag. Set the keywords 'iost', 'csit' using Meta tag in the page. [5]
--- Tag / Attribute Purpose ------ <meta name="keywords" content="iost, csit" Sets the keywords iost and csit for search engines. Goes inside <head. <header Defines the header section of the page (title, intro). <article Defines independent, self-contained ...
Full solved answer →Frames
Why inline frames are used? Create a HTML page containing iframe within a paragraph. The iframe have source to http://www.tuiost.edu.np and its height and width are 200px and 400px respectively. [5]
As stated in the notes, the <iframe tag defines a rectangular region within the document on which the browser can display a separate document, including scrollbars and borders. Inline frames are used for the following reasons: - To embed another webpage ins...
Full solved answer →Make Unit 2 stick
Practice CSC329 with flashcards & quizzes