I unit

2 Marks Questions

[Link] is world Wide Web?

The World Wide Web (WWW) is a system of interconnected web pages that can
be accessed through the internet using a web browser.

[Link] ie web browser?

A web browser is a software application used to access websites on the [Link]
retrieves information from web servers and displays web [Link] interprets
HTML, CSS, and JavaScript.

Examples include Google Chrome and Mozilla Firefox.

[Link] is Web Page and types of Web Page?

A web page is a single document or page that you view on the World Wide Web
using a web browser.

Types of web pages

Web pages are mainly classified into two types:

1. Static Web Page

2. Dynamic Web Page

[Link] between Static Web Page and Dynamic Web Page.

Here is a clear comparison between a static web page and a dynamic web page:

Static web page:

[Link] web pages are also known as flat or stationary webpage.

[Link] are loaded on the client’s browser as exactly they are stored on the web
server.
Dynamic web page:

[Link] web page shows different information at different point of time.

[Link] is possible to change a portion of a web page without loading the entire
webpage.

[Link] does the Web Page work on Client Side and Server Side
Scripting?
The client (browser) sends a request to the server. The server-side script
processes the request and sends back the web page. The client-side script (like
JavaScript) runs in the browser to display and interact with the page.

[Link] is Web Server and give examples.

A web server is a computer system (hardware + software) that stores websites
and delivers web pages to users through the internet.

Examples of web servers:

1. Apache HTTP Server

2. Nginx

3. Microsoft IIS

[Link] is Web Site and types?

A website is a collection of related web pages stored on a web server and
accessible through the internet using a web [Link] is identified by a domain
name and used to share information or services.

[Link] is Internet?
The Internet is a global network of interconnected computers that communicate
with each [Link] allows users to access and share information [Link]
provides services like websites, email, and online applications.

[Link] Web Content.

Web content refers to the information and material available on a [Link]
includes text, images, audio, video, and [Link] content is created to
provide information or services to users.

[Link] is Web Application?

A web application is a software program that runs on a web server and is
accessed through a web [Link] allows users to interact with the system
[Link] does not require installation on the user’s device.

[Link] Home Page.

A home page is the main or first page of a [Link] is the starting point when a
user visits a [Link] provides links to other pages and sections of the website.

[Link] is Web Content Authoring?

Web content authoring is the process of creating and managing content for
[Link] includes writing text, adding images, videos, and designing [Link]
uses tools like HTML editors or content management systems.

[Link] is Web Programming?

Web programming is the process of creating websites and web applications using
programming [Link] involves both front-end (HTML, CSS, JavaScript) and
back-end (PHP, databases) development.

5 Marks Questions

[Link] in detail about World Wide Web.

 The WWW was invented by Tim Berners-Lee in 1989.
 It is based on a client–server architecture.
 Users (clients) request web pages through browsers.
 Web servers store and deliver these web pages.
 It uses HTTP/HTTPS protocols for communication.
  Each web page has a unique address called URL (Uniform Resource
Locator).

Web pages are written using HTML.

 Pages are connected using hyperlinks.

 It supports multimedia content like text, images, audio, and video.
 It enables global information sharing and communication.
 It is widely used for education, business, entertainment, and services.
 It allows access to web applications like email, social media, etc.

[Link] between HTTP and HTTPS.

HTTP:
 HTTP stands for HyperText Transfer Protocol.
 It is a protocol used for communication between web browser and web
server.
 It works on a client–server model.
 The browser sends a request and the server sends a response.
 It is a stateless protocol (does not remember previous requests).
 Data is transferred in plain text format.
 It is not secure and vulnerable to attacks.
HTTPS:
 HTTPS stands for HyperText Transfer Protocol Secure.
 It is a secure version of HTTP used for communication between browser
and server.
 It uses SSL/TLS encryption to protect data.
 Data is transferred in encrypted form, ensuring privacy.
 It prevents hacking, data theft, and unauthorized access.
 It ensures authentication of the website.
 It maintains data integrity during transmission.

[Link] is web page and Explain the types of Web Page

A web page is a document available on the Internet that is displayed in a web
[Link] is usually written using HTML and may include text, images, videos,
and [Link] web page has a unique address called a URL.

Web pages are the basic building blocks of a website.

Types of Web Pages

1. Static Web Page

 Displays fixed content

 Same for all users
 Created using HTML and CSS
 Does not change unless manually updated
 Faster and simple

2. Dynamic Web Page

 Displays changing content

 Content depends on user input or database
 Uses languages like JavaScript, PHP
 More interactive and flexible
 Used in web applications (login, forms)

[Link] with a neat diagram the working of a Web Server.

A web server is responsible for receiving requests from clients (browsers) and
sending back the requested web pages.

User (Browser)

│ 1. Request (URL)

Internet
 ▼

Web Server

│ 2. Process Request

│ (Fetch file / run script)

Web Server

│ 3. Response (HTML page)

User (Browser displays page)

Steps:

 The user enters a URL in the browser.

 The browser sends an HTTP/HTTPS request to the web server.
 The web server receives the request.
 It processes the request (fetches file or runs server-side script).
 The server sends back a response (web page).
 The browser displays the page to the user.

[Link] are the benefits of Web Application?

[Link] Anywhere

 Can be used from any device with internet and a browser

[Link] Installation Required

 Runs directly in the browser, no need to install software

[Link] Independent
  Works on mobile, tablet, or computer

[Link] Maintenance

 Updates are done on the server, no need to update users’ devices

[Link] Effective

 Reduces development and maintenance cost

[Link] Storage & Backup

 Data is stored on servers, making backup easier

[Link]-user Access

 Multiple users can access the application at the same time

[Link]

 Data can be secured with authentication and encryptionAccessible

Anywhere

[Link] between Static and Dynamic Website.

STATIC WEBSITES

 Static websites are also known as flat or stationary websites.

 They are loaded on the client’s browser as exactly they are stored on the
web server.
 Such websites contain only static information.
 User can only read the information but can’t do any modification or
interact with the information.
 Static websites are created using only HTML. Static websites are only used
when the information is no more required to be modified.
 Text editors, such as Notepad or Text Edit, where content and HTML
markup are manipulated directly within the editor program

DYNAMIC WEBSITES
  Dynamic websites shows different information at different point of time.
 It is possible to change a portion of a web page without loading the entire
webpage.
 There are a wide range of software systems, such as Java Servlets and Java
Server Pages (JSP), Active Server Pages that are available to generate
dynamic web systems and dynamic sites.

[Link] does a website require a Home Page?

A website needs a home page because it serves several important roles:

1. First impression

Most visitors land on the home page first. It quickly tells them whether the site is

relevant to what they are looking for.

2. Navigation hub

It acts like a central directory, guiding users to other parts of the site.

3. Orientation

Without a home page, users might feel lost. The home page explains what the

website offers and how it is structured.

4. Branding

It shows the identity of the website (logo, colors, tone, and message), helping

users recognize and trust it.

5. Improves user experience

A clear home page makes it easier and faster for users to find what they need.

[Link] the process of Web Development.

