Scribd
Upload
30 views15 pages

FEDT - Question Bank

Jijj

Uploaded by

ss99115576
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
30 views15 pages

FEDT - Question Bank

Jijj

Uploaded by

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

Question Bank

Unit 1 & 2

Short Questions

Q1 : What does <!DOCTYPE html> signify in an HTML document?


A: It defines the document type and version, indicating that the document is written in HTML5.

Q2 : How do you create a comment in HTML?


A: Use <!-- comment here --> to add comments in HTML that are not visible on the rendered webpage.

Q3 : Explain the purpose of the <head> section in an HTML document.


A: The <head> section contains meta-information about the document, such as the title, charset,
stylesheets, and scripts.

Q4 : What is the function of the <title> tag?


A: The <title> tag defines the title of the document, which appears on the browser tab.

Q5 : How do you define metadata in an HTML page?


A: Use the <meta> tag to specify metadata like charset, viewport settings, and page descriptions.

Q6 : What is the difference between <b> and <strong> tags?


A: Both make text bold, but <strong> conveys semantic emphasis, indicating strong importance.

Q7 : How is the <em> tag different from the <i> tag?


A: <em> indicates emphasis with semantic meaning, while <i> is used to display italicized text without
semantic emphasis.

Q8 : What does the <blockquote> tag represent?


A: The <blockquote> tag indicates a section that is quoted from another source, typically displayed with
indentation.

Q9 : How is the <pre> tag used in HTML?


A: The <pre> tag preserves the formatting of text, displaying whitespace and line breaks exactly as
written.

Q10 : Explain the role of <abbr> in HTML.


A: The <abbr> tag defines an abbreviation or acronym, with a title attribute that provides the full version
on hover.

Q11 : What is the difference between <ul> and <ol> tags?


A: <ul> creates an unordered list with bullet points, while <ol> creates an ordered list with numbered
items.
Q12 : How do you create a hyperlink that opens in a new tab?
A: Use the <a href="url" target="_blank">Link</a> structure, where target="_blank" specifies opening in
a new tab.

Q13 : What is the <nav> element used for?


A: The <nav> element is used to define navigation links, such as menus or table of contents for the
website.

Q14 : How can you link to a section within the same page?
A: Use a link like <a href="#section1">Go to Section 1</a> and a target element with id="section1".

Q15 : How do you create a drop-down menu in HTML?


A: Use the <select> tag with nested <option> tags to define the items in the menu.

Q16 : What attribute is used to span a table cell across multiple columns?
A: Use the colspan attribute in the <td> or <th> tag, e.g., <td colspan="2">.

Q17 : How do you create a form in HTML?


A: Use the <form> tag with nested input elements like <input>, <select>, and <textarea> for capturing
user data.

Q18 : What is the purpose of the action attribute in the <form> tag?
A: The action attribute specifies the URL where form data should be submitted.

Q19 : What are the advantages of using HTML5 input types?


A: HTML5 input types like email, url, and number offer built-in validation, enhancing user experience
and reducing JavaScript code.

Q20 : How do you embed a YouTube video using HTML?


A: Use the <iframe> tag with the src attribute pointing to the YouTube video URL.

Q21 : What are the three main types of CSS?


A: Inline CSS, Internal/Embedded CSS, and External CSS.

Q22 : What is the purpose of the float property in CSS?


A: The float property is used to align elements to the left or right, allowing text and other elements to
wrap around it.

Q23 : How do you center an element horizontally using CSS?


A: Use margin: 0 auto; along with a specified width on a block-level element.
Q24 : What is the box model in CSS?
A: The box model consists of margins, borders, padding, and the content area, defining the space and
size of an element.

Q25 : How do you apply an external CSS file to an HTML document?


A: Use the <link rel="stylesheet" href="style.css"> tag in the <head> section.

Q26 : What is the difference between static, dynamic, and active web pages?
A:

○ Static Pages display the same content for every user and are built using only HTML.
○ Dynamic Pages generate different content based on user interaction or data from the server,
typically using client-side scripts like JavaScript.
○ Active Pages go a step further by interacting with external systems, databases, and APIs using
technologies like ASP, PHP, or JSP.

Q27 : What are DHTML events, and why are they used?
A: DHTML events are actions triggered by the user or the browser, like clicks, key presses, or form
submissions. They allow developers to create interactive web pages that respond to user actions.

