0% found this document useful (0 votes)
5 views18 pages

Web PDF

web progarmmin

Uploaded by

uttam porwal
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
5 views18 pages

Web PDF

web progarmmin

Uploaded by

uttam porwal
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 18

Q1.

Explain the following terms: WWW, HTTP, HTTPS, Web browser, Web Server
Ans. WWW (World Wide Web): A system of interlinked hypertext documents and
multimedia content accessible via the internet. It is commonly referred to as "the web."
HTTP (HyperText Transfer Protocol): A protocol used for transmitting hypertext across the
web. It defines how messages are formatted and transmitted, and how web servers and
browsers respond to various commands.
HTTPS (HyperText Transfer Protocol Secure): A secure version of HTTP, where data
exchanged between the client and the server is encrypted to enhance security.
Web Browser: A software application used to access information on the World Wide Web.
Common examples include Google Chrome, Firefox, and Safari.
Web Server: A server that hosts websites and delivers content to clients (usually browsers)
upon request using protocols like HTTP and HTTPS.

Q2. Explain the Internet & WWW in detail


Ans. Internet: The internet is a global network of computers interconnected through a vast
infrastructure of routers, servers, and cables. It allows for the exchange of data across devices
worldwide.
World Wide Web (WWW): While the internet refers to the infrastructure, the World Wide
Web refers to the collection of web pages and content that can be accessed using the internet
via browsers.
The WWW operates over the internet using HTTP and HTTPS protocols. It allows users to
navigate between pages using hyperlinks and access multimedia content such as text, images,
audio, and video.

Q3. Explain Client-Server Architecture with diagram


Ans. Client-Server Architecture is a distributed system framework where the workload is
divided between service providers (servers) and service requesters (clients).
Client: The client makes requests for data or services (e.g., a web browser requesting a web
page).
Server: The server responds to the client’s request by sending the required data (e.g., a web
server sending the requested HTML page).
In this model, the client and server communicate over a network (such as the internet), and
the server hosts, processes, and manages resources to respond to clients.
A diagram illustrating this would show clients on one side sending requests to a server on the
other side, with arrows indicating the direction of the requests and responses

Q4. Explain the HTTP Request-Response Model


Ans. The HTTP request-response model consists of:
1. Client Request: A client (like a web browser) sends a request to the web server using
HTTP/HTTPS. This request consists of:
- The method (GET, POST, PUT, DELETE, etc.).
- A URL identifying the resource.
- Additional headers providing more information.

2. Server Response: The server processes the request and returns a response containing:
- A status code (e.g., 200 for OK, 404 for Not Found).
- The requested content (such as an HTML page, JSON data, etc.).
- Additional headers (content type, caching policies, etc.).

Q5. What is a web page and web browser? Explain how to create a simple web page?
Ans. Web Page: A web page is a document or resource available on the World Wide Web. It is
typically written in HTML and can include text, images, videos, and links to other web pages.
-Web Browser: A web browser is a software tool that allows users to access, navigate, and
interact with web pages. Examples include Chrome, Firefox, and Edge.

Creating a Simple Web Page:


<!DOCTYPE html>
<html>
<head>
<title>Simple Web Page</title>
</head>
<body>
<h1>Welcome to My Web Page</h1>
<p>This is a simple web page example.</p>
</body>
</html>

Q6. Explain HTML Structure in detail with an example


Ans. HTML documents have a structured format, consisting of various tags:
- `<!DOCTYPE html>`: Declares the document as an HTML5 document.
-`<html>`: The root element that contains all other HTML elements.
- `<head>`: Contains metadata about the document (e.g., title, links to stylesheets).
- `<body>`: Contains the actual content of the web page (text, images, links, etc.).
- `<title>`: Sets the title of the web page displayed in the browser tab.

Example:
<!DOCTYPE html>
<html>
<head>
<title>Sample HTML Structure</title>
</head>
<body>
<h1>Main Heading</h1>
<p>This is a paragraph in a simple HTML structure.</p>
</body>
</html>
Q7. Explain any 7 basic tags of HTML with examples
Ans.
1 `<html>`: Defines the root of the HTML document.
2. `<head>`: Contains metadata, title, and linked resources.
3. `<body>`: Contains the visible content.
4. `<h1>` to `<h6>`: Define headings, with `<h1>` being the largest.
<h1>Heading 1</h1>
5. `<p>`: Defines a paragraph.
<p>This is a paragraph.</p>
6. `<a>`: Defines a hyperlink.
<a href="http://example.com">Click here</a>
7. `<img>`: Embeds an image.
<img src="image.jpg" alt="An Image">

