1.
Difference between client-side scripting and server-side scripting :
Client-side scripting Server-side scripting
Source code is not visible to the user because its
output
Source code is visible to the user.
of server-sideside is an HTML page.
Its primary function is to manipulate and provide
Its main function is to provide the
access to the respective database as per the
requested output to the end user.
request.
In this any server-side technology can be used
It usually depends on the browser and and it does not
its version. depend on the client.
It runs on the user’s computer. It runs on the webserver.
There are many advantages linked
The primary advantage is its ability to highly
with this like faster.
customize, response
response times, a more interactive
requirements, access rights based on user.
application.
It does not provide security for data. It provides more security for data.
It is a technique used in web It is a technique that uses scripts on the
development in which scripts run on webserver to produce a response that is
the client’s browser. customized for each client’s request.
HTML, CSS, and javascript are used. PHP, Python, Java, Ruby are used.
No need of interaction with the server. It is all about interacting with the servers.
It reduces load on processing unit of
It surge the processing load on the server.
the server.
2. EXPLAIN ANY TWO PAGE STRUCTURE ELEMENTS?
An HTML element is defined by a start tag, some content, and an end tag.
HTML Elements
The HTML element is everything from the start tag to the end tag:
<tagname>Content goes here...</tagname>
Examples of some HTML elements:
<h1>My First Heading</h1>
<p>My first paragraph.</p>
Start tag Element content End tag
<h1> My First Heading </h1>
<p> My first paragraph. </p>
<br> none none
Nested HTML Elements
HTML elements can be nested (this means that elements can contain other elements).
All HTML documents consist of nested HTML elements.
The following example contains four HTML elements (<html>, <body>, <h1> and <p>):
<!DOCTYPE html>
<html>
<body>
<h1>My First Heading</h1>
<p>My first paragraph.</p>
</body>
</html>
[Link] ABOUT TEXT SHADOW PROPERTY?
The CSS text-shadow property adds shadows to text for depth and emphasis. It accepts values for horizontal
and vertical shadow positions, blur radius, and shadow color. The default is no shadow is none.
Syntax
text-shadow: h-shadow v-shadow blur-radius color | none | initial | inherit;
[Link] ARE USER STYLE SHEETS?
ser style sheets are a feature of web browsers that allow users to customize the look and feel of web pages.
User style sheets are separate CSS files that users can create and apply to specific web pages or entire
domains. User style sheets override the default styles defined by web pages and browser settings.
How to Apply a User Style Sheet
There are different ways to apply a user style sheet depending on the browser:
✅ 1. Using Browser Extensions (Recommended)
Stylus (Chrome, Firefox, Edge) – Lets users create and apply custom CSS.
UserCSS – Allows for persistent custom styles.
✅ 2. Manually Adding a User Style Sheet
In some browsers (e.g., Firefox), you can create a [Link] file.
[Link] EXPLAIN ABOUT MULTITIER APPLICATION ARCHITECTURE?(NOTES)
[Link] ABOUT LINKS IN HTML WITH EXAMPLE?
HTML links are hyperlinks.
You can click on a link and jump to another document.
HTML Links - Syntax
The HTML <a> tag defines a hyperlink. It has the following syntax:
<a href="url">link text</a>
The most important attribute of the <a> element is the href attribute, which indicates the link's destination.
The link text is the part that will be visible to the reader.
Clicking on the link text, will send the reader to the specified URL address.
Example
This example shows how to create a link to [Link]:
<a href="[Link] [Link]!</a>
HTML Links - Use an Image as a Link
To use an image as a link, just put the <img> tag inside the <a> tag:
Example
<a href="[Link]">
<img src="[Link]" alt="HTML tutorial" style="width:42px;height:42px;">
</a>
Try it Yourself »
Link to an Email Address
Use mailto: inside the href attribute to create a link that opens the user's email program (to let them send a new email):
Example
<a href="[Link] email</a>
[Link] ABOUT HTML5 FORM INPUT TYPES?(NOTES)
[Link] ABOUT DATALIST AND AUTOCOMPLETE ATTRIBUTE WITH AN EXAMPLE?
The <datalist> tag specifies a list of pre-defined options for an <input> element.
The <datalist> tag is used to provide an "autocomplete" feature for <input> elements. Users will see a drop-
down list of pre-defined options as they input data.
The <datalist> element's id attribute must be equal to the <input> element's list attribute (this binds them
together).
<label for="browser">Choose your browser from the list:</label>
<input list="browsers" name="browser" id="browser">
<datalist id="browsers">
<option value="Edge">
<option value="Firefox">
<option value="Chrome">
<option value="Opera">
<option value="Safari">
</datalist>
autocomplete attribute:
The autocomplete attribute specifies whether a form or an input field should have autocomplete on or off.
Autocomplete allows the browser to predict the value. When a user starts to type in a field, the browser should
display options to fill in the field, based on earlier typed values.
The autocomplete attribute can be used on the following elements:
Elements Attribute
<form> autocomplete
<input> autocomplete
<form action="/action_page.php" method="get" autocomplete="on">
First name:<input type="text" name="fname"><br>
E-mail: <input type="email" name="email"><br>
<input type="submit">
</form>
[Link] ABOUT CSS DROPDOWN MENUS?(NOTES)
[Link] IS ANIMATION? EXPLAIN HOW AN OBJECT CAN BE ANIMATED WITH EXAMPLE?
CSS allows animation of HTML elements without using JavaScript!
An animation lets an element gradually change from one style to another.
You can change as many CSS properties you want, as many times as you want.
To use CSS animation, you must first specify some keyframes for the animation.
Keyframes hold what styles the element will have at certain times.
The @keyframes Rule
When you specify CSS styles inside the @keyframes rule, the animation will gradually change from the current
style to the new style at certain times.
To get an animation to work, you must bind the animation to an element.
The following example binds the "example" animation to the <div> element. The animation will last for 4
seconds, and it will gradually change the background-color of the <div> element from "red" to "yellow":
/* The animation code */
@keyframes example {
from {background-color: red;}
to {background-color: yellow;}
}
/* The element to apply the animation to */
div {
width: 100px;
height: 100px;
background-color: red;
animation-name: example;
animation-duration: 4s;
}