The web development process is the set of steps used to design, build, test, and
maintain a website or web application. It’s usually divided into clear phases so
work is organized and the final product is reliable and scalable.

Here’s a simple breakdown:

1. Requirement gathering (Planning)

This is where you figure out what the website should do.

 Purpose of the site (e.g., portfolio, e-commerce, blog)

 Target users
 Features needed (login, payments, search, etc.)
 Technical requirements and budget
 Think of it as setting the blueprint before construction.

2. Design (UI/UX)
This phase focuses on how the website looks and feels.

 Wireframes: basic layout sketches

 UI design: colors, fonts, buttons, visuals
 UX design: user flow (how users move through the site)

Goal: make it easy and pleasant to use.

3. Frontend development (Client-side)

This is what users see and interact with in the browser.

Technologies:

 HTML (structure)
 CSS (styling)
 JavaScript (interactivity)

Example: buttons, forms, menus, animations.

[Link] development (Server-side)

This handles behind-the-scenes logic.

 Server setup
 Databases (storing user data, products, etc.)
 APIs (communication between frontend and backend)
 Authentication (login/signup systems)

Common languages: [Link], Python, PHP, Java, etc.

5. Database management
Stores and organizes data.

Examples:

User accounts Orders

 Blog posts

Popular databases: MySQL, PostgreSQL, MongoDB

6. Testing
Ensures everything works correctly before launch.

 Functionality testing (does it work?)

 Compatibility testing (different browsers/devices)
 Performance testing (speed)
 Security testing

7. Deployment (Launch)
 The website is published on the internet.
 Hosting on servers (AWS, Netlify, Vercel, etc.)
 Domain setup (e.g., [Link])

Now users can access it.

8. Maintenance & updates

  After launch, work continues:
 Fixing bugs
 Adding new features
 Improving performance
 Updating security

[Link] are the processes to build the website?

[Link] YOUR DOMAINNAME

a) you have to register your site name and indicate First your domain name in any
Internet domain registrar and web hosting company like [Link]. or
[Link]

b) If your personal name works as a brand name or your small business has
already a company name then it should not be a problem. You may use your
company [Link] or something similar. If you want to purchase and add
your own domain name.

2. EXPLORE OTHER WEBSITES YOULIKE

a) Web design trends change rapidly.

b) Do the research to see sites of your competitors or other businesses

c) Check out that you should look enough similar and at the same time enough
unique compare to your competitors to stand out in the crowd.

[Link] YOURWEBSITE

a) Your menu items will depend on a type of your website

and amount of information you

have in each section.

b) For an artist portfolio there could have sections, such as,

About, Portfolio, Exhibitions,

Bio and Contacts.

[Link] WEBSITE’S LOOK AND FEEL

a) Before you start designing, think of how your website will

feel and look for a visitor.

b) You may choose few adjectives that would describe your

se best e.g. light, white,

minimalistic, colorful ,etc.

c) Remember to reflect on these adjectives every time you

make a decision

about colors, fonts, layout and other important web design

elements.

[Link] FOR YOUR WEBSITE

a) Combine ideas from websites you like and your thoughts

how it should feel and

look to decide on the background, menu and header colors.

b) You can read an article about choosing color palette for

your website. Few main tips are

(1) to use natural colors,

(2) make a strong contrast between background and text,

(3) select around 3 colors and use them throughout the

entire website, and

(4) take into account people with visual disabilities.

6. WEBSITE PHOTOS AND IMAGES

a) Many users place their art works as their main focus of their sites.

b) In these situations photos and images should not oppose or disappear in

background or elements of the web design.

c) If your focus is not visuals, but text content and you do not have any
photos,search for some relevant images in Internet with a high-resolution
quality. Usually visuals convey message better than text.

7. WEB-FRIENDLY FONT

a) Use fonts which are offer by hosting company and own system fonts. They
should fit in the overall web design feel and at the same time also needs to be
web friendly.

b) Since people have different fonts installed on their computers, it might be so

that some stylish or rear fonts may look different on different computers.

[Link] are the principles of Web Content Authoring?

Good web content authoring follows certain principles to ensure the content is
useful, accessible, and user-friendly:

1. Clarity and Simplicity

Content should be easy to understand.

 Use simple language and short sentences.

 Avoid unnecessary jargon.

2. Relevance
 Content should match the user’s needs and purpose of the website.
 Avoid adding unrelated or distracting information.

3. Accuracy and Reliability

 Information must be correct and up to date.
  Use trusted sources when providing facts.

4. Consistency
 Maintain consistent tone, style, fonts, and formatting across pages.
 Helps users feel familiar with the website structure.

5. Usability
 Content should be easy to navigate and interact with.
 Use headings, bullet points, and proper structure.

6. Accessibility
 Content should be accessible to all users, including people with disabilities.
 Use alt text for images, readable fonts, and proper contrast.

7. Search Engine Optimization (SEO)

 Content should be structured so search engines can easily index it.
 Use keywords, proper headings, and meta descriptions.

8. Engagement
 Content should be interesting and interactive when possible Use visuals,
videos, and calls-to-action to keep users engaged.

9. Maintainability

 Content should be easy to update and manage over time.

 Avoid overly complex structures that are hard to edit..

[Link] in detail Web Graphic Design.

Web graphics in any websites is as significant as the content of the site.

2. An excellent designed graphics can give better and creative ideas to customer
of

what they are looking for.

3. Web graphics helps designers to enhance the website design by adding colors,

visual appeals and helps in providing artistic professional touch to their creativity.

4. The websites that don’t have web graphics don’t appeal to visitors.

5. Successes of web graphics depend upon the effective and efficient placement
on

the websites.

6. The appropriate placement of graphics not only attracts end-users but also
makes

website well turned-out.

7. The appropriate use of Photoshop, Flash, Dream weaver and Fireworks tools

assist in designing and creating unique graphics.

8. These professionally created graphics reflects the creativity of web designer

and enhances the website quality.

9. Usually, graphics are used for explaining things and ideas that are not

expressed bywords.

10. For instance shopping and e-commerce website uses great deal of graphics so
as

to illustrate their products pictures.

The pictorial language of anything gives details of particular products and easily
understands by people. The related graphics of products simplifies the content
and helps in easy interpretation. Suppose, if you have product descriptions on
your web site, you should have the related graphic depiction next to them. It is
better to use logos, cartoons, graphs and charts where they make a reasonable
sense.

Unit 2: HTML and CSS

[Link] is HTML? Write basic syntax of HTML.
HTML (HyperText Markup Language) is the standard language used to create and
design web [Link] structures the content on the web using tags like headings,
paragraphs, links, [Link] is interpreted by web browsers to display content.

<!DOCTYPE html>

<html>

<head>

<title>My Page</title>

</head>

<body>

<h1>Welcome</h1>

<p>This is a web page.</p>

</body>

</html>

[Link] are basic Text Markup Languages?

Text markup languages are used to format and structure text in documents or
web pages using tags.

Common Basic Markup Languages

  HTML (HyperText Markup Language)

Used to create and structure web pages

 XML (Extensible Markup Language)

Used to store and transport data

 SGML (Standard Generalized Markup Language)