Q8. Explain Heading tag and Paragraph tag in HTML with examples
Ans. Heading Tags (`<h1>` to `<h6>`): HTML provides six levels of headings, from `<h1>`
(largest) to `<h6>` (smallest). Headings are important for structuring the content of a
webpage.
Example:
<h1>This is a Heading 1</h1>
<h2>This is a Heading 2</h2>
Paragraph Tag (`<p>`): The paragraph tag is used to define a block of text. It automatically
adds spacing before and after the paragraph content.
Example:
<p>This is a simple paragraph.</p>

Q9. Explain How to set font colour and body background colour in HTML
Ans. You can set font color and background color using inline styles or CSS.:
Font Color: This is set using the `color` property in CSS or the `style` attribute in HTML.
Example:
-<p style="color: red;">This is red text.</p>
-Body Background Color: This can be done using the `background-color` property.
Example:
html
<body style="background-color: lightblue;">
<p>This page has a light blue background.</p>
</body>

Q10. What is an ordered list in HTML? Explain different types of ordered lists with
examples.
Ans. Ordered List (`<ol>`): An ordered list displays items in a sequence, usually numbered.

Types of Ordered Lists:


1. Numbered (default):
<ol>
<li>Item 1</li>
<li>Item 2</li>
</ol>
2. Alphabetical:
<ol type="A">
<li>Item A</li>
<li>Item B</li>
</ol>
3. Roman Numerals:
<ol type="I">
<li>Item I</li>
<li>Item II</li>
</ol>

Q11. What is an unordered list in HTML? Explain different types of unordered lists with
examples.
Ans. Unordered List (`<ul>`): An unordered list displays items without a particular sequence,
typically marked with bullet points.
Example:
<ul>
<li>Item 1</li>
<li>Item 2</li>
</ul>
You can customize the bullet style with the `type` attribute:
1. Disc (default):
<ul type="disc">
<li>Item 1</li>
<li>Item 2</li>
</ul>
2. Circle:
<ul type="circle">
<li>Item 1</li>
<li>Item 2</li>
</ul>
3. Square:
<ul type="square">
<li>Item 1</li>
<li>Item 2</li>
</ul>

Q12. Explain HTML Description List with example


Ans. Description list (`<dl>`) is used for key-value pairs, such as terms and definitions.
- `<dl>`: Defines the description list.
- `<dt>`: Defines the term.
- `<dd>`:Defines the description of the term.
Example:
<dl>
<dt>HTML</dt>
<dd>Hypertext Markup Language.</dd>
<dt>CSS</dt>
<dd>Cascading Style Sheets.</dd>
</dl>

Q13. Explain Anchor tag with its attributes


Ans. The anchor tag (`<a>`) is used to create hyperlinks in HTML, allowing users to navigate
between pages or to different sections within the same page.
Important Attributes:
- `href`: Specifies the URL of the page the link goes to.
- `target`: Specifies where to open the linked document. Common values are `_blank` (new
tab/window), `_self` (same window).
- `title`: Displays extra information about the link when the user hovers over it.
Example:
<a href="https://www.example.com" target="_blank" title="Visit Example">Visit
Example</a>

Q14. Explain how to attach an image in an HTML page. Also explain various attributes of it.
Ans. To add an image in an HTML page, you use the `<img>` tag. It is a self-closing tag that
does not require an end tag.
Attributes:
-`src`: Specifies the path of the image.
- `alt`: Provides alternative text if the image cannot be displayed.
- `width` and `height`: Set the size of the image.
Example:
<img src="image.jpg" alt="Sample Image" width="200" height="150">

Q15. Explain how to attach a video in an HTML page. Also explain various attributes of it.
Ans. To embed a video, you use the `<video>` tag.
Attributes:
- `src`: Specifies the video file location.
- `controls`: Adds play, pause, and volume controls to the video.
- `autoplay`: Makes the video start playing as soon as it loads.
- `loop`: Makes the video loop continuously.
Example:
<video src="video.mp4" controls width="500" height="300">
Your browser does not support the video tag.
</video>

Q16. Explain Autoplay, controls, height, width, muted, poster, src attribute of video tag
Ans.
- `autoplay`: Automatically starts playing the video when it is loaded.
- `controls`: Displays built-in controls for play, pause, and volume.
- `height` & `width`: Specify the size of the video.
- `muted`: Starts the video with the sound turned off.
- `poster`: Displays an image before the video starts playing.
- `src`: Specifies the location of the video file.

Q17. Explain how to attach an audio in an HTML page. Also explain various attributes of it.
Ans. To embed audio in an HTML page, you use the `<audio>` tag.
Attributes:
- `src`: Specifies the location of the audio file.
- `controls`: Displays built-in controls such as play, pause, and volume.
- `autoplay`: Starts the audio automatically when the page loads.
- `loop`: Plays the audio on a continuous loop.
- `muted`: Starts the audio with the volume muted.

