Output
Level 1 Heading
Level 2 Heading
anaes Level 3 Heading
Level 5 Heading
(CBSE PUBLICATION WEB APPLICATION 2
Chapter 2: Website Bu Safari v
Level 2 Heading Level 3 Heading
& 40 of 165 Naneedeg Level 5 Heading
=.46
(CBSE PUBLICATION WEB APPLICATION 2
Chapter 2: Website Building using HTML and CSS
Paragraph
Tag
This tag is used to add space between paragraphs and is a container tag. The align
attribute specifies the alignment of the text within a paragraph. Use a paragraph marker
to end a line and also show a blank line before beginning anything else.
Syntax
This paragraph is centered and written from left to
right.
This example will create a horizontal line that is:
Center-aligned (align="center")
5 pixels high (size="5")
‘Spans 50% of the available width (width="50%")
Color is blue
Tag
The tag is used to change font sizes, font colors and font styles of the text in
your web pages. The tag provides no real functionality by itself but with the
help of a few attributes, (ie. size, color and face) it does so. The size, color and face
attributes can all be used at once or individually, providing users with the ability to
create dynamic font styles for any HTML element.
(CBSE PUBLICATION WEB APPLICATION 6
Chapter 2: Website Building using HTML and CSS Safari v
1 to change font sizes, font colors and font styles of the text in
your wev pages. sue SFONT> tag provides no real functionality by itself but with the
help of a few attributes, (i.e. size, color and face) it does so. The size, color and face
attributes can all be used at once or individually, providing users with the ability to
create dynamic font styles for any HTML element.
(CBSE PUBLICATION WEB APPLICATION 6
The font tag should not be used for modern web development. Instead, you should
leverage CSS properties like font-family, font-size, font-weight, color, and others
to control the appearance of text in your web pages. CSS offers more flexibility,
control and separation of concerns, making it a better choice for styling.
Attributes:
Font Size
The tag uses size attribute to specify the relative or absolute size of text. The
size of font ranges from 1 (very small. to 7 (very large).
Syntax
Text
The Font size number from 1 to 7 defines the size of the text. By default, font size is 3
Font Color
The color attribute defines the color of the text inside a element. To change the
text color, you need to add the attribute color to the opening font tag and assign it a value
for the color. The color values can be given either a standard color name e.g. red, blue,
black, etc., or as RGB components e.g. # 000099. The RGB components are denoted by a
preceding # sign followed by six-digit hex number.
‘Syntax
Font Face
The face attribute defines the font or style of the text inside a element. To
change the font style from the default to a different style, simply add the attribute FACE
to the opening FONT tag. As a value for the face attribute, you can use any specific font
name such as “Verdana”, “Arial” and many more. The font face value is not case
sensitive.
Example
The above HTML code in a browser looks like:
By default, an ordered list will start counting from 1. If you want to start counting from
a specified number, you can use the start attribute:
Oven
Coffee
oss
‘
Milk
3. Milk
Teas/li> 4. Tea
(CBSE PUBLICATION WEB APPLICATION 40
Chapter 2: Website Building using HTML and CSS
2. Unordered List (
- A festival celebrated after the end of the Ramzan
E PUBLICATION WEB APPLICATION a
Chapter 2: Website Building using HTML and CSS
The above HTML code in a browser looks
Christmas
- A festival celebrating the birth of Jesus
Diwali
- A festival of lights celebrating the return of Lord Ram to Ayodhya
Eid
~ A festival celebrated after the end of the Ramzan
2.5 Tables
HTML tables, defined using the
tag and its associated elements, provide a way
to structure and present tabular data in a web page. They allow you to organize
information into rows and columns, enhancing readability and clarity for users. We can
create tables and display text, number, etc, in tabular form using the followin;
> Tables are defined with the
container tag.
> For adding anew row to the table use
container tag (TR is for Table row) .
> For adding a new column in a row use
container tag (TH is for Table
Heading) or use
container tag (TD is for Table Data).
A basic HTML table for Datesheet
Subject
Code
‘
Date
A basic HTML table for Datesheet
Web Applications
Bosse Subject Code Date
March 4,2025
| Web Applications 803 March 4, 2025
Computer Science
083
April 5, 2025
(CBSE PUBLICATION WEB APPLICATION 42 Safari v
€D 49 of 165
(CBSE PUBLICATION WEB APPLICATION 42
Chapter 2: Website Building using HTML and CSS
Here's an example of an HTML table with a border:
Demo of an HTML Doc
HTML Table
Sees HTML Table
School
ee To |
Contact
emma Meadows [Shona Manko |Shona@ greeameadows.org |
Ina Table
> Each data cell contains whatever you want ice. links, images, lists or even other tables.
> Rows are defined from top to bottom and cells are defined from left to right. If you want
lines toshow up between the table cells, use the border attribute in the
tag.
> Most browsers do not require the ending or tags; they assume one cell or
row ends when the next one begins. So, you might see tables written without those end
tags (though the
end tag is still required)
(CBSE PUBLICATION WEB APPLICATION a
Chapter 2: Website Bui
HTML and CSS
Cells that Span Multiple Columns or Rows Safari v
> Most browsers do not require the ending or tags; they assume one cell or
row ends when the next one begins. So, you might see tables written without those end
a] 50 of 165 "ABLE> end tag is still required) .
(CBSE PUBLICATION WEB APPLICATION 4a
Chapter 2: Website Building using HTML and CSS
Cells that Span Multiple Columns or Rows
Sometimes, you may want one cell to span more than one column across or more than
‘one row deep. In these cases, use the colspan and rowspan attributes of the
tag.
Then, just skip defining the cells that the large cell would overlay.
Example :
title>My First Webpages/title>
Aligning Cell Contents within the Cells
Usually, all cell contents are left justified and vertically centered by default. To set the
horizontal or vertical placement within the
&D 52 of 165
you can aiso use tne angn and valign attributes in the
tag, to affect all cells in that
row.
(CBSE PUBLICATION WEB APPLICATION 4s
Chapter 2: Website Building using HTML and CSS
2.6 Div and Span Tags
The Website created with HTML should be well organized into sections or blocks so as
to look professional.
The
tag is an extremely important tag used as a container to group sections of a
webpage together. We can use the div tag multiple times to create neat and organized
sections as given in the example below:
Multiple DIV Elements
Artificial Intelligence
Artificial intelligence is the ability of a computer or computer-controlled robot to
perform tasks that are commonly associated with the intellectual processes characteristic of
humans, such as the ability to reason.
Machine Learning
Machine learning (ML) is a branch of artificial intelligence (Al) and computer science
that focuses on the using data and algorithms to enable Al to imitate the way that humans
learn
Data Science
Data science is the study of data to extract meaningful insights for business. Itis a
multidisciplinary approach that combines principles and practices from the fields of
mathematics, statistics, artificial intelligence, and computer engineering to analyze large
amounts of data.
(CBSE PUBLICATION WEB APPLICATION &D 53 of 165
CBSE PUBLICATION WEB APPLICATION :
Chapter 2: Website Building using HTML and CSS
Multiple DIV Elements
Artificial Intelligence
Antifcial intelligence is the ability of a
[computer or computer-controlled robot
to perform tasks that are commonly
associated with the intellectual
processes characteristic of humans,
such as the ability to reason. Each div tag has created a box
like structure for the content,
Machine learning (ML) making it stand out on the
Machine leaming (ML) is a branch of artificial webpage.
intelligence (AI) and computer science that
focuses on the using data and algorithms to
The ....... element is also used to make some part of a paragraph stand
out. It is an inline element, and will not start on a new line and only takes up as much
width as necessary.
‘
This is an inline span Hello World
element inside a paragraph
My school bus is Yellow and my
bicycle is Neon green.
CBSE homepage in full window
There are two types of linking in HTML - Internal and External.
Intemal Linking : A web page is linked within the same web page. It is done by using
an absolute path or relative path of a link. The internal link name is followed by the hash
sign(#) . It is done by assigning an id to refer to a section of the webpage, which is
referred to as an internal link to the same page.
(CBSE PUBLICATION WEB APPLICATION 4
Chapter 2: Website Building using HTML and CSS
Syntax:
Safari v
an absolute path or relative path of a link. The internal link name is followed by the hash
* assigning an id to refer to a section of the webpage, which is
fa] 56 of 165. imktethessmeraee
(CBSE PUBLICATION WEB APPLICATION 4
Chapter 2: Website Building using HTML and CSS
Syntax:
Example:
Welcome to our Website!
We offer a variety of content, Explore different sections using the links below:
It is important to take care of the patient, to be followed by the patient, but it
will happen at such a time that there is a lot of work and pain. For to come to the
smallest detail, no one should practice any kind of work unless he derives some
benefit from it
Our Products
We offer a wide range of high-quality products. Visit our product page for
more details!
Contact Us
If you have any questions, please feel free to contact us using the information
below.