A standard for defining markup languages

[Link] are Hypertext Links and mention the different types of link.
Hypertext links (hyperlinks) are clickable elements in a web page that allow users
to navigate from one page or resource to [Link] are created using the <a>
(anchor) tag in [Link] can connect pages within the same site or to external
websites.

[Link] is List and mention the different types of list.

A list in HTML is used to organize and display items in a structured format on a
web [Link] helps present information clearly in ordered or unordered form.

Types

[Link] List

[Link] list

[Link] are the Headings? List the different types of heading.

Headings in HTML are used to define titles and subtitles on a web page.

They help organize content and improve readability.

<h1> → Largest heading

<h2>

<h3>
<h4>

<h5>

<h6> → Smallest heading

[Link] cell padding and cell spacing attribute.

Cell padding and cell spacing are attributes used in HTML tables to control the
spacing inside and between table cells.

Cell Padding

 It defines the space between the cell content and its border
 Increases space inside the cell
 Makes content look less crowded

Cell Spacing

 It defines the space between two table cells

 Controls the gap between cells
 Affects overall table layout

[Link] developed HTML?

HTML (HyperText Markup Language) was developed by Tim Berners-Lee in 1991.

He created HTML along with the World Wide Web to structure and display web
pages.

[Link] HTML Element.

HTML element is a complete unit in HTML that consists of a start tag, content, and
an end tag.

It is used to define the structure and content of a web page.

Elements can contain text, other elements, or be empty.

Example: <p>This is a paragraph</p>

[Link] are the attributes of HTML?
HTML attributes are special properties used to provide additional information
about HTML [Link] are always written inside the start tag of an element.

Attributes usually come in name="value" pairs.

Examples of Attributes

id → uniquely iden fies an element

class → groups elements for styling

href → specifies link URL

src → specifies image source

style → adds inline CSS

[Link] is DIV tag?

The <div> tag is a container element in HTML used to group and organize other
elements.

It is a block-level element, meaning it takes full width of the page.

It is mainly used for layout design and styling with CSS.

Example:

HTML

<div>

<p>This is inside a div</p>

</div>

[Link] is CSS? Why is it used?

CSS (Cascading Style Sheets) is a style sheet language used to design and format
web [Link] controls the appearance of HTML elements such as colors, fonts,
spacing, and layout.

Why is CSS Used?

 To add styles to web pages (colors, fonts, backgrounds)

 To improve layout and design
 To separate content from design
 To make websites responsive and attractive
 To apply the same style to multiple pages

[Link] are the different levels of CSS?

[Link] CSS

[Link] CSS

[Link] CSS

[Link] is CSS Selector? Mention the name of selectors.

A CSS selector is used to select and target HTML elements so that styles can be
applied to [Link] tells the browser which elements the CSS rules should affect.

1. Element Selector

2. Class Selector

3. Id Selector

4. Universal Selector

[Link] is CSS Property? Give an example of property value pair.

CSS property is a feature used to define the style of an HTML element, such as
color, size, or [Link] is always written along with a value to specify how the
style should appear.

Property–Value Pair

CSS follows the format:

property: value;

Example:

CSS

color: red;

font-size: 16px;

5 Mark Questions

1. Write a short note on CSS.

CSS (Cascading Style Sheets) is a style sheet language used to control
the appearance of web pages. It is used with HTML to make pages
attractive and well-formatted. CSS controls colors, fonts, spacing,
borders, alignment, and layout of elements on a webpage.
It helps separate content from design, making websites easier to
manage and update.
There are three types of CSS:
1. Inline CSS – Applied inside an HTML tag using the style attribute.
2. Internal CSS – Written inside the <style> tag in the HTML document.
3. External CSS – Written in a separate .CSS file and linked to HTML.
Advantages of CSS:
 Improves website design
 Saves time by reusing styles
 Easy maintenance
 Faster page loading
2. What is the difference between CSS and HTML?
 CSS
1. CSS stands for Cascading Style Sheets.
2. It is used to design the style and layout of a webpage
3. CSS uses properties like color, font-size, margin.
4. It changes colors, fonts, spacing, borders.
5. CSS is the beauty/design of webpage.
HTML
1. HTML stands for Hyper Text Markup language.
2. It is used to create the structure of a webpage.
3. HTML uses tags like<h1>, <p>, <table>.
4. It defines content such as text, images, links.
5. HTML is the skeleton of webpage.

3. Explain the basic structure of HTML document with an example.

HTML document is used to create webpages. It contains different

tags that define the structure of the page.

HTML

<!DOCTYPE html>

<html>

<head>

<title>My Web Page</title>

</head>

<body>

<h1>Welcome</h1>

<p>This is a webpage.</p>

</body>
</html>

Uses of Tags:

1. <html> Tag

It is the root element of an HTML document. All other tags are

written inside this tag.

2. <head> Tag

It contains information about the webpage such as title, meta data,

links, CSS, etc. It is not displayed on the webpage.

3. <title> Tag

It is written inside the <head> tag. It gives the title of the webpage

shown on the browser tab.

4.<body> Tag

It contains all visible contents of the webpage such as headings,

paragraphs, images, tables, links, etc.

Thus, these tags form the basic structure of every HTML document.

3. Explain different types of lists in HTML.

The primary list types supported are those with which most people are
already familiar:
unordered lists such as grocery lists and ordered lists such as the assembly
instructions for a new bookshelf. Definition lists can also be defined. The
tags used to specify unordered, ordered, and definition lists are described
below.
Unordered Lists
The <ul> tag, which is a block tag, creates an unordered list. Each item in a
list is specified
 with an <li> tag. Any tags can appear in a list item, including nested lists.
When displayed, each list
item is implicitly preceded by a bullet.

Ordered List
Ordered lists are lists in which the order of items is important. This
orderedness of a list is
shown in the display of the list by the implicit attachment of a sequential
value to the beginning of each
item. The default sequential values are Arabic numerals, beginning with 1.
An ordered list is created within the block tag <ol> . The items are specified
and displayed just
as are those in unordered lists, except that the items in an ordered list are
preceded by sequential values
instead of bullets. Consider the following example of an ordered list:

4. Explain Hyperlinks in HTML.

A hypertext link in an XHTML document, which we simply call a link here, acts
as a pointer to some particular place in some Web resource. That resource can
be an XHTML document anywhere on the Web, or it may be the document
currently being displayed.

Links

A link that points to a different resource specifies the address of that

resource. Such an address might be a file name, a directory path and a file
name, or a complete URL. If a link points to a specific place in any document
other than the beginning, that place somehow must be marked.

Links are specified in an attribute of an anchor tag <a> which is an inline tag.
The anchor tag that specifies a link is called the source of that link. The
document whose address is specified in a link is called the target of that link.
As is the case with many tags, the anchor tag can include many different
attributes. However, for creating links, only one attribute is required: href. The
value assigned to href specifies the target of the link. If the target is in another
document in the same directory, the target is just the document’s file name. If
the target document is in some other directory, the UNIX pathname
conventions are used.

5. Explain HTML tables with an example.