Example:
<audio src="audio.mp3" controls>
Your browser does not support the audio element.
</audio>
Q18. Explain Table tag with its attributes
Ans. The `<table>` tag is used to define a table in HTML. Tables are structured with rows
(`<tr>`), headers (`<th>`), and data cells (`<td>`).
Attributes:
- `border`: Specifies the width of the table border.
- `cellpadding`: Defines the space between the cell content and its border.
- `cellspacing`: Defines the space between the table cells.
Example:
<table border="1" cellpadding="5" cellspacing="5">
<tr>
<th>Name</th>
<th>Age</th>
</tr>
<tr>
<td>John</td>
<td>25</td>
</tr>
</table>

Q19. Explain cell padding and cell spacing with examples


Ans. Cell Padding: Refers to the space between the cell content and the cell border.
- Cell Spacing: Refers to the space between individual table cells.

Example:
<table border="1" cellpadding="10" cellspacing="5">
<tr>
<td>Cell 1</td>
<td>Cell 2</td>
</tr>
</table>
In this example:
- `cellpadding="10"` adds 10 pixels of space inside the cells around the content.
- `cellspacing="5"` adds 5 pixels of space between the cells themselves.

Q20. Explain rowspan and colspan with examples


Ans. `rowspan`: Merges a cell vertically across multiple rows.
- `colspan`: Merges a cell horizontally across multiple columns.

Example of `rowspan`:
<table border="1">
<tr>
<td rowspan="2">Rowspan Cell</td>
<td>Cell 1</td>
</tr>
<tr>
<td>Cell 2</td>
</tr>
</table>
Example of `colspan`:
<table border="1">
<tr>
<td colspan="2">Colspan Cell</td>
</tr>
<tr>
<td>Cell 1</td>
<td>Cell 2</td>
</tr>
</table>

Q21. Explain the following tags: `<br>`, `<hr>`, `<b>`, `<i>`, `<u>`, `<pre>`, `<sub>`,
`<sup>`
Ans. -`<br>`: Inserts a line break.
This is a line break. <br>This is a new line.
- `<hr>`: Inserts a horizontal rule.
<hr>
-`<b>`: Makes text bold.
<b>This text is bold.</b>
- `<i>`: Italicizes text.
<i>This text is italic.</i>
- `<u>`: Underlines text.
<u>This text is underlined.</u>
- `<pre>`: Pre-formats text (preserves whitespace and line breaks).
<pre>
Line 1
Line 2
</pre>
- `<sub>`: Subscript text.
H<sub>2</sub>O (Water molecule)
- `<sup>`: Superscript text.
E = mc<sup>2</sup>

Q22. Explain Marquee tag with its attributes


Ans. The `<marquee>` tag is used to create scrolling text or images on a webpage (though it
is outdated and not recommended for modern web development).
Attributes:
- `direction`: Specifies the direction of the scroll (`left`, `right`, `up`, `down`).
- `behavior`: Specifies the scrolling behavior (`scroll`, `slide`, `alternate`).
- `scrollamount`: Specifies the speed of the marquee.

Example:
<marquee direction="left" scrollamount="5">This is scrolling text.</marquee>
Q23. What is HTML form tag? Explain its importance in client-server architecture
Ans. The `<form>` tag is used to collect user input in an HTML page and send it to a server
for processing.
- Importance in Client-Server Architecture: Forms are essential for sending data from the
client (user) to the server. For example, login credentials or search queries are often sent
through forms.
Example:
<form action="/submit" method="post">
<label for="name">Name:</label>
<input type="text" id="name" name="name">
<input type="submit" value="Submit">
</form>
- `action`: Specifies the server endpoint that will process the form data.
- `method`: Defines how the data will be sent (`GET` or `POST`).

Q24. Explain Text fields, password field, submit button, reset button, file upload, and custom
button with its attributes and example
Ans.
1. Text Field (`<input type="text">`):
- Used for single-line text input.
<input type="text" name="username">

2. Password Field (`<input type="password">`):


- Masks input with dots or asterisks.
<input type="password" name="password">

3. Submit Button (`<input type="submit">`):


- Submits the form data to the server.
<input type="submit" value="Submit">

4. Reset Button (`<input type="reset">`):


- Resets all form fields to their default values.
<input type="reset" value="Reset">

5. File Upload (`<input type="file">`):


- Allows users to upload a file.
<input type="file" name="file">

6. Custom Button (`<button>`):


- Used to define a custom button with any content (e.g., text, image).
<button type="button">Click Me</button>

Q25. Explain radio button and check box with its attributes and example
Ans. Radio Button (`<input type="radio">`): Allows the user to select only one option from
a group.
Example:
<input type="radio" name="gender" value="male"> Male
<input type="radio" name="gender" value="female"> Female
- Checkbox (`<input type="checkbox">`): Allows the user to select multiple options.
Example:
<input type="checkbox" name="hobby" value="reading"> Reading
<input type="checkbox" name="hobby" value="sports"> Sports

