HTML

Lec-01 : Introduction

Description

• HTML stands for the HyperText Markup Language, which is the most widely used language for creating web pages.

• HTML was developed to define or describe the structure of documents like headings, paragraphs, images, tables, lists, and so on to facilitate the sharing of scientific information between researchers.

Prerequisite

Better have a basic working knowledge of Windows or Linux operating system, additionally, you must be familiar with −

1. Experience with any text editor such as notepad, notepad++, or Edit plus, etc.

2. How to create and build directories and files on your computer.

3. How to navigate by different directories.

4. How to type the content in a file and save them on a computer system.

5. Understanding images in various formats like JPEG, PNG format.

Topics Covered

• Elements of HTML • Tags • Change & Add • Alignments

• CSS & Text formatting • Tables • Images & SVG • Links & padding

• Ordered, unordered & canavas elements

For whom

• HTML is a MUST for the students and working professionals to become great Software Engineers especially when they are working in the Web Development Domain.

• For students who are preparing them for their Engineering Syllabus.

• This HTML tutorial is designed for aspiring Web Designers and Developers with a necessary understanding of the HTML in enough detail along with its easy description and practical examples.

Reference books

1.“HTML5: Up and Running” by Mark Pilgrim

2.“HTML5 Canvas” by Steve Fulton

3.“Introducing HTML5” by Remy and Bruce

4.“HTML5: Designing Rich Internet Applications” by Matthew David

Q & A
Exam Questions

Q1 . Write an HTML code to form a table to show the below values in a tabular form with heading as Roll No., Student name, Subject Name, and values as 1) Ram, Physics 2) Shyam, Math 3) Murli, Chemistry
Q2 . What are inline elements and block-level elements in HTML?
Q3 . Explain the structure of the HTML webpage.
Q4 . Explain list elements in HTML.
Q5 . Define iframe in HTML.
Q6 . Define forms in HTML.
Q7 . Write an HTML program to design a form that should allow you to enter personal data ( Hint: make use of text field, password field, e-mail, lists, radio buttons, checkboxes, submit button)
Q8 . What are the HTML tags used to display the data in the tabular form?
Q9 . Explain The Key Differences Between LocalStorage And SessionStorage Objects.
Q10 . How many types of CSS can be included in HTML?

HTML SVG defines the two-dimensional vector and vector/raster graphics. You can create an SVG image and edit it with the text editor. It is mostly used for vector type diagrams like pie charts, two-dimensional graphs in an X-Y coordinate system.

The SPAN element is in-line and useful for a small chunk of HTML inside a line or paragraph. A DIV or division element is block-line which is the same as having a line-break before and after it. It groups larger chunks of code.

A developer uses Meta tags to tell the browser about the keywords, page description, character set, author of the template, and many more. Meta tags are useful in search engine optimization to tell the search engine about the page contents.

The purpose of using alternative texts is to describe what the image is about. It can be confusing and hard to understand what hotspots correspond to a particular link during an image mapping. These alternative texts come in action and put a description at every link which makes it easy for users to understand the hotspot links.

A URL is encoded to convert non-ASCII characters into a format to use over the Internet. A URL is sent over the Internet with the help of the ASCII character set only. We need to convert a URL if it contains characters outside the ASCII set. We replace the non-ASCII characters with a “%” before subsequent hexadecimal digits.

We use an iframe tag to display a web page within a web page.

The HTML character entities are the replacement for reserved characters in HTML. You can also replace characters with entities that are not present on your keyboard. We replace these characters because some reserved characters are there in HTML.

• The localStorage object without an expiry date stores the data. The SessionStorage object stores the data for only a single session. • The data will not delete when the browser window closes in the localStorage object. The data gets deleted when the browser window closes, in sessionStorage objects. • The data is accessible only in the current window of the browser in sessionStorage. The multiple windows of the browser share the data in the localStorage.

The HTML has six types of headings. These are starting from the

to

tags. Every type of heading tag displays different text size from another. The largest heading tag is

and the smallest one is

. For example:

Heading no. 1

Heading no. 2

Heading no. 3

Heading no. 4

Heading no. 5

Heading no. 6

The HTML has an anchor tag to create a hyperlink. This links one page to another page. These tags can appear in any of the ways below: o Visited link - It is displayed, purple and underlined. o Unvisited link - It is displayed, blue, and underlined. o Active link - It is displayed, red-color, and underlined.

You can keep the list elements straight with the help of indents.

A style sheet is useful for building a transportable, consistent, and well-designed style template. You can add these templates on multiple different web pages. It describes the formatting and looks of a document written in a markup language.

HTML layout specifies a way in which the web page has to format. Every website has a specific layout to display content appropriately. o

: It defines a header for a section or a document. o

A marquee tag puts the scrolling text on a web page. It automatically scrolls the image or text up, down, left, or right. You can put the text, which you want to scroll within the ... tag.