An HTML table is used to organize and display data in a tabular form using
rows and columns. It is created using the <table> tag and contains different
elements to define structure.
Basic Table Elements
<table> → Defines the en re table
<tr> → Table row
<th> → Table header (bold and centered)
<td> → Table data (normal cell)
<!DOCTYPE html>
<html>
<head>
<title>HTML Table Example</title>
</head>
<body>

<table border="1" cellpadding="5" cellspacing="3">

<tr>
<th>Name</th>
<th>Age</th>
<th>Course</th>
</tr>

<tr>
<td>Ravi</td>
<td>20</td>
 <td>BCA</td>
</tr>

<tr>
<td>Sita</td>
<td>21</td>
<td>BCom</td>
</tr>

</table>

</body>
</html>

7. Explain difference types of CSS selectors.

Simple selector form

Simple selector form is a list of style rules, as in the content of a <style> tag for
document-level style sheets. The selector is a tag name or a list of tag names,
separated by commas. Consider the following examples, in which the property is
font-size and the property value is a number of points :

h1, h3 { font-size: 24pt ;}

h2 { font-size: 20pt ;}

Selectors can also specify that the style should apply only to elements in certain
positions in the document .This is done by listing the element hierarchy in the
selector.

• Contextual selectors: Selectors can also specify that the style should apply only
to elements in certain positions in the document .

Class Selectors
Used to allow different occurrences of the same tag to use different style
specifications. A style class has a name, which is attached to the tag‘s name with a
period.

[Link] {property-value list}

[Link] {property-value list}

The class you want on a particular occurrence of a tag is specified with the class
attribute

of the tag.

For example,

<p class = "narrow">

Once upon a time there lived a king in the place called Ayodhya.

</p>

...

<p class = "wide">

Once upon a time there lived a king in the place called Ayodhya.

</p>

Generic Selectors

A generic class can be defined if you want a style to apply to more than one kind
of tag. A generic class must be named, and the name must begin with a period
without a tag name in its name.

For Example:

.really-big { … }

Use it as if it were a normal style class

<h1 class = "really-big"> This Tuesday is a holiday </h1>...

<p class = "really-big"> … </p>

<html xmlns = "[Link]

<head>

<title> Absolute positioning </title>

<style type = "text/css">

.regtext {font-family: Times; font-size: 14pt; width: 600px}

.abstext {position: absolute; top: 25px; left: 50px; font-family: Times; font-size:
24pt;

fontstyle:

italic; letter-spacing: 1em; color: rgb(102,102,102); width: 500px}

</style>

</head>

<body>

<p class = "regtext">

Id Selectors

An id selector allow the application of a style to one specific element. The general
form of an id selector is as follows :

#specific-id {property-value list}

Example:

#section14 {font-size: 20} specifies a font size of 20 points to the element

<h2 id =―sec on14‖> Alice in wonderland</h2>

Universal selector
The universal selector, denoted by an asterisk(*), which applies style to all
elements in

the document. For example:

{color: red;}

makes all elements in the document red.

8. Explain font property and list property in CSS.

Font properties
[Link]-family

The font-family property is used to specify a list of font name. The browser will
use the

first font in the list that it supports. For example, the following could be specified.
font- family: Arial, Helvetica, Courier

[Link] fonts: They can be specified as the font family value for example :serif,
sans- serif, cursive, fantasy, and monospace (defined in CSS). Browser
has a specific font defined for each generic name. If a font name that
has more than one word, it should be single-quoted Eg: font-family:
‘Times New Roman‘

[Link]-size
Possible values: a length number or a name, such as smaller, xx-large, medium ,
large etc. Different browsers can use different relative value for the font-size.

[Link]-variant
The default value of the font-variant property is normal, which specifies the usual
character font. This property can be set to small-caps to specify small capital
characters.
[Link]-style
The font-style property is most commonly used to specify italic, as in the following

example. Eg: font-style: italic

[Link]-weights
The font-weight property is used to specify the degree of boldness. For example:
font- weight: bold

List properties

It is used to specify style of bullets or sequencing values in list items. The list-style-
type of Unordered lists can be set to disc,circle,square or none. Bullet can be a
disc (default), a square, or a circle. Set it on either the <ul> or <li> tag On <ul>, it
applies to list items

<h3> Some Common Single-Engine Aircraft </h3>

<ul style = "list-style-type: square">

<li> Cessna Skyhawk </li>

<li> Beechcraft Bonanza </li>

<li> Piper Cherokee </li> </ul>

On <li>, list-style-type applies to just that item

<h3> Some Common Single-Engine Aircraft </h3>

<ul>

<li style = "list-style-type: disc">

Cessna Skyhawk </li>

<li style = "list-style-type: square">

Beechcraft Bonanza </li>

<li style = "list-style-type: circle">

Piper Cherokee </li>

Could use an image for the bullets in an unordered list.

List properties

It is used to specify style of bullets or sequencing values in list items.

The list-style-type

of Unordered lists can be set to disc,circle,square or none. Bullet can be

a disc (default), a

square, or a circle. Set it on either the <ul> or <li> tag On <ul>, it applies
to list items

<h3> Some Common Single-Engine Aircraft </h3>

<ul style = "list-style-type: square">

<li> Cessna Skyhawk </li>

<li> Beechcraft Bonanza </li>

<li> Piper Cherokee </li> </ul>

On <li>, list-style-type applies to just that item

<h3> Some Common Single-Engine Aircraft </h3>

<ul>

<li style = "list-style-type: disc">

Cessna Skyhawk </li>

<li style = "list-style-type: square">

Beechcraft Bonanza </li>

<li style = "list-style-type: circle">

Piper Cherokee </li>

Could use an image for the bullets in an unordered list.

[Link] CSS Box model

Borders

Every element has a border-style property. It Controls whether the element has a
border and if so, the style of the border. The styles of one of the four sides of an
element can be set with border-style values: none, dotted, dashed, and double
border-width – thin, medium (default), thick, or a length value in pixels. Border
width can be specified for any of the four borders (e.g., border-top-width)
bordercolor – any color. Border color can be specified for any of the four borders
(e.g., border-topcolor)

<html xmlns = "[Link]

<head> <title> Table borders </title>

<style type = "text/css">