Q28 : Describe two common mouse events in DHTML.


A:

○ onclick: Triggered when the user clicks an element.


○ onmouseover: Triggered when the user moves the mouse pointer over an element.

Q29 : What is a form event in DHTML?


A: Form events are triggered by actions within a form element, such as onsubmit (when a form is
submitted) and onreset (when a form is reset).

Q30 : What is the main difference between client-side and server-side scripting?
A: Client-side scripting (e.g., JavaScript) runs in the user’s browser, manipulating HTML and CSS for
interactive pages. Server-side scripting (e.g., PHP, Node.js) runs on the server to process data and
generate HTML before sending it to the client.

Q31 : What is the basic structure of a JavaScript program?


A: A JavaScript program usually consists of variable declarations, functions, control structures (like if or
for loops), and event handling code.

Q32 : What are the basic data types in JavaScript?


A: JavaScript has five primary data types: Number, String, Boolean, Undefined, and Null. Additionally,
complex types include Object and Array.
Q33 : Describe the purpose of the conditional (ternary) operator in JavaScript.
A: The conditional operator ?: is used for inline if-else evaluations. It has the syntax: condition ?
expression1 : expression2, returning expression1 if the condition is true and expression2 otherwise.

Q34 : How is a for loop structured in JavaScript?


A: A for loop is structured as for (initialization; condition; increment/decrement) { // code block }, where
each part controls the loop’s start, execution, and iteration.

Q35 : What is the difference between while and do...while loops in JavaScript?
A: In a while loop, the condition is evaluated before the loop body is executed, while in a do...while
loop, the body is executed at least once before checking the condition.

Long Questions

1. Describe the steps to create and save a simple HTML document. How can it be accessed using a
web browser?

2. Explain the basic structure of an HTML page. What are the essential components that every HTML
document should include?

3. What are text formatting tags in HTML? Provide examples of how tags like <strong>, <em>, and
<mark> can change text appearance.

4. Highlight the importance of block formatting tags such as <header>, <footer>, <nav>, and <section>.
How do these tags contribute to the layout of a webpage?

5. Illustrate the different types of lists in HTML. What are the differences between ordered lists (<ol>)
and unordered lists (<ul>)?

6. Explain how to create links in HTML using the <a> tag. How can bookmarks be utilized to navigate
within a page?

7. Describe the structure of an HTML table. What tags are used to create rows, columns, and headers?

8. Discuss the various HTML5 input types for forms, such as button, email, and date. How do these
improve user experience?

9. What is the <iframe> tag in HTML, and how is it used to embed other web pages within a document?

10. Explain image maps in HTML. How can you create clickable areas on an image using the <map>
and <area> tags?
11. What are the advantages of using HTML5 audio and video tags? Provide examples of how these
can be implemented in a webpage.

12. What is CSS, and why is it essential for modern web design? Discuss its main benefits in styling
web pages.

13. Identify key CSS properties related to text and layout, such as font, margin, border, and
background. How do these properties affect the design of a webpage?

14. Discuss the different methods of applying CSS to an HTML document: external, internal, and inline.
What are the advantages and disadvantages of each method?

15. How can CSS properties such as color and background enhance the visual appeal of a webpage?
Provide specific examples of effective design choices.

16. Compare and contrast static, dynamic, and active web pages. In what scenarios would each type
be most appropriate?

17. What is the significance of JavaScript in web development? How does it differ from other
programming languages?

18. Differentiate between client-side and server-side scripting in JavaScript. What are the advantages
and disadvantages of each?

19. Explain the various types of operators in JavaScript, including arithmetic, assignment, comparison,
logical, and conditional. How do they influence program flow?

20. What are control structures in JavaScript? Discuss the use of if…else, while, do…while, and for
loops with examples.

HTML Practical Questions

Q1: Create a simple HTML page with a title “My Web Page” and a heading
“Welcome to My Website”.

● A:

<html>
<head>
<title>My Web Page</title>
</head>
<body>
<h1>Welcome to My Website</h1>
</body>
</html>

Q2 : Create an unordered list with three items: “Home,” “About,” and “Contact”.

A:
<ul>

<li>Home</li>
<li>About</li>
<li>Contact</li>
</ul>

Q3: Create a table with two rows and two columns. Fill it with dummy text.

A:
<table border="1">

<tr>
<td>Row 1, Cell 1</td>
<td>Row 1, Cell 2</td>
</tr>
<tr>
<td>Row 2, Cell 1</td>
<td>Row 2, Cell 2</td>
</tr>
</table>

Q4 : Create a form with text input, radio buttons for gender, and a submit button.

A:
<form>
<label>Name: </label>
<input type="text" name="name" /><br />
<label>Gender: </label>
<input type="radio" name="gender" value="Male" /> Male
<input type="radio" name="gender" value="Female" /> Female<br />
<input type="submit" value="Submit" />
</form>
Q5 : Create a hyperlink that opens “https://example.com” in a new tab.

A:<a href="https://example.com" target="_blank">Visit Example</a>

Q6 : Create a definition list for “HTML” and “CSS” with their full forms.

A:
<dl>

<dt>HTML</dt>
<dd>HyperText Markup Language</dd>
<dt>CSS</dt>
<dd>Cascading Style Sheets</dd>
</dl>

Q7 : Create a blockquote with the text “This is a quoted text.”

A: <blockquote>This is a quoted text.</blockquote>

Q8 : Create an ordered list with nested unordered list inside one of the items.

A:

<ol>

<li>Main Item 1</li>


<li>Main Item 2
<ul>
<li>Sub-item 1</li>
<li>Sub-item 2</li>
</ul>
</li>
<li>Main Item 3</li>
</ol>

Q9 : Embed a video from a file “video.mp4” that starts playing automatically.

A: <video src="video.mp4" autoplay controls></video>

Q10 : Create an email input field with a placeholder “Enter your email.”

A: <input type="email" placeholder="Enter your email" />


Q11 : Create a hyperlink that scrolls to a section labeled “Contact” in the same
page.

A: <a href="#contact">Go to Contact</a>

<section id="contact">
<h2>Contact Us</h2>
</section>

Q12 : Create a form with a number input field that accepts values between 1 and
100.

A: <form>

<label>Enter a number (1-100):</label>


<input type="number" min="1" max="100" />
</form>

Q13 : Create a paragraph with inline styling to make the text red.

A: <p style="color: red;">This is a red paragraph.</p>

Q14 : Create an image with a width of 300px and a height of 200px.

A: <img src="image.jpg" alt="Sample Image" width="300"


height="200" />

Q15 : Create a text input that only accepts dates using HTML5.

A: <input type="date" />

Q16 : Embed an audio file with controls and a fallback message for unsupported
browsers.

A: <audio controls>

<source src="audio.mp3" type="audio/mpeg" />


Your browser does not support the audio element.
</audio>

Q17 : Create a submit button that is disabled by default.

A: <input type="submit" value="Submit" disabled />


Q18 : Create an HTML5 <progress> bar that is 70% complete.

A: <progress value="70" max="100"></progress>

Q19 : Create a button that displays an alert “Hello World” on click.

A: <button onclick="alert('Hello World')">Click Me</button>

Q20 : Create a table with three rows and three columns using HTML.

A:
<table border="1">

<tr>
<td>Row 1, Col 1</td>
<td>Row 1, Col 2</td>
<td>Row 1, Col 3</td>
</tr>
<tr>
<td>Row 2, Col 1</td>
<td>Row 2, Col 2</td>
<td>Row 2, Col 3</td>
</tr>
<tr>
<td>Row 3, Col 1</td>
<td>Row 3, Col 2</td>
<td>Row 3, Col 3</td>
</tr>
</table>

CSS Practical Questions

Q1 : Change the background color of the entire webpage to light blue.

A: body {

background-color: lightblue;
}

Q2 : Change the font size of all paragraphs to 18px.

A: p { font-size: 18px; }
Q3 : Set the color of all headings (h1 to h6) to dark green.

A: h1, h2, h3, h4, h5, h6 {

color: darkgreen;
}

Q4 : Center a div with a class of “center-div” using margin properties.

A: .center-div {

margin: 0 auto;
width: 50%;
}

Q5 : Change the text color of a class “highlight” to yellow.

A: .highlight {

color: yellow;
}

Q6 : Create a CSS class that makes text italic and bold.

A: .fancy-text {

font-style: italic;
font-weight: bold;
}

Q7 : Create a CSS rule to add a solid border of 2px to an element with id “box”.

A: #box {

border: 2px solid black;


}