An empty elements is the HTML elements with no content. For example:
,

etc.

The image map links you to many different web pages using a single image. You can define shapes you want in images to make part of an image mapping.

No, We can use the hyperlink in the images as well as text. You can convert an image into a link. This allows users to link to another page when clicked. Put the image within the … tag.

If two sets of HTML tags overlapped, only the first tag is recognized. You may find this problem when the proper text does not display on the browser screen.

The HTML tag contains a field inside the tag, which are the attributes of that tag. For Example: here type is input tag attributes.

The commented outlines are not visible in the browser. To comment, the line must start with this . The comments can be of one line or multiple lines.

The semantic HTML is a coding style. It is the use of HTML markup to reinforce the meaning of the content. In semantic HTML we do not use tag for italic statement as well as tag for bold. Instead of these we use and and tags.

HTML elements communicate to the browser to provide text. When the elements are enclosed in brackets <>, they form HTML tags. Tags come in a pair and surround content most of the time.

We use tables to position text and images. The use of style sheets is another useful way to wrap text around an image.

The default text field’s size is around 13 characters. If you include the size attribute, you can set the size value to be as low as one. The size will be set to the default size if the size attribute is set to zero.

The span tag is useful for the following things: o To add color to text o To add a background on text o Highlight any color text

To make a picture of the background image on a web page, you have to put the following tag code after the tag. Here, replace the "image1.gif" with the name of your image file you want to display.

The color of the bullet is always the same as the color of the first text of the list. If you want to change the color of the bullet, you have to change the color of the text.

There are multiple common lists, which used for designing a page. o Ordered list – It displays elements in a numbered format. The

and: tag represents it.

Student

В осуществлении таможенного декларирования импорта, в том числе и экспорта документация играет самую актуальную функцию. Преимущественно в случае импорта присутствие должным образом оформленных коммерческих документов, точность отображаемых сведений,

Review :

1 | 1 Reviews

Course Feature

Category Computer Science
Language English
Price 39.00
Validity 1 Year
Rating 1 | 1 Reviews
Q & A 29
Exam Questions 10
Full Course PDF View

Wishlist

Add to Cart

Computer Science

HTML

Lec-01 : Introduction

to

tags. Every type of heading tag displays different text size from another. The largest heading tag is

and the smallest one is

. For example:

Heading no. 1

Heading no. 2

Heading no. 3

Heading no. 4

Heading no. 5

Heading no. 6

Student

Course Feature

Share

Data Communication

Distributed Systems

Adhoc & Sensor

Operating Systems(OS)

Useful Links

Download

Computer Science

1.Introduction & Elements

2.Form elements

3.Tags

4.Change & Add

5.Alignments , Links &Padding

6.CSS & Text Formatting & Tables

7.Images & SVG

8.Ordered, Unordered & canavas elements

9. Flexbox

HTML

Lec-01 : Introduction

1.Introduction & Elements

2.Form elements

3.Tags

4.Change & Add

5.Alignments , Links &Padding

6.CSS & Text Formatting & Tables

7.Images & SVG

8.Ordered, Unordered & canavas elements

9. Flexbox

Q1 . What is SVG?

Q2 . What is the difference between DIV and SPAN in HTML?

Q3 . Why Meta tags are used in HTML?

Q4 . What is the purpose of using alternative texts in images?

Q5 . Why is a URL encoded in HTML?

Q6 . What is the use of an iframe tag?

Q7 . What are the entities in HTML?

Q8 . Explain The Key Differences Between LocalStorage And SessionStorage Objects.

Q9 . How many types of heading does an HTML contain?

to

tags. Every type of heading tag displays different text size from another. The largest heading tag is

and the smallest one is

. For example:

Heading no. 1

Heading no. 2

Heading no. 3

Heading no. 4

Heading no. 5

Heading no. 6

Q10 . How to create a hyperlink in HTML?

Q11 . How do you keep list elements straight in an HTML file?

Q12 . What is a style sheet?

Q13 . Explain the layout of HTML.

Q14 . What is a marquee?

Q15 . What are empty elements?

Q16 . What is an image map?

Q17 . Does a hyperlink apply to text only?

Q18 . What will happen if you overlap sets of tags?

Q19 . Define attributes in HTML tag.

Q20 . How to write comments in HTML?

Q21 . What is semantic HTML?

Q22 . What is the difference between HTML elements and tags?

Q23 . What other ways to align images and wrap text?

Q24 . What are the limits of the text field size?

Q25 . What is the use of a span tag? Give one example.

Q26 . How to make a picture of a background image of a web page?

Q27 . Is it possible to change the color of the bullet?

Q28 . How to insert a copyright symbol on a browser page?

Q29 . What are some common lists used for designing a page?

Student

Course Feature

Share

Related Courses

Data Communication

Distributed Systems

Adhoc & Sensor

Operating Systems(OS)

Useful Links

Download