table {border-top-width: medium;

border-bottom-width: thick;

border-top-color: red;

border-bottom-color: green;

border-top-style: dotted;

border-bottom-style: dashed;

10. Difference between DIV and SPAN tag.

Type

<div> → Block-level element

<span> → Inline element

Width

<div> → Takes full width of the page

<span> → Takes only required width

Usage

<div> → Used for layout and grouping large sec ons

<span> → Used to style small parts of text

Line Break

<div> → Starts on a new line

<span> → Does not start a new line

Content

<div> → Can contain block and inline elements

<span> → Contains only inline content

Styling

Both are used with CSS for styling

Unit 3:XML and JavaScript Basics

2 Marks Questions

[Link] is XML? What is the use of XML?

XML (Extensible Markup Language) is a markup language used to store and
transport data in a structured format.
It uses custom tags defined by the user.

It is both human-readable and machine-readable.

Uses of XML

 Used to store and organize data

 Used for data exchange between different systems
 Platform independent (works on any system)
 Used in web services and APIs
 Helps in separating data from presentation

[Link] is the difference between HTML and XML?

HTML

 HTML stands for HyperText Markup Language.

 . It is used to display data on web pages.
 HTML has predefined tags.
 HTML is not case-sensitive
 HTML is used for presentation of data.
 HTML focuses on how data looks.
 HTML can ignore small errors.
 HTML is mainly for web browsers.

XML.

 XML stands for eXtensible Markup Language.

 It is used to store and transport data.
 XML allows user-defined tags.
 XML is case-sensitive
 XML is used for describing data.
 XML focuses on what data is.
 XML requires strict syntax rules.
 XML is used for data sharing between systems.
[Link] is the significance of XML?
Significance of XML (eXtensible Markup Language):

Data storage: XML is used to store data in a structured format.

Data exchange: It helps in exchanging data between different systems and

platforms easily.

Platform independent: XML can be used on any operating system or device.

User-defined tags: It allows users to create their own tags

[Link] is JavaScript? List any two features of JS.

JavaScript is a scripting programming language used to make web pages
interactive and dynamic. It runs mainly on the web browser and helps in
controlling website behavior such as form validation, animations, and user
actions.

Two features of JavaScript:

Client-side language: JavaScript runs in the user’s web browser, so it responds

quickly without needing to contact the server every time.

Object-based language: JavaScript supports objects and allows programmers to

use built-in objects for better functionality and code reuse.

[Link] are the primitive datatypes in JS?

Primitive data types in JavaScript are basic data types used to store simple values.

Types of primitive types

[Link]

[Link]

[Link]

[Link]
[Link]

[Link] do you declare a variable in JS?

Variables in JavaScript are used to store data values. We can declare

variables using:

[Link]

[Link]

[Link]

Syntax:

var name = "Ram";

let age = 20;

const pi = 3.14;

[Link] an object in JS.

An object is a data type that allows you to store multiple values in the form of
properties and methods.

Example:

JavaScript

let student = {

name: "ABC",

age: 20,

course: "BCA"

};

[Link] is the use of alert() and prompt() method?

1. alert() method

It is used to display a message box to the user.

It only shows information with an OK button.

Example:

JavaScript

alert("Welcome to JavaScript!");

2. prompt() method

It is used to take input from the user.

It displays a message box with a text field and OK/Cancel buttons.

Example:

JavaScript

let name = prompt("Enter your name:");

[Link] is window object and document object?

Window Object: The window object is the global object in JavaScript that
represents the browser window. It contains all global functions, variables, and
objects like alert(), prompt(), and document.

Document Object: The document object is a part of the window object and
represents the web page (HTML document) loaded in the browser. It is used to
access and modify HTML elements.

5 Marks Questions

1. What is XML? Explain its features.

XML (eXtensible Markup Language):
XML is a markup language used to store, organize, and transport data. It
does not display data like HTML; instead, it focuses on describing and
carrying data in a structured form.
 Features of XML:
[Link]-defined tags:
Users can create their own tags according to requirements.
[Link] storage and transport:
XML is mainly used to store and transfer data between systems.
[Link] independent:
It can run on any operating system or device.
[Link]-descriptive:
The tags clearly describe the meaning of the data.
[Link]-sensitive:
XML tags must be written in correct upper/lower case format.
[Link] structure:
Data is arranged in a tree-like structure (parent-child relationship).
[Link] of data and display:
XML only handles data, not how it is displayed.
2. Explain the meaning and significance of XML.
Meaning of XML:
XML is a language that allows users to define their own tags and structure
data in a clear, hierarchical format. It does not display data; instead, it
focuses on representing and exchanging information between different
systems.
Example:
XML
<student>
<name>ABC</name>
<age>20</age>
</student>
Significance of XML:
[Link] storage:
XML is used to store data in a structured way.
[Link] exchange:
It helps in sharing data between different applications and platforms.
[Link] independent:
 XML works on any operating system or device.
[Link]-defined tags:
Users can create custom tags based on their needs.
[Link] integration:
It is widely used to transfer data between web services and databases.
[Link] format:
Both humans and machines can easily understand XML data.
[Link] of data:
XML separates data from presentation, making it flexible for different uses.
3. Explain Object Oriented concepts in JS.
JavaScript is an object-based language that supports Object-Oriented
Programming (OOP) concepts. It allows you to organize code using objects
that contain data (properties) and functions (methods).
1. Object
An object is a collection of key-value pairs that stores related data and
behavior.
JavaScript
let student = {
name: "ABC",
age: 20,
showInfo: function() {
return [Link] + " " + [Link];
}
};
2. Class
A class is a blueprint for creating objects.
JavaScript
class Student {
constructor(name, age) {
[Link] = name;
[Link] = age;
}
}
 3. Encapsulation
Encapsulation means binding data and methods together in one unit
(object) and restricting direct access.
4. Inheritance
Inheritance allows one class to acquire properties and methods of another
class.
JavaScript
class Person {
constructor(name) {
[Link] = name;
}
}

class Student extends Person {

constructor(name, age) {
super(name);
[Link] = age;
}
}
5. Polymorphism
Polymorphism means one function can behave in different ways.

4. Explain general syntactic characteristics of JS.

 Scripts can appear directly as the content of a <script>tag.
 The type attribute of <script> must be set to“text/javascript”.
 TheJavaScriptscriptcanbeindirectlyembeddedinanXHTMLdocumentwiththe
srcattributeofa
 <script> tag, whose value is the name of a file that contains the script—for
example,

<script type = “text/javascript” src = “tst_number.js” >

</script>
  Notice that the script element requires the closing tag, even though it has
no content when the src attribute is included.
 In JavaScript, identifiers, or names, must begin with a letter, an underscore
( _ ), or a dollar sign ($). Subsequent characters may be letters,
underscores, dollar signs, or digits. There is no length limitation for
identifiers.
 The use of semicolons in JavaScript is unusual. The JavaScript interpreter
tries to make semicolons unnecessary, but it does not always work.
 When the end of a line coincides with what could be the end of a
statement, the interpreter effectively inserts a semicolon there. But this
can lead to problems.
 Inaddition,JavaScripthasalargecollectionofpredefinedwords,includingalert,
open,java,and self.
 JavaScript has two forms of comments, both of which are used in other
languages. First, whenever two adjacent slashes (//) appear on a line, the
rest of the line is considered a comment. Second, /* may be used to
introduce a comment, and */ to terminate it, in both single- and multiple-
line comments.

The XHTML comment used to hide JavaScript uses the normal beginning
syntax,<!--.

6. What are the primitives in JS?

PRIMITIVE TYPES
 JavaScript has five primitive types: Number, String, Boolean,
Undefined, and Null.
 Each primitive value has one of these types.
 JavaScript includes predefined objects that are closely related to the
Number, String, and Boolean types, named Number, String, and
Boolean, respectively.
 These objects are called wrapper objects.
 Each contains a property that stores a value of the corresponding
primitive type.
  The purpose of the wrapper objects is to provide properties and
methods that are convenient for use with values of the primitive
types

NUMERIC AND STRING LITERALS

 All numeric literals are values of type Number. The Number type
values are represented internally double-precision floating-point
form.
 Integer literals are strings of [Link]-point literals can have
decimal points, exponents, or both.
 Exponents are specified with an uppercase or lowercase e and a
possibly signed integer literal.
 Integer literals can be written in hexadecimal form by preceding
their first digit with either 0x or0X.
 A string literal is a sequence of zero or more characters delimited
by either single quotes (‘) or double
 quotes (“).
 String literals can include characters specified with escape
sequences, such as \n and \t. If you want an
 actual single-quote character in a string literal that is delimited by
single quotes, the embedded single
 quote must be preceded by a backslash:
 „You\‟re the most lovely person I\‟ve ever met‟
 A double quote can be embedded in a double-quoted string literal
by preceding it with a backslash. An
 actual backslash character in any string literal must be itself back-
slashed, as in the following example:
 “D:\\bookfiles”
 There is no difference between single-quoted and double-quoted
literal strings.
  The null string (a string with no characters) can be denoted with
either ‘‘or“.
 OTHER PRIMITIVE TYPES
 The only value of type Null is the reserved word null, which
indicates no value.
 The only value of type Undefined is undefined.
 The only values of type Boolean are true and false.

7. Explain screen output and keyboard input in JS.

 JavaScript models the XHTML document with the Document object.
 The window in which the browser displays an XHTML document is
modelled with the Window object.
 The Window object includes two properties, document and window.
 The document property refers to the Document object.
 The window property is self-referential; it refers to the Window object.
 write is used to create XHTML code, the only useful punctuation in its
parameter is in the form of XHTML tags. Therefore, the parameter of write
often includes <br/>.
 The writeln method implicitly adds “\n” to its parameter, but since
browsers ignore line breaks when displaying XHTML, it has no effect on the
output.

There are 3 types of pop-up boxes:

[Link]

[Link]

[Link]

The alert method opens a dialog window and displays its parameter in that
window. It also displays an OK button.
 The confirm method opens a dialog window in which the method displays its
string parameter, along with two buttons: OK and [Link] returns a
Boolean value that indicates the user’s button input: true for OK and false for

Cancel. This method is often used to offer the user the choice of continuing some
process.

The prompt method creates a dialog window that contains a text box used to
collect a string of input from the user, which prompt returns as its value.

7. Explain control statement in JS.

Control statements in JavaScript are used to control the flow of execution
of a program. They decide which block of code should run and how many
times it should run based on conditions.
Types of Control Statements:
1. Conditional Statements
These are used to execute code based on conditions.
a) if statement
Executes a block of code if the condition is true.
JavaScript
if (age >= 18) {
[Link]("Eligible to vote");
}
b) if...else statement
Executes one block if condition is true, otherwise another block.
JavaScript
if (age >= 18) {
[Link]("Adult");
} else {
[Link]("Minor");
}
c) else-if ladder
Used to check multiple conditions.
JavaScript
if (marks >= 90) {
[Link]("A grade");
} else if (marks >= 75) {
[Link]("B grade");
} else {
[Link]("C grade");
}
d) switch statement
Used when there are multiple fixed choices.
JavaScript
switch(day) {
case 1:
[Link]("Monday");
break;
case 2:
[Link]("Tuesday");
break;
}
2. Looping Statements
Used to repeat a block of code multiple times.
a) for loop
JavaScript
for (let i = 1; i <= 5; i++) {
[Link](i);
}
b) while loop
JavaScript
while (i <= 5) {
[Link](i);
i++;
}
c) do...while loop
Executes at least once before checking condition.
 JavaScript