Q8 : Change the bullet style of an unordered list to circles.

A: ul {

list-style-type: circle;
}

Q9 : Create a class that applies a linear gradient background from blue to white.
A: .gradient-background {

background:linear-gradient(blue, white);
}

Q10 : Apply padding of 20px and a background color of lightgray to a class


“container”.

A: .container {

padding: 20px;
background-color: lightgray;

Javascript Practical Questions

Q1: Create a static HTML page with a heading "About Us" and a paragraph
describing a company.

A:
<html>
<head>
<title>About Us</title>
</head>
<body>
<h1>About Us</h1>
<p>We are a leading company in technology solutions, providing
innovative products and services globally.</p>
</body>
</html>

Q2: Create a dynamic HTML page that displays the current date and time using
JavaScript.

A:
<html>
<head>
<title>Dynamic Page</title>
<script>
function showDateTime() {
document.getElementById('datetime').innerHTML = new Date();
}
</script>
</head>
<body onload="showDateTime()">
<h1>Welcome to Our Website</h1>
<p>Current Date and Time: <span id="datetime"></span></p>
</body>
</html>

Q3: Create a basic HTML form and add a JavaScript validation function that
checks if the user has entered their name before submitting.

A:
<html>
<head>
<title>Form Validation</title>
<script>
function validateForm() {
var name = document.forms["myForm"]["username"].value;
if (name === "") {
alert("Name must be filled out");
return false;
}
}
</script>
</head>
<body>
<h1>Registration Form</h1>
<form name="myForm" onsubmit="return validateForm()">
Name: <input type="text" name="username"><br>
<input type="submit" value="Submit">
</form>
</body>
</html>

Q4: Create an HTML button and attach a JavaScript mouse click event that
displays an alert with the message “Button clicked!”.

A: <button onclick="alert('Button clicked!')">Click Me</button>

Q5: Create a text box and use the onkeypress event to display a message in a
paragraph element when the user types a key.
A:
<html>
<head>
<title>Key Press Event</title>
<script>
function showKeyPress() {
document.getElementById('message').innerHTML = "You pressed a
key!";
}
</script>
</head>
<body>
<input type="text" onkeypress="showKeyPress()">
<p id="message"></p>
</body>
</html>

Q6: Create a form with two input fields and a submit button. Attach a onsubmit
event to the form that prevents submission if any field is empty.

A:
<html>
<head>
<title>Form Event</title>
<script>
function checkFields() {
var field1 = document.getElementById('field1').value;
var field2 = document.getElementById('field2').value;
if (field1 === "" || field2 === "") {
alert("All fields must be filled");
return false;
}
}
</script>
</head>
<body>
<form onsubmit="return checkFields()">
Field 1: <input type="text" id="field1"><br>
Field 2: <input type="text" id="field2"><br>
<input type="submit" value="Submit">
</form>
</body>
</html>

Q7: Write a JavaScript program that declares a variable x and assigns the value
10 to it. Use an if statement to check if x is greater than 5 and display an alert if
true.

A:
<html>
<head>
<title>JavaScript Condition</title>
<script>
var x = 10;
if (x > 5) {
alert("x is greater than 5");
}
</script>
</head>
<body>
</body>
</html>

Q8: Write a JavaScript program that uses a for loop to print numbers from 1 to 5
in the console.

A: for (var i = 1; i <= 5; i++) {


console.log(i); }

Q9: Create a JavaScript function called calculateSum that accepts two


parameters and returns their sum. Call the function and display the result in an
alert.

A:
<html>
<head>
<title>Function Example</title>
<script>
function calculateSum(a, b) {
return a + b;
}
alert(calculateSum(5, 3));
</script>
</head>
<body>
</body>
</html>

Q10: Write a JavaScript program that uses a while loop to repeatedly add
numbers from 1 to 5 and display the final sum using alert.

A:
<html>
<head>
<title>While Loop Example</title>
<script>
var sum = 0;
var num = 1;
while (num <= 5) {
sum += num;
num++;
}
alert("Sum: " + sum);
</script>
</head>
<body>
</body>

</html>

You might also like