Q26. Explain the drop-down list and text area with its attributes and example
Ans. Drop-down List (`<select>`): The drop-down list allows users to choose one option
from a set of options.

Attributes:
- `name`: Specifies the name of the drop-down list.
- `multiple`: Allows the user to select more than one option.

Example:
<select name="cars">
<option value="volvo">Volvo</option>
<option value="bmw">BMW</option>
</select>
- Text Area (`<textarea>`): The text area allows users to input multi-line text.
Attributes:
- `rows`: Specifies the number of visible text lines.
- `cols`: Specifies the visible width of the text area.

Example:

<textarea rows="4" cols="50" name="comments">Enter your comments here...</textarea>

Q27. Explain frame and frameset with its attributes and example
Ans. `<frame>` : The frame tag was used to define a window (or frame) in a frameset.
Frames allow you to divide the browser window into multiple sections where each section
can load a separate HTML document.
- `<frameset>` : This tag was used to organize multiple frames on a webpage.
Attributes:
- `rows`/`cols`: Define the size of rows or columns in the frameset.

Example:
<frameset cols="50%, 50%">
<frame src="page1.html">
<frame src="page2.html">
</frameset>
Note: Frames are outdated and no longer used in modern web development.

Q28. Explain the nested frame with an example


Ans. A nested frame allows you to have frames inside other framesets, creating a complex
layout.
Example:
<frameset rows="50%, 50%">
<frameset cols="50%, 50%">
<frame src="page1.html">
<frame src="page2.html">
</frameset>
<frame src="page3.html">
</frameset>

Q29. Explain section, article, aside, header, footer, nav, dialog, figure, date, time, week tags
of HTML5
Ans. `<section>`: Represents a generic section of a document.
<section>
<h2>Section Title</h2>
<p>This is a section.</p>
</section>
- `<article>`: Represents independent, self-contained content like a blog post or news article.
<article>
<h2>Article Title</h2>
<p>This is an article.</p>
</article>
- `<aside>`: Represents content that is tangentially related to the main content, such as a
sidebar.
<aside>
<p>This is a sidebar.</p>
</aside>
- `<header>`: Represents introductory content, typically containing navigational links or
introductory content.
<header>
<h1>Website Title</h1>
<nav>
<a href="#">Home</a>
<a href="#">Contact</a>
</nav>
</header>
- `<footer>`: Represents footer content at the end of a document or section.
<footer>
<p>Footer content here.</p>
</footer>
- `<nav>`: Represents navigation links.
<nav>
<a href="#">Link 1</a>
<a href="#">Link 2</a>
</nav>
- `<dialog>`: Represents a dialog box or window.
<dialog open>This is a dialog box.</dialog>
- `<figure>`: Used to group media (images, videos) and captions.
<figure>
<img src="image.jpg" alt="An image">
<figcaption>Image description.</figcaption>
</figure>
- `<date>`, `<time>`, `<week>`: These represent specific date/time inputs or elements in
HTML5 forms.
<input type="date">
<input type="time">
<input type="week">

Q30. Explain email, range, number tags with their attributes and example
Ans. Email (`<input type="email">`): Ensures the input is in a valid email format.
Example:
<input type="email" name="email" required>
- Range (`<input type="range">`): Allows users to select a value within a range.
Example:
<input type="range" min="1" max="100" value="50">
- Number (`<input type="number">`): Allows users to enter a number and control it with up
and down arrows.
Example: <input type="number" name="age" min="18" max="100">

Q31. What is CSS? Explain its importance with advantages and disadvantages
Ans. CSS (Cascading Style Sheets): CSS is used to control the look and feel of HTML
elements on a webpage. It is responsible for the visual presentation, including layout, colors,
fonts, and spacing.

Importance:
- CSS separates content from presentation, allowing you to design pages more efficiently.
- It makes it easier to apply consistent styles across multiple pages.
- It improves maintainability by centralizing style rules in external stylesheets.

Advantages:
- Separation of content and style: You can maintain a consistent design across many pages
by linking a single CSS file.
- Efficient code: CSS reduces redundancy by avoiding the need to repeat style rules in every
element.
- Easier maintenance: When changes are made to CSS files, the changes are reflected across
all linked pages.

Disadvantages:
- Browser compatibility issues: Some browsers may not fully support certain CSS
properties.
- Complexity for large projects: Large projects may require careful management of CSS to
avoid conflicts and maintain readability.

Q32. Explain simple / HTML element selector with example


Ans. HTML element selector: Targets all instances of a specific HTML tag.
Example:
p{
color: blue;
}
This CSS rule makes all paragraphs (`<p>`) on the page blue.

You might also like