do {
[Link](i);
i++;
} while (i <= 5);

Unit 4:JavaScript Advanced & DOM

2 Mark Questions

[Link] is an array in JS?

An array in JavaScript is a special variable used to store multiple values in a single
variable.

It can store values of different data types.

Arrays are zero-indexed (start from 0).

Example:

JavaScript

let fruits = ["apple", "banana", "mango"];

[Link] to create an array? Give an example.

An array in JavaScript is created using square brackets []. It is used to store
multiple values in a single variable.

Example:

JavaScript

let colors = ["red", "green", "blue"];

[Link](colors[0]); // red

[Link](colors[1]); // green
[Link] is functions in JS? How do you define it?
A function in JavaScript is a block of reusable code that performs a specific task.

It is executed when it is called.

Functions help to reduce code repetition.

Syntax:

JavaScript

function add() {

return 10 + 20;

[Link] is constructor function? How do you create an object using a

constructor?
A constructor function is used to create multiple objects of same type.

It is defined using function name starting with capital letter.

Objects are created using the new keyword.

Example:

JavaScript

function Student(name) {

[Link] = name;

let s1 = new Student("ABC");

[Link] is 'new' keyword?

The new keyword is used to create an object from a constructor function.
It allocates memory for a new object.

It sets this to the new object.

It returns the created object automatically.

[Link] is getElementById() method?

getElementById() is used to select an HTML element by its ID.

It returns a single element.

It is commonly used in DOM manipulation.

Example:

JavaScript

[Link]("demo");

[Link] is getElementsByClassName()?
getElementById() is used to select an HTML element by its ID.

It returns a single element.

It is commonly used in DOM manipulation.

Example:

JavaScript

[Link]("demo");

[Link] is Query Selector?

querySelector() is used to select the first matching element using CSS selector.

It can select by id, class, or tag.

It is more flexible than other methods.

Example:
JavaScript

[Link](".box");

[Link] is an event in JS?

An event in JavaScript is an action or occurrence that happens in the browser and
can be detected by JavaScript.

It is usually triggered by the user or the browser.

Examples of events:

Clicking a button (click event)

Loading a page (load event)

Moving mouse over an element (mouseover event)

Typing in input box (keypress event)

[Link] an example of body event.

Body events are events applied to the <body> tag.

Example is onload.

It executes when the page loads.

Example:

HTML

<body onload="alert('Page loaded')">

[Link] is onload event? Give an example.

The onload event in JavaScript is used to execute a function when a web page or
an element has completely loaded.

It is mainly used to run code after all HTML, images, and resources are fully
loaded in the browser.
Example:

HTML

<body onload="welcomeMessage()">

<script>

function welcomeMessage() {

alert("Page is fully loaded!");

</script>

</body>

[Link] do you handle button click event?

A button click event is handled using the onclick event in JavaScript. It executes a
function when the user clicks a button.

Ways to handle button click event:

1. Using inline HTML (onclick attribute)

HTML

<button onclick="showMessage()">Click Me</button>

<script>

function showMessage() {

alert("Button clicked!");
}

</script>

2. Using JavaScript (addEventListener)

JavaScript

[Link]("btn").addEventListener("click", function() {

alert("Button clicked!");

});

HTML

<button id="btn">Click Me</button>

[Link] is onfocus, onblur, onchange events?

1. onfocus event

The onfocus event occurs when an input field is selected or clicked by the user.

Example:

HTML

<input type="text" onfocus="[Link]='yellow'">

2. onblur event

The onblur event occurs when an input field loses focus (user clicks outside the
field).

Example:

HTML

<input type="text" onblur="alert('Field left')">

3. onchange event
The onchange event occurs when the value of an input field is changed and user
moves away.

Example:

HTML

<input type="text" onchange="alert('Value changed')

5 Mark Questions

[Link] an arrays in JS with an example.

An array in JavaScript is a special type of variable used to store multiple values in
a single variable name. These values can be of the same or different data types.
Arrays store elements in a sequential order using index numbers starting from 0.

Definition:

An array is an ordered collection of elements used to store multiple values in a

single variable.

Example:

JavaScript

let fruits = ["apple", "banana", "mango", "orange"]

Accessing elements:

JavaScript

[Link](fruits[0]); // apple

[Link](fruits[2]); // mango

Features of Array:

 Stores multiple values in one variable

 Uses index-based system starting from 0
 Can store different data types
  Easy to access and manage data

[Link] functions in JS with syntax and example.

A function in JavaScript is a block of reusable code that performs a specific task. It
is executed only when it is called. Functions help to reduce code repetition and
improve program structure.

Syntax of Function:

JavaScript

function functionName(parameters) {

// code to be executed

Example of Function:

JavaScript

function add() {

let a = 10;

let b = 20;

[Link](a + b);

add(); // function call

Function with parameters:

JavaScript

function add(a, b) {

[Link](a + b);
}

add(5, 10); // output: 15

Explanation:

 function keyword is used to define a function

 add() is the function name
 Parameters are optional
 Function is executed when it is called

[Link] constructor functions in JS with an example.

A constructor in JavaScript is a special function used to create and initialize
objects. It is automatically called when an object is created using the new
keyword. Constructors help to create multiple objects with similar properties.

Syntax of Constructor Function:

JavaScript

function FunctionName(parameter1, parameter2) {

this.property1 = parameter1;

this.property2 = parameter2;

Example:

JavaScript

function Student(name, age) {

[Link] = name;

[Link] = age;

}
let s1 = new Student("Kavana", 20);

[Link]([Link]);

[Link]([Link]);

Explanation:

 Student is a constructor function

 this keyword refers to the current object
 new keyword creates a new object
 s1 is an object created using constructor

[Link] DOM and methods to access the element in JS.

DOM (Document Object Model) is a programming interface that represents an
HTML document as a tree structure. It allows JavaScript to access, change, add, or
delete HTML elements dynamically.

In simple words, DOM connects web page (HTML) and JavaScript so that the page
can become interactive.

Structure of DOM:

HTML document is converted into a tree of objects

Each element (like <html>, <body>, <p>) is a node

Methods to Access Elements in JavaScript (DOM Methods):

1. getElementById()

Used to select an element by its id attribute.

JavaScript

[Link]("demo");

2. getElementsByClassName()
Used to select elements by their class name. It returns a collection.

JavaScript

[Link]("test");

3. getElementsByTagName()

Used to select elements by tag name.

JavaScript

[Link]("p");

4. querySelector()

Selects the first matching element using CSS selector.

JavaScript

[Link]("#demo");

[Link](".test");

5. querySelectorAll()

Selects all matching elements and returns a list.

JavaScript

[Link]("p");

[Link] element access using getElementById with example.

The getElementById() method in JavaScript is used to access an HTML element
using its unique id attribute. It is one of the most commonly used DOM methods.

Syntax:

JavaScript

[Link]("id_name");
Explanation:

It selects a single HTML element

The element must have a unique id

It allows JavaScript to change content, style, or attributes of that element

Example:

HTML + JavaScript

HTML

<p id="demo">Hello World</p>

<button onclick="changeText()">Click Me</button>

<script>

function changeText() {

[Link]("demo").innerHTML = "Text Changed!";

</script>

[Link] event handling in JS.

Event handling in JavaScript is a process of detecting and responding to user
actions or browser actions on a web page. These actions are called events.

Examples of events: clicking a button, typing in a box, loading a page, etc.

Definition:

Event handling means writing JavaScript code that executes when an event
occurs.
Ways to handle events:

1. Using HTML event attributes

HTML

<button onclick="showMessage()">Click Me</button>

<script>

function showMessage() {

alert("Button clicked!");

</script>

2. Using JavaScript (addEventListener)

JavaScript

[Link]("btn").addEventListener("click", function() {

alert("Button clicked!");

});

HTML

<button id="btn">Click Me</button>

[Link] handling the click event in JS.

A click event in JavaScript occurs when a user clicks on an HTML element like a
button, link, or image. Handling this event means writing code that runs when the
click happens.

Definition:
Click event handling is the process of executing a function when an element is
clicked by the user.

Ways to handle click event:

1. Using onclick attribute (HTML method)

HTML

<button onclick="showMessage()">Click Me</button>

<script>

function showMessage() {

alert("Button clicked!");

</script>

2. Using addEventListener() method (JavaScript method)

JavaScript

[Link]("btn").addEventListener("click", function() {

alert("Button clicked!");

});

HTML

<button id="btn">Click Me</button>

Explanation:

 When the user clicks the button, the event is triggered

 JavaScript function is executed
 It can perform actions like showing alert, changing text, or updating style
[Link] textbox events in JS.
Textbox events in JavaScript are events that occur when a user interacts with an
input text field. These events help in handling user input and making forms
interactive.

Common Textbox Events:

1. onfocus event

Occurs when the user clicks or enters inside the textbox.

HTML

<input type="text" onfocus="[Link]='yellow'">

✔ It highlights the textbox when selected.

2. onblur event

Occurs when the textbox loses focus (user clicks outside).

HTML

<input type="text" onblur="alert('Textbox left')">

3. onchange event

Occurs when the value of textbox is changed and focus is lost.

HTML

<input type="text" onchange="alert('Value changed')">

4. onkeyup event

Occurs when a key is released after typing.

HTML

<input type="text" onkeyup="[Link]('Key released')">

5. onkeydown event
Occurs when a key is pressed down.

Unit 5:Server side scripting and PHP

2 mark Question

[Link] is Server Side Script? Name any two server side scripting
languages.
server-side script is a program that runs on the web server to process user
requests, manage data, and generate dynamic web pages before sending them to
the browser.

[Link]

[Link]

[Link] is PHP? What is the use of PHP?

PHP stands for Hypertext Preprocessor. It is a server-side scripting language used
to develop dynamic and interactive web pages. PHP code runs on the server and
sends output to the web browser in HTML form.

Uses of PHP:

 Creating dynamic web pages (web pages that change content).

 Handling forms (collecting and processing user input).
 Database interaction (store, update, and retrieve data using databases like
MySQL).
 User authentication (login and registration systems).

[Link] do you declare variables in PHP?

In PHP, variables are used to store data values. A variable is declared using the
dollar sign $ followed by the variable name.

Syntax:

PHP
$variable_name = value;

Rules for declaring variables:

 Variable name must start with $

 It should start with a letter or underscore
 It is case-sensitive ($name and $Name are different)
 No need to specify data type

[Link] is difference between GET and POST?

GET Method
 Data is sent through the URL
 Data is visible in the address bar
 Less secure
 Limited data size
 Can be bookmarked

POST Method
 Data is sent through the http request body
 Data is not visible in the address bar
 More secure compare to Get
 Can send large amount of data
 Used for sending data
 Cannot be bookmarked

[Link] is string in PHP?

A string in PHP is a sequence of characters enclosed within single quotes (' ') or
double quotes (" "). It is used to store text such as words, sentences, or
characters.

Definition:

A string is a data type used to represent textual data in PHP.

Example:

PHP

<?php

$name = "ABC";

echo $name;

?>

[Link] is an array in PHP?

An array in PHP is a special variable used to store multiple values in a single
variable. Instead of creating many variables, we can store all values in one array.

<?php

$fruits = array("Apple", "Banana", "Mango");

echo $fruits[0];

echo $fruits[1];

?>

[Link] the different types of errors in PHP.

[Link] Error

[Link] Error

[Link] Error

[Link] Error

[Link] Error

5 Mark Questions
[Link] Server Side Scripting. Advantages and disadvantages with
example.
Server-side scripting is a technique where the script runs on the web server
instead of the user’s browser. It processes user requests, interacts with
databases, and generates dynamic web pages before sending them to the client
(browser).

Example: (PHP Server-side script)

PHP

<?php

$name = "Kavana";

echo "Welcome " . $name;

?>

Advantages of Server-Side Scripting:

[Link]: Code is hidden from users, improving security.

[Link] interaction: Easily connects with databases like MySQL.

[Link] content: Creates web pages that change based on user input.

[Link] control: Updates are done on the server, affecting all users.

Disadvantages of Server-Side Scripting:

[Link] response: Depends on server speed and internet connection.

[Link] load: Heavy traffic can slow down the server.

[Link] server setup: Needs web server and backend configuration.

[Link] complex: Requires knowledge of backend programming.

[Link] PHP and its features.

PHP is a server-side scripting language used to create dynamic and interactive
web pages. It runs on the server and sends output in HTML format to the
browser. PHP is widely used for web development and database-driven
applications.

Features of PHP:

1. Open Source

PHP is free to use and easily available for everyone.

2. Server-side language

It runs on the server, not in the browser.

3. Platform independent

PHP works on different operating systems like Windows, Linux, and Mac.

4. Easy to learn

PHP has a simple syntax, making it easy for beginners.

5. Database support

It supports many databases like MySQL, Oracle, and PostgreSQL.

6. Embedded in HTML

PHP code can be easily written inside HTML pages.

7. Case sensitive

Variables in PHP are case sensitive.

Example:

PHP

<?php

echo "Hello, Welcome to PHP!";

?>

[Link] how PHP is embedded in HTML with example.

PHP can be easily embedded inside HTML code. This means PHP code is written
within an HTML file to make web pages dynamic. The PHP code is executed on the
server, and only the output (HTML) is sent to the browser.

How it works:

HTML provides the structure of the web page

PHP adds dynamic content inside HTML

PHP code is written between <?php ... ?> tags

Example:

PHP

<!DOCTYPE html>

<html>

<body>

<h2>PHP Embedded in HTML</h2>

<?php

$name = "Kavana";

echo "<p>Welcome " . $name . "</p>";

?>

</body>
</html>

Explanation:

 HTML creates the page structure

 PHP variable $name stores data
 echo prints PHP output inside HTML
 The final output is displayed as a normal web page

[Link] installation and setup of PHP environment.

To run PHP programs, we need a proper PHP environment which includes a web
server, PHP engine, and database server. The most common package used is
XAMPP.

Steps to Install and Set Up PHP Environment:

1. Download XAMPP

 Go to the official website: [Link]

 Download XAMPP for your operating system (Windows/Linux/Mac).

2. Install XAMPP

 Run the downloaded setup file

 Follow installation steps and click Next → Install

3. Start XAMPP Server

 Open XAMPP Control Panel

 Start Apache (web server)
 Start MySQL (database server)

4. Create PHP File

 Go to htdocs folder inside XAMPP directory

 Create a new file like [Link]

5. Write PHP Code

PHP

<?php

echo "Hello, PHP is working!";

?>

[Link] the rules for variables in PHP.

Variables in PHP are used to store data, but they must follow certain rules while
declaring them.

1. Must start with $ sign

Every variable in PHP must begin with the dollar symbol ($).

Example:

PHP

$name = "Kavana";

2. Must start with a letter or underscore

Variable names cannot start with a number. They must start with a letter (A–Z, a–
z) or underscore (_).

Example:

PHP

$_age = 20;

$name1 = "John";

3. No spaces allowed

Variable names should not contain spaces. Use underscore instead.

Example:

PHP
$first_name = "Ram";

4. Case sensitive

PHP variables are case sensitive, so $name and $Name are different.

Example:

PHP

$name = "Kavana";

$Name = "Ravi";

5. Cannot use special characters

Variables should not include symbols like @, #, %, -. Only underscore is allowed.

6. Cannot use reserved keywords

Variable names should not be PHP reserved words like echo, if, while, etc.

[Link] GET and POST method in PHP.

PHP, GET and POST are two methods used to send data from HTML form to the
server.

1. GET Method

The GET method sends form data through the URL. The data is visible in the
address bar.

Example:

HTML

<form method="GET" action="[Link]">

Name: <input type="text" name="name">

<input type="submit">

</form>
PHP

<?php

echo $_GET["name"];

?>

Features:

 Data is visible in URL

 Less secure
 Limited data size
 Used for simple requests

[Link] string handling in PHP functions.

String handling in PHP refers to the built-in functions used to manipulate and
manage strings such as finding length, converting case, comparing, and modifying
text.

Common String Functions in PHP:

1. strlen()

It is used to find the length of a string.

PHP

<?php

echo strlen("Hello");

?>

2. str_word_count()

It counts the number of words in a string.

PHP

<?php
echo str_word_count("Hello World");

?>

3. strrev()

It is used to reverse a string.

PHP

<?php

echo strrev("PHP");

?>

4. strtoupper()

Converts string into uppercase.

PHP

<?php

echo strtoupper("hello");

?>

5. strtolower()

Converts string into lowercase.

PHP

<?php

echo strtolower("HELLO");

?>

6. str_replace()

Replaces a word inside a string.

PHP

<?php

echo str_replace("World", "PHP", "Hello World");

?>

[Link] the types of error in PHP with example.

In PHP, an error is a problem in a program that prevents it from running correctly
or produces incorrect output. PHP errors are mainly classified into different types
based on how and when they occur.

1. Syntax Error

A syntax error occurs when the code does not follow PHP rules (grammar of the
language). It is detected before execution.

Example:

PHP

<?php

echo "Hello"

?>

2. Runtime Error

A runtime error occurs while the program is running due to invalid operations.

Example:

PHP

<?php

echo 10 / 0;

?>
3. Logical Error

A logical error occurs when the program runs but gives wrong output due to
incorrect logic.

Example:

PHP

<?php

$a = 10;

$b = 5;

echo $a - $b; // expected addition but subtraction done

?>