Webdesigning Interview Questions
Uploaded by
Dharmraj Dilip BhiseWebdesigning Interview Questions
Uploaded by
Dharmraj Dilip BhiseHTML Interview Questions
1. HTML is the standard ____language for creating Web pages.
A. scripting
B. programming
C. styling
D. markup
Answer: D) markup
Explanation:
HTML is the standard markup language for creating Web pages.
2. HTML stands for_______.
A. Hyperactive Text Markup Language
B. Hyper Text Markup Language
C. Hyper Text Machine Language
D. None of these
Answer: B) Hyper Text Markup Language
Explanation:
HTML stands for "Hyper Text Markup Language".
3. Which is the correct syntax to include comment in an HTML document?
A. //
B. /* Comment */
C. // Comment //
D. <!-- Comment -->
Answer: D) <!-- Comment -->
Explanation:
You can add comments to your HTML source by using the following syntax,
<!-- Write your comments here -->
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
4. Can we hide content using the comment?
A. Yes
B. No
Answer: A) Yes
Explanation:
Yes, the comments can be used to hide content. Here is the syntax,
<!-- <p>Hello, world! </p> -->
5. Can we hide inline content using the comment?
A. Yes
B. No
Answer: A) YesExplanation:
Yes, the comments can be used to hide inline content. Here is the syntax,
<p>Hello, world! <!—This is some text --> How are you?</p>
6. Which element/tag defines a paragraph?
A. <p>
B. <pre>
C. <panel>
D. None of the above
Answer: A) <p>
Explanation:
The <p> tag/element defines a paragraph.
7. Which tag/element defines the HTML document's body?
A. <HTML>
B. <HTMLbody>
C. <bdy>
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
D. <body>
Answer: D) <body>
Explanation:
The <body> element defines the HTML document's body.
8. Which tag contains the meta information about the HTML page?
A. <html>
B. <title>
C. <head>
D. <body>
Answer: C) <head>
Explanation:
The <head> tag contains the meta information about the HTML page.
9. Which tag is the root element of an HTML page?
A. <html>
B. <title>
C. <head>
D. <body>
Answer: A) <html>
Explanation:
The <html> tag is the root element of an HTML page.
10. Who invented HTML?
A. Dave Raggett
B. Tim Berners-Lee
C. Denis Ritchie
D. All of the above
Answer: B) Tim Berners-Lee
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
Explanation:
Tim Berners-Lee invented HTML in 1991.
11. HTML tags with no content are called _____.
A. Special tags
B. Advanced tags
C. Empty tags
D. Other tags
Answer: C) Empty tags
Explanation:
HTML tags with no content are called empty tags. For example,
the <br> tag, <hr> tag.
12. Nested HTML Elements are allowed in HTML?
A. Yes
B. No
Answer: A) Yes
Explanation:
Yes, Nested HTML Elements (<p><b><u>Some text</u></b></p>)are allowed in
HTML.
13. Is HTML a case sensitive?
A. Yes
B. No
Answer: B) No
Explanation:
No, HTML is Not Case Sensitive.
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
14. HTML headings are defined with the _____ tags.
A. <head1> to <head6>
B. <p1> to <p6>
C. <h1> to <h6>
D. <h1> to <h3>
Answer: C) <h1> to <h6>
Explanation:
HTML headings are defined with the <h1> to <h6> tags.
15. Which tag is used to display a horizonal rule (horizonal line)?
A. <br>
B. <hr>
C. <hr>...</hr>
D. <line>
Answer: B) <hr>
Explanation:
The <hr> tag is used to display a horizontal rule.
16. What is the correct syntax of <hr> tag?
A. <hr>
B. <hr />
C. <hr></hr>
D. All of the above
Answer: A), and B):
<hr> and <hr />
Explanation:
Both <hr> and <hr /> can be used to display a horizonal line.
17. Which tag is used to define a line break?
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
A. <\n>
B. <lr>
C. <br>
D. <br>...</br>
Answer: C) <br>
Explanation:
The <br> tag is used to define a line break.
18. What is the correct syntax of <br> tag?
A. <br>
B. <br />
C. <br></br>
D. All of the above
Answer: A), and B): <br> and <br />
Explanation:
Both <br> and <br /> can be used to display a line break.
19. Which tag is used to define preformatted text?
A. <pf>
B. <p>
C. <pre>
D. <code>
Answer: C) <pre>
Explanation:
The <pre> tag is used to define preformatted text. It is displays the text as it is –
keeps spaces & line breaks intact (Original state). Output text looks same as
inputted text.
20. Which HTML attribute is used to define styles of an element?
A. <style>
B. <css>
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
C. style
D. css
Answer: C) style
Explanation:
The style attribute is used to define the styles of an element.
21. Which is the correct HTML statement to define the red color of the
paragraph text?
A. <p style="color: #ff0000;">
B. <p style="color: red;">
C. Both A. and B.
D. None of the above
Answer: C) Both A. and B.
Explanation:
The correct HTML statement to define red paragraph color is,
<p style="color: #ff0000;">
<!--OR-->
<p style="color: red;">
22. Which HTML tag is used to define bold text, without any extra importance?
A. <strong>
B. <bold>
C. <bolder>
D. <b>
Answer: D) <b>
Explanation:
The HTML <b> tag is used to define bold text, without any extra importance.
23. Which HTML tag is used to define text with strong importance?
A. <strong>
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
B. <bold>
C. <bolder>
D. <b>
Answer: A) <strong>
Explanation:
The HTML tag <strong> is used to define text with strong importance.
24. Which HTML tag is used to define italic text?
A. <italic>
B. <em>
C. <i>
D. <it>
Answer: C) <i>
Explanation:
The HTML tag <i> is used to define italic text.
25. Which HTML tag is used to define emphasized text?
A. <italic>
B. <em>
C. <i>
D. <it>
Answer: B) <em>
Explanation:
The HTML tag <em> is used to define emphasized text.
26. Which HTML tag is used to define smaller text?
A. <normal>
B. <span>
C. <smaller>
D. <small>
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
Answer: D) <small>
Explanation:
The HTML tag <small> is used to define smaller text.
27. Which HTML tag is used to define marked or highlighted text?
A. <mark>
B. <highlight>
C. <m>
D. <highlighted>
Answer: A) <mark>
Explanation:
The HTML tag <mark> is used to define marked or highlighted text.
28. Which HTML tag is used to define strike a line through deleted text?
A. <delete>
B. <del>
C. <deleted>
D. <through>
Answer: B) <del>
Explanation:
The HTML tag <del> is used to define strike a line through deleted text.
29. Which HTML tag is used to define underline inserted text?
A. <underline>
B. <text-decoration>
C. <u>
D. <ins>
Answer: D) <ins>
Explanation:
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
The HTML tag <ins> is used to define underline inserted text.
30. Which HTML tag is used to define subscript text?
A. <sub>
B. <subscript>
C. <s>
D. <subscripted>
Answer: A) <sub>
Explanation:
The HTML <sub> tag is used to define subscript text.
31. Which HTML tag is used to define superscript text?
A. <sup>
B. <superscript >
C. <s>
D. <superscripted>
Answer: A) <sup>
Explanation:
The HTML <sup> tag is used to define superscript text.
32. Which is the correct HTML statement to display H20 in a paragraph?
A. <p>H<sup>2</sup>O</p>
B. <p>H<ins>2</ins>O</p>
C. <p>H<below>2</below>O</p>
D. <p>H<sub>2</sub>O</p>
Answer: D) <p>H<sub>2</sub>O</p>
Explanation:
The correct HTML statement to display H20 in a paragraph
is: <p>H<sub>2</sub>O</p>
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
33. Which is the correct HTML statement to display HelloWorld in a paragraph?
A. <p>Hello<sup>World</sup></p>
B. <p>Hello<top>World</top></p>
C. <p>Hello<sub>World</sub></p>
D. <p>Hello<above>World</above></p>
Answer: A) <p>Hello<sup>World</sup></p>
Explanation:
The correct HTML statement to display HelloWorld in a paragraph
is: <p>Hello<sup>World</sup></p>
34. Which is the correct HTML statement to display HelloHi! in a paragraph?
A. <p><del>Hello</del><ins>Hi!</ins></p>
B. <p><strike>Hello</strike><ins>Hi!</ins></p>
C. <p><cut>Hello</cut><ins>Hi!</ins></p>
D. All of the above
Answer: A), and B): <p><del>Hello</del><ins>Hi!</ins></p>
<p><strike>Hello</strike><ins>Hi!</ins></p>
Explanation:
The correct HTML statement to display HelloHi! in a paragraph
is/are: <p><del>Hello</del><ins>Hi!</ins></p> <p><strike>Hello</strike><ins>Hi!</i
ns></p>
35. Which is the correct HTML statement to display Hello World in a paragraph?
A. <p>Hello <pre>Hello World </pre></p>
B. <p>Hello<mark> Hello World </mark></p>
C. <p>Hello <span> Hello World </span></p>
D. <p>Hello<span> Hello World </span></p>
Answer: B) <p>Hello<mark> Hello World </mark></p>
Explanation:
The correct HTML statement to display Hello Hello World in a paragraph
is: <p>Hello <mark> Hello World </mark></p>
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
36. Which HTML tag is used to define a short quotation?
A. <quotation>
B. <quote>
C. <qut>
D. <q>
Answer: D) <q>
Explanation:
The HTML tag <q> is used to define a short quotation.
37. Which HTML tag is used to define an abbreviation or an acronym?
A. <abbreviation>
B. <abbr>
C. <acronym>
D. <acr>
Answer: B) <abbr>
Explanation:
The HTML <abbr> tag defines an abbreviation or an acronym, like "HTML", "CSS",
"Mr.", "Dr."
38. What is the correct HTML syntax of <abbr> tag?
A. <abbr title="Hyper Text Markup Language">HTML</abbr>
B. <abbr description=" Hyper Text Markup Language "> HTML</abbr>
C. <abbr abbreviation=" Hyper Text Markup Language "> HTML</abbr>
D. <abbr acronym=" Hyper Text Markup Language "> HTML</abbr>
Answer: A) <abbr title="Hyper Text Markup Language">HTML</abbr>
Explanation:
The correct HTML syntax of <abbr> tag is,
<abbr title="abbreviation or acronym">Text</abbr>
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
39. What HTML tag is used to define the contact information for the
author/owner of a document or an article?
A. <contact>
B. <authorinfo>
C. <address>
D. <addr>
Answer: C) <address>
Explanation:
The HTML tag <address> is used to define the contact information for the
author/owner of a document or an article. The text in the <address> element usually
renders in italic, and browsers will always add a line break before and after
the <address> element.
40. Which tag is used to override the current text direction?
A. <bdi>
B. <bdo>
C. <bdr>
D. None of the above
Answer: B) <bdo>
Explanation:
The HTML tag <bdo> is used to override the current text direction from right to left.
BDO stands for Bi-Directional Override.
Eg. <bdo dir="rtl">This line will be written from right to left</bdo>
Output:
41. Which HTML tag is used to define a hyperlink?
A. <a>
B. <h>
C. <hyperlink>
D. Both A. and B.
Answer: A) <a>
Explanation:
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
The HTML <a> tag defines a hyperlink.
42. Which is the correct syntax of <a> tag?
A. <a src="url">link text</a>
B. <a link="url">link text</a>
C. <a href="url">link text</a>
D. <a srclink="url">link text</a>
Answer: C) <a href="url">link text</a>
Explanation:
The correct syntax to create a hyperlink is,
<abbr title="abbreviation or acronym">Text</abbr>
43. Why "href" attribute is used with <a> tag?
A. To define title text
B. To define reference of a document
C. To define destination URL
D. All of the above
Answer: C) To define destination URL
Explanation:
The href attribute of the <a> tag is most important, which indicates the link's
destination.
44. Which ____ attribute specifies where to open the linked document?
A. href
B. link
C. src
D. target
Answer: D) target
Explanation:
The “target” attribute specifies where to open the linked document.
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
45. Which tag is used to embed an image in an HTML document?
A. <img>
B. <pic>
C. <image>
D. <picture>
Answer: C) <img>
Explanation:
The HTML tag <img> is used to embed an image in an HTML document.
46. What is the correct syntax of <img> tag?
A. <img src="url">
B. <img src="url" alt="alternatetext">
C. <img src="url" alt="alternatetext" />
D. All of the above
Answer: D) All of the above
Explanation:
The correct syntax of <img> tag is/are:
<img src="url" alt="alternatetext" />
We can also use,
<img src="url">
<!--Or-->
<img src="url" alt="alternatetext">
47. Which attribute specifies the path to the image?
A. href
B. link
C. src
D. All of the above
Answer: C) src
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
Explanation:
The src attribute specifies the path to the image.
48. Which attribute specifies an alternate text for the image?
A. alt
B. alternate
C. alttext
D. All of the above
Answer: B) alternate
Explanation:
The alternate attribute specifies an alternate text for the image.
49. Which HTML tag is used to define a table?
A. <table>
B. <tables>
C. <tr>
D. <th>
Answer: A) <table>
Explanation:
The HTML tag <table> is used to define a table.
50. Each table cell is defined by a ____ tag.
A. <cell> ... </cell>
B. <tr> ... </tr>
C. <th> ... </th>
D. <td> ... </td>
Answer: D) <td> ... </td>
Explanation:
Each table cell is defined by a <td>and a </td> tag.
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
51. Each table row is defined by a ____ tag.
A. <cell> ... </cell>
B. <tr> ... </tr>
C. <th> ... </th>
D. <td> ... </td>
Answer: B) <tr> ... </tr>
Explanation:
Each table row is defined by a <tr> and a </tr> tag.
52. Each table header is defined by a ____ tag.
A. <cell> ... </cell>
B. <tr> ... </tr>
C. <th> ... </th>
D. <td> ... </td>
Answer: C) <th> ... </th>
Explanation:
Each table header is defined by a <th> and a </th> tag.
53. Which tag is used to define ordered listing?
A. <ol> ... </ol>
B. <ul> ... </ul>
C. <list> ... </list>
D. <li> ... </li>
Answer: A) <ol> ... </ol>
Explanation:
The HTML tag <ol> ... </ol> is used to define ordered listing.
54. Which tag is used to define unordered listing?
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
A. <ol> ... </ol>
B. <ul> ... </ul>
C. <list> ... </list>
D. <li> ... </li>
Answer: B) <ul> ... </ul>
Explanation:
The HTML tag <ul> ... </ul> is used to define unordered listing.
55. Which tag is used to define list items?
A. <ol> ... </ol>
B. <ul> ... </ul>
C. <list> ... </list>
D. <li> ... </li>
Answer: D) <li> ... </li>
Explanation:
The HTML tag <li> ... </li> is used to define list items.
56. Which tag is used to define description lists?
A. <dl> ... </dl>
B. <dd> ... </dd>
C. <dlist> ... </dlist>
D. <check> ... </check>
Answer: A) <dl> ... </dl>
Explanation:
The HTML tag <dl> ... </dl> is used to define description lists.
57. Which tag is a block-level element?
A. <block> ... </block>
B. <b> ... </b>
C. <div> ... </div>
D. <divx> ... </divx>
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
Answer: C) <div> ... </div>
Explanation:
The HTML tag <div> ... </div> is a block-level element.
58. Which attribute is often used to point to a class name in a style sheet?
A. style
B. css
C. src
D. class
Answer: D) class
Explanation:
The class attribute is often used to point to a class name in a style sheet.
59. Which attribute is used to specify a unique id for an HTML element?
A. style
B. css
C. id
D. class
Answer: C) id
Explanation:
The HTML id attribute is used to specify a unique id for an HTML element.
60. Can we use class name with multiple HTML elements?
A. Yes
B. No
Answer: A) Yes
Explanation:
Yes, we can use class name with multiple HTML elements.
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
61. Can we use id attribute with multiple HTML elements?
A. Yes
B. No
Answer: B) No
Explanation:
No, we cannot use id attribute with multiple HTML elements.
62. Which tag specifies an inline frame?
A. <frame>
B. <iframe>
C. <inlineframe>
D. <frames>
Answer: B) <iframe>
Explanation:
The HTML tag <iframe> specifies an inline frame. It is used to embed documents,
YouTube videos, google map, and interactive media with in a page.
<iframe src=” [Link]
63. What is the correct syntax for <iframe> tag?
A. <iframe href="url" title="description"></iframe>
B. <iframe link="url" title="description"></iframe>
C. <iframe src="url" title="description"></iframe>
D. All of the above
Answer: C) <iframe src="url" title="description"></iframe>
Explanation:
The correct syntax for <iframe> tag is,
<iframe src="url" title="description"></iframe>
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
64. Which tag is used to create an HTML form for user input?
A. <form>
B. <input>
C. <form_put>
D. <form_get>
Answer: A) <form>
Explanation:
The HTML tag <form> is used to create an HTML form for user input.
65. Which tag is used to display a single-line text input field?
A. <input type="textbox">
B. <input type="checkbox">
C. <input type="text">
D. <input type="submit">
Answer: C) <input type="text">
Explanation:
The HTML tag <input type="text"> is used to display a single-line input field.
66. Which tag is used to display a radio button?
A. <input type="textbox">
B. <input type="checkbox">
C. <input type="text">
D. <input type="radio">
Answer: D) <input type="radio">
Explanation:
The HTML tag <input type="radio"> is used to display a radio button.
67. Which tag is used to display a checkbox?
A. <input type="textbox">
B. <input type="checkbox">
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
C. <input type="text">
D. <input type="radio">
Answer: B) <input type="checkbox">
Explanation:
The HTML tag <input type="checkbox"> is used to display a checkbox.
68. Which tag is used to display a submit button?
A. <input type="submit">
B. <input type="checkbox">
C. <input type="text">
D. <input type="radio">
Answer: A) <input type="submit">
Explanation:
The HTML tag <input type="submit"> is used to display a submit button.
69. Which tag is used to display a clickable button?
A. <input type="submit">
B. <input type="checkbox">
C. <input type="text">
D. <input type="button">
Answer: D) <input type="button">
Explanation:
The HTML tag <input type="button"> is used to display a clickable button.
70. Which input type reset defines a reset button that will reset all form values
to their default values?
A. clear
B. clear:both
C. reset
D. refresh
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
Answer: C) reset
Explanation:
The reset input type reset defines a reset button that will reset all form values to their
default values. Here is the syntax,
<input type="reset">
71. What are the different new form element types in HTML 5?
Answer: There are ten important new form elements introduced in HTML 5:
1. Color
2. Date
3. Datetime-local
4. Email
5. Time
6. URL
7. Range
8. Telephone
9. Number
[Link]
Let’s understand these elements step-by-step.
If you want to show a color picker dialog box (See Figure 9.4).
<input type=”color” name=favcolor”>
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
<input type="date" name="bday">
If you want to show a calendar with local time (See Figure 9.6).
<input type=”DateTime-local” name=”daytime”>
If you want to create an HTML text with e-mail validation we can set the type as
“email”.
<input type=’’email” name=”email”>
For URL validation set the type as “url” as shown in the Figure 9.8 in which HTML
code is given.
<input type=”url” name=”sitename’>
For URL validation set the type as “url” as shown in the below HTML code.
If you want to display textbox with number range you can set type to number (See
Figure 9.9).
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
<input type=”number” name=”quantity” min=”1" max=”5">
If you want to display a range control you can use type as range as shown in code
given below (see Figure 9.10)
<input type="range" min="0" max="10" step="2" value="6">
Want to make textbox as search engine box.
<input type="search" name="googlengine">
Want to only take time input.
<input type-time” name=”usr_time”>
If you want to make textbox to accept telephone numbers.
<input type=”tel” name=”mytel”>
72. Importance of Doctype<!DOCTYPE> in HTML?
Answer: It is written at the top of html document. It’s Not HTML tag. <!DOCTYPE>
tells the browser about the HTML version. It is an "information" to the browser about
what document type to expect.
In HTML 5, the declaration is simple: <!DOCTYPE html>
The <!DOCTYPE> declaration is NOT case sensitive.
73. Do all HTML tags need a closure?
Answer: [Link] all tags. E.g. <img>,<br>,<hr>
74. Which browsers support HTML 5?
Answer: Almost all browsers, i.e., Safari, Chrome, Firefox, Opera, Internet Explorer,
support HTML 5.
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
75. What do you know about metadata?
Answer: metadata is information about the data. It is write in <head> section using
<meta> tag. This information not displayed anywhere to users. It consists of
elements related to page description, keywords. Meta information used by search
engines.
76. What you know about <span> tag?
Answer: Span tag is used for grouping and applying styles to inline elements by
using the class or id attributes.
77. What is difference between <span> tag and <div> tag?
Answer: <span> tag is similar to <div> tag. Span is inline tag is and div is a block-
level tag. Span tag is used to designed inline content like (adding colors, background
color, and highlighting text) by using the class or id attributes. Nested span tags will
not be used for HTML documents.
HTML <div> tag: The div tag is known as Division tag. The div tag is used in
HTML to make divisions of content on the web page like (text, images, header,
footer, navigation bar, etc). Nested <div> tag is used for HTML documents with
different styles.
78. Inline vs Block level elements
Answer: Inline elements take as much width as required E.g. <a>, <img>,
<span>,<b>,<strong>,<input> Block level elements consume the full width available
& starts from new line E.g. <h1>, <p>, <div>,<form>,<nav>
79. What is Viewport and how to set it up?
Answer:
Viewport is visible area of web page on a browser. Its changes based on the
device size (Smaller on mobile phone and larger on computer screen)
Before tablets and mobile phones, web pages were designed only for
computer screens, and it was common for web pages to have a static design
and a fixed size.
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
Then, when we started surfing the internet using tablets and mobile phones,
fixed size web pages were too large to fit the viewport. To fix this, browsers on
those devices scaled down the entire web page to fit the screen.
HTML5 introduced a method to let web designers take control over the
viewport, through the <meta> tag.
This gives the browser instructions on how to control the page's dimensions
and scaling.
The width=device-width part sets the width of the page to follow the screen-
width of the device (which will vary depending on the device).
The initial-scale=1.0 part sets the initial zoom level when the page is first
loaded by the browser.
Syntax:
<meta name="viewport" content="width=device-width, initial-scale=1.0">
80. What is difference between Visibility: hidden vs Display: none?
Answer: Visibility hidden simply hides the element but the space is allocated for it
on the page which not visible on the page. In case of Display: none it also hides the
element and no space allocated for it on the page. Page appears as if no element is
present.
81. What is difference between Cell Spacing vs Cell Padding?
Answer: Cell Spacing is amount of space or gap between the two cells of same
table while Cell Padding is space or gap between the content inside the cell and its
borders.
82. How to convert inline element into block level element?
Answer: We can change inline element into block level element by changing the
display property as display: block.
e.g. a {
display : block;
}
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
83. How to create a nested webpage in HTML?
Answer: The HTML iframe tag is used to display a nested webpage. In other words,
it represents a webpage within a webpage. In iframe tag we can give source or url of
another webpage by giving height and width.
84. Does a hyperlink only apply to text?
Answer: No. Hyperlinks can be used both on texts and images. The HTML anchor
tag defines a hyperlink that links one page to another page.
CSS (Cascading Style Sheets)
1. What is CSS stands for?
A. Cascading Style Sheets
B. Cascade Style Sheet
C. Color Style Sheets
D. Color Style Sheet
Answer: A) Cascading Style Sheets
Explanation:
The full form of the CSS is Cascading Style Sheets. Cascading Style Sheets is a
style sheet language used for describing the presentation of a document written in a
markup language such as HTML. CSS is a cornerstone technology of the World
Wide Web, alongside HTML and JavaScript.
2. What CSS describes?
A. CSS describes how calculation perform on button click.
B. CSS describes how HTML elements are to be displayed on screen, paper, or
in other media
C. Both A. and B.
D. None of the above
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
Answer: B) CSS describes how HTML elements are to be displayed on screen,
paper, or in other media
Explanation:
CSS describes how HTML elements are to be displayed on screen, paper, or in
other media.
3. What is the correct syntax for referring an external CSS?
A. <link rel="stylesheet" type="text/css" href="[Link]">
B. <stylesheet rel="stylesheet" type="text/css" href="[Link]">
C. <style rel="stylesheet" type="text/css" href="[Link]">
D. All of the above
Answer: A) <link rel="stylesheet" type="text/css" href="[Link]">
Explanation:
The correct syntax to include (refer) an external CSS in an HTML document is,
<link rel="stylesheet" type="text/css" href="[Link]">
A. Here,
B. rel defined the relationship.
C. href is the CSS filename.
D. type is the type of the file, for CSS – the type is "text/css"
4. What is a CSS selector?
A. A CSS selector is the CSS class name
B. A CSS selector is the set of properties that are going to be applied on HTML
elements
C. A CSS selector is name of CSS file.
D. A CSS selector is the first part of a CSS Rule. It may an HTML element or
pattern of elements.
Answer: D) A CSS selector is the first part of a CSS Rule. It may an HTML
element or pattern of elements
Explanation:
A CSS selector is the first part of a CSS Rule. It may an HTML element or pattern of
elements and other terms that tell the browser which HTML elements should be
selected to have the CSS property values inside the rule applied to them.
OR
What are selectors in CSS?
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
Answer: Selectors help to select an element to which you want to apply a style.
Eg. Element Selector, ID Selector, Class Selector, Universal Selector, Group
Selector etc.
5. In a CSS file, there is a CSS rule for paragraphs tags – what does p can be
called?
A. Selector
B. Attribute
C. Property
D. Tag
Answer: A) Selector
Explanation:
In a CSS rule, the HTML element(s) for them we are writing the CSS is known as
"CSS Selector".
6. Internal styles are written within the _____ element.
A. <style>…</style>
B. <css>…</css>
C. <stylesheet>…</stylesheet>
D. Both A. and B.
Answer: A) <style>…</style>
Explanation:
Internal styles are defined within the <style> element, inside the <head> section of
an HTML page.
7. Inline styles are written within the _____ attribute.
A. style
B. css
C. stylesheet
D. Both A. and B.
Answer: A) style
Explanation:
Inline styles are defined within the style attribute of the relevant element.
Example:
<h1 style="color:blue;text-align:center;">This is a heading</h1>
<p style="color:red;">This is a paragraph.</p>
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
8. CSS comments are placed within the ______.
A. //
B. /* and */
C. <* and *>
D. <! And !>
Answer: B) /* and */ OR <!--jhghghg -->
Explanation:
A CSS comment is placed inside the <style> element, and starts with /* and ends
with */.
9. Can comments also span multiple lines?
A. Yes
B. No
Answer: A) Yes
Explanation:
Yes, comments can also span multiple lines.
Example:
/* This is
a multi-line
comment */
OR
/*
This is
a multi-line
comment
*/
10. Which property is used to define the text color?
A. text-color
B. color
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
C. font-color
D. Both A. and B.
Answer: B) color
Explanation:
The color property is used to define the text color in CSS.
11. Which property is used to define the background color?
A. bgcolor
B. bg-color
C. background
D. background-color
Answer: D) background-color
Explanation:
The background-color property is used to define the background color in CSS.
12. From the given options which is/are the valid way to represent a color?
A. A valid color name like "blue"
B. HEX code like "#0000ff"
C. RGB Value like "rgb(0,0,255)
D. All of the above
Answer: D) All of the above
Explanation:
All of the given options are valid to define/represent the color name.
13. Which property is used to define the font of the element's text?
A. font
B. font-family
C. font-style
D. All of the above
Answer: B) font-family
Explanation:
The font-family property is used to define the font of the element's text.
Example:
p
{
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
font-family: "Times New Roman", Times, serif;
}
14. To make a text italic, which CSS property is used?
A. font
B. font-family
C. font-style
D. All of the above
Answer: C) font-style
Explanation:
The font-style property is used to define the font style i.e., to make the text bold. To
make the text italic, italic value is used.
Example:
p
{
font-style: italic;
}
15. What are the valid values of font-style property?
A. italic, bold, bolder
B. normal, bold, italic
C. underline, bold, italic
D. inherit, italic, normal, oblique
Answer: D) inherit, italic, normal, oblique
Explanation:
The following are the valid values of the font-style property,
inherit
italic
normal
oblique
16. Why font-weight property is used?
A. Sets how thick or thin characters in text should be displayed.
B. Sets the size of the font
C. Both A. and B.
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
D. None of the above
Answer: A) Sets how thick or thin characters in text should be displayed
Explanation:
The font-weight property sets how thick or thin characters in text should be
displayed.
17. What is/are the correct value(s) of font-weight property?
A. bold, italic, underline
B. normal, bold, italic
C. normal, bold, bolder, lighter, initial, and inherit
D. None of the above
Answer: C) normal, bold, bolder, lighter, initial, and inherit
Explanation:
The valid values of the font-wight property:
normal,
bold
bolder
lighter
initial
inherit
18. Which is the correct inline CSS for p tag to define paragraph's text and
background colors?
A. <p css="color: red; background-color: yellow;">
B. <p cssstyle="color: red; background-color: yellow;">
C. <p inline="color: red; background-color: yellow;">
D. <p style="color: red; background-color: yellow;">
Answer: D) <p style="color: red; background-color: yellow;">
Explanation:
The correct inline CSS style is,
<p style="color: red; background-color: yellow;">Paragraph Text.</p>
19. What is the correct syntax of border property in CSS?
A. border: border-width border-style border-color
B. border: border-color border-width border-style
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
C. border: border-style border-width border-color
D. All of the above
Answer: A) border: border-width border-style border-color
Explanation:
The correct syntax to define element's border using the border property
border: border-width border-style border-color
Example:
<p style="border: 2px solid red;">
This is some text in a paragraph.
</p>
20. Which of the following is the correct syntax to display the hyperlinks
without any underline?
A. a {text-decoration : underline;}
B. a {text-decoration : none;}
C. a {text-decoration : block;}
D. None of the above
Answer: B) a {text-decoration : none;}
Explanation:
The correct syntax to display the hyperlinks without any underline is,
a {text-decoration : none;}
21. Which of the following is the correct syntax to remove the underline on
hyperlinks and visited hyperlinks?
A. a {text-decoration : underline;}, a:visited {text-decoration : underline;}
B. a {text-decoration : block;}, a:visited {text-decoration : block;}
C. a {text-decoration : none;}, a:visited {text-decoration : none;}
D. None of the above
Answer: C) a {text-decoration : none;}, a:visited {text-decoration : none;}
Explanation:
The correct syntax to display the hyperlinks without any underline is,
a {text-decoration : none;}, a:visited {text-decoration : none;}
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
22. Which CSS property is used to style the hyperlinks on hover (Mouse
over)?
A. a:mouseover
B. a:move
C. a:mover
D. a:hover
Answer: D) a:hover
Explanation:
The a:hover property is used to define the style on mouse over event,
a:hover{
// styles
}
23. If you want to use a green dotted border around an image, which CSS
property is used for that?
A. border-style
B. border-color
C. border-decoration
D. Both A. and B.
Answer: D) Both A. and B.
Explanation:
Two properties border-style and border-color are used to define a green dotted
border around an image.
Example:
<img src="image_1.jpg" style="border-style:dotted;border-color:green;"/>
24. Which CSS property and value is used to center an element?
A. text-align:center
B. align:center
C. text-align:middle
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
D. align:middle
Answer: A) text-align:center
Explanation:
text-align property with value center is used to center an elements.
25. What are the valid values of text-align property?
A. left, middle, right
B. left, center, right
C. left, center, right, justify
D. left, middle, right, justify
Answer: C) left, center, right, justify
Explanation:
The valid values of text-align property are,
left
center
right
justify
26. What is the use of "text-align:justify" in CSS?
A. Stretches the lines so that each line has equal width
B. Stretches the lines so that each line can be arranged in left alignment
C. Stretches the lines so that each line can be arranged in right alignment
D. None of the above
Answer: A) Stretches the lines so that each line has equal width
Explanation:
The text-align:justify property stretches the lines so that each line has equal width.
27. Which CSS property is used to specify the indentation of the first line of a
text?
A. text-align
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
B. padding-left
C. margin-left
D. text-indent
Answer: D) text-indent
Explanation:
The text-indent property is used to specify the indentation of the first line of a text.
Example:
p{
text-indent: 50px;
}
28. Which CSS property is used to specify the space between the characters in
a text?
A. text-space
B. letter-space
C. letter-spacing
D. letter-distance
Answer: C) letter-spacing
Explanation:
The letter-spacing property is used to specify the space between the characters in a
text.
Example:
p{
letter-spacing: 5px;
}
29. Which CSS property is used to specify the space between lines?
A. line-space
B. line-spacing
C. line-padding
D. line-height
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
Answer: D) line-height
Explanation:
The line-height property is used to specify the space between lines.
Example:
p{
line-height: 2.0;
}
30. Which CSS property is used to specify the space between the words in a
text?
A. word-spacing
B. word-padding
C. word-height
D. characters-spacing
Answer: A) word-spacing
Explanation:
The word-spacing property is used to specify the space between the words in a text.
Example:
p{
word-spacing: 10px;
}
31. Which CSS property adds shadow to text?
A. content-shadow
B. text-shadow
C. word-shadow
D. text-outline
Answer: B) text-shadow
Explanation:
The text-shadow property adds shadow to text.
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
Example:
p{
text-shadow: 1px 2px green;
}
32. Which CSS property is used to specify uppercase and lowercase letters in
a text?
A. text-transform
B. text-case
C. case
D. text-casing
Answer: A) text-transform
Explanation:
The text-transform property is used to specify uppercase and lowercase letters in a
text.
Example:
p{
text-transform: uppercase / lowercase / capitalize;
}
33. Which is the correct CSS statement to capitalize the first letter of each
word?
A. text-transform: uppercase
B. text-transform: capitalize
C. text-transform: sentence
D. Both A. and B.
Answer: B) text-transform: capitalize
Explanation:
The correct CSS statement is to capitalize the first letter of each word,
p{
text-transform: capitalize;
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
}
34. What are the valid values of text-transform property?
A. uppercase, lowercase, and capitalize
B. uppercase, lowercase, capitalize, and sentence
C. upper, lower, and capital
D. upper, lower, capital, and sentence
Answer: A) uppercase, lowercase, and capitalize
Explanation:
The valid values of text-transform property are,
uppercase
lowercase, and
capitalize
35. What are the valid values of "text-decoration" property?
A. overline, line-through, underline, and none
B. overline, strike, line-through, underline, and none
C. double-line, overline, line-through, underline, and none
D. None of these
Answer: A) overline, line-through, underline, and none
Explanation:
The valid values of text-decoration property are,
overline
line-through
underline, and
none
36. Which CSS property specifies how to align the last line of a text?
A. text-align
B. last-text-align
C. text-align-last-line
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
D. text-align-last
Answer: D) text-align-last
Explanation:
The text-align-last property specifies how to align the last line of a text.
Example:
p{
text-align-last: right;
}
37. Which CSS property sets the vertical alignment of an element?
A. vertical-align
B. vertical-text-align
C. text-valign
D. vertical-align-text
Answer: A) vertical-align
Explanation:
The vertical-align property sets the vertical alignment of an element.
Example:
p{
vertical-align: baseline;
}
38. What are the valid values of vertical-align property?
A. baseline, text-top, text-bottom, subscript, and superscript
B. baseline, top, bottom, sub, and super
C. baseline, text-top, text-bottom, sub, and super
D. base, text-top, text-bottom, sub, and super
Answer: C) baseline, text-top, text-bottom, sub, and super
Explanation:
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
The valid values of vertical-align property are,
baseline
text-top
text-bottom
sub, and
super
39. Which is the correct CSS statement to define multiple font families?
A. font: "Times New Roman", Times, serif;
B. font-name: "Times New Roman", Times, serif;
C. font-family: "Times New Roman, Times, serif";
D. font-family: "Times New Roman", Times, serif;
Answer: D) font-family: "Times New Roman", Times, serif;
Explanation:
The correct CSS statement to define multiple font families,
p{
font-family: "Times New Roman", Times, serif;
}
40. Which CSS property specifies the type of list item marker?
A. list-style
B. list-style-type
C. list-style-circle
D. list-style-square
Answer: B) list-style-type
Explanation:
The list-style-type property specifies the type of list item marker.
Example:
ul {
list-style-type: circle;
}
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
41. Which is the correct CSS statement is used to remove the markers/bullets?
A. list-style: none;
B. list-style-type: 0;
C. list-style-type: blank;
D. list-style-type: none;
Answer: D) list-style-type: none;
Explanation:
The correct CSS statement is used to remove the markers/bullets,
ul {
list-style-type: none;
}
42. Which CSS property specifies an image as the list item marker?
A. list-style-image
B. list-style-picture
C. list-style-background
D. list-style-bgimage
Answer: A) list-style-image
Explanation:
The list-style-image property specifies an image as the list item marker.
Example:
ul {
list-style-image: url('[Link]');
}
43. Which CSS property specifies if/how an element is displayed?
A. block
B. display
C. element-display
D. element-block
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
Answer: B) display
Explanation:
The display property specifies if/how an element is displayed.
Example:
ul {
display: block;
}
44. Which CSS property specifies the type of positioning method used for an
element?
A. positions
B. text-position
C. positioning
D. position
Answer: D) position
Explanation:
The position property specifies the type of positioning method used for an element.
Example:
[Link]{
position: fixed;
}
45. HTML elements are positioned ___ by default.
A. static
B. fixed
C. relative
D. none
Answer: A) static
Explanation:
HTML elements are positioned static by default.
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
46. What are the valid values for "position" property?
A. block, none, fixed, absolute, and static
B. block, static, fixed, absolute, and sticky
C. static, relative, fixed, absolute, and none
D. static, relative, fixed, absolute, and sticky
Answer: D) static, relative, fixed, absolute, and sticky
Explanation:
The valid values for position property are,
static
relative
fixed
absolute
sticky
47. Which CSS property specifies the opacity/transparency of an element?
A. transparency
B. opacity
C. transform-opacity
D. opacity-all
Answer: B) opacity
Explanation:
The opacity property specifies the opacity/transparency of an element.
Example:
img {
opacity: 0.8;
}
48. Which CSS function performs a calculation to be used as the property
value?
A. sum()
B. add()
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
C. calc()
D. addition()
Answer: C) calc()
Explanation:
The calc() function performs a calculation to be used as the property value.
Example:
body {
width: calc(100% - 100px);
}
49. Which CSS function uses the largest value?
A. large()
B. maximum()
C. max_value()
D. max()
Answer: D) max()
Explanation:
The max() function uses the largest value.
Example:
body {
width: max(80%, 100px);
}
50. Which CSS function uses the smallest value?
A. small()
B. minimum()
C. min_value()
D. min()
Answer: D) min()
Explanation:
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
The min() function uses the smallest value.
Example:
body {
width: min(80%, 100px);
}
Advanced CSS MCQs
1. Which CSS property defines the radius of an element's corners?
A. border-corner
B. radius
C. corner
D. border-radius
Answer: D) border-radius
Explanation:
The border-radius property defines the radius of an element's corners.
Example:
.div1{
border-radius: 25px;
}
2. Which CSS property allows you to specify an image to be used instead of
the normal border around an element?
A. border-image
B. border-picture
C. border-background
D. border-bgimage
Answer: A) border-image
Explanation:
The border-image property allows you to specify an image to be used instead of the
normal border around an element.
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
Example:
.borderedimage{
border-image: url([Link]) 30 round;
}
3. What are the RGBA color values?
A. RGBA color values are combination of four colors
B. RGBA color values are an extension of RGB color values with background
image
C. RGBA color values are an extension of RGB color values with an alpha
channel
D. None of the above
Answer: C) RGBA color values are an extension of RGB color values with an alpha
channel
Explanation:
RGBA color values are an extension of RGB color values with an alpha channel.
4. In a RGBA color value, what does A stand for?
A. A specifies the opacity for a color
B. A specifies the Aqua color
C. A specifies the opacity Azure color
D. All of the above
Answer: A) A specifies the opacity for a color
Explanation:
RGBA color values are an extension of RGB color values with an alpha channel -
which specifies the opacity for a color.
Example:
rgba(255, 0, 0, 0.2);
5. Which of the following specifies the red color with opacity?
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
A. rgba(255, 0, 0, 255)
B. rgba(255, 255, 255, 0.3)
C. rgba(0, 0, 255, 0.3)
D. rgba(255, 0, 0, 0.3)
Answer: D) rgba(255, 0, 0, 0.3)
Explanation:
The RGBA value (rgba(255, 0, 0, 0.3)) specifies the color with opacity.
6. Which is correct CSS statement to define blue background color with
opacity?
A. background-color: rgba(0, 0, 255, 0.3)
B. background-color: rgba(0, 0, 255, 255)
C. background-color: rgba(0, 255, 255, 0.3)
D. background-color: rgba(0, 0, 1, 0.3)
Answer: A) background-color: rgba(0, 0, 255, 0.3)
Explanation:
The CSS statement (background-color: rgba(0, 0, 255, 0.3)) specifies the blue
background with an opacity.
7. HSL color value stands for_____.
A. Hex, Saturation and Lightness
B. Hex, Solid and Lightness
C. Hue, Solid and Lightness
D. Hue, Saturation and Lightness
Answer: D) Hue, Saturation and Lightness
Explanation:
HSL color value stands for Hue, Saturation and Lightness.
Hue is a degree on the color wheel from 0 to 360. 0 is red, 120 is green, 240
is blue.
Saturation is a percentage value; 0% means a shade of gray and 100% is the
full color.
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
Lightness is also a percentage; 0% is black, 100% is white.
e.g. background-color: hsl(180, 50%, 50%);
color: hsl(0, 0%, 100%);
8. What is Hue in HSL color value?
A. Hue is a degree on the color wheel (from 0 to 360)
B. Hue is a degree on the color wheel (from 0 to 90)
C. Hue is a degree on the color wheel (from 0 to 180)
D. Hue is a special color name
Answer: A) Hue is a degree on the color wheel (from 0 to 360)
Explanation:
Hue is a degree on the color wheel (from 0 to 360).
9. Which is the correct HSL value for green color?
A. background-color: hsl(180, 100%, 50%)
B. background-color: hsl(360, 100%, 50%)
C. background-color: hsl(120, 100%, 50%)
D. background-color: hsl(0, 100%, 50%)
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
Answer: C) background-color: hsl(120, 100%, 50%)
Explanation:
The correct HSL value for green color is,
background-color: hsl(120, 100%, 50%)
10. What are the HSLA color values?
A. hsla(hex, saturation, lightness, alpha)
B. hsla(hex, solid, lightness, alpha)
C. hsla(hue, solid, lightness, alpha)
D. hsla(hue, saturation, lightness, alpha)
Answer: D) hsla(hue, saturation, lightness, alpha)
Explanation:
An HSLA color value is specified with: hsla(hue, saturation, lightness, alpha), where
the alpha parameter defines the opacity.
11. What is the valid value of alpha parameter?
A. 0 to 255
B. 0 to 90
C. 0 to 16
D. 0.1 to 1.0
Answer: D) 0.1 to 1.0
Explanation:
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
The alpha parameter is a number between 0.0 (fully transparent) and 1.0 (fully
opaque).
12. Which is the correct HSLA value for green color with fully transparent?
A. hsla(360, 100%, 50%, 0.3)
B. hsla(120, 100%, 50%, 1.0)
C. hsla(120, 100%, 50%, 0.1)
D. hsla(360, 100%, 100%, 0.3)
Answer: B) hsla(120, 100%, 50%, 1.0)
Explanation:
The correct HSLA value for green color is,
hsla(120, 100%, 50%, 1.0)
13. Which CSS property sets the opacity for the whole element?
A. aplha
B. opacity-value
C. opacity
D. background-opacity
Answer: C) opacity
Explanation:
The opacity property sets the opacity for the whole element.
Example:
p
{
opacity:0.4;
}
14. Which keyword is used to make a color transparent?
A. transparent
B. opacity
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
C. color-transparent
D. alpha
Answer: A) transparent
Explanation:
The transparent keyword is used to make a color transparent. It is mostly used for
creating the transparent background color of an element.
Example:
body {
background-image: url("[Link]");
}
div.example1 {
background-color: transparent;
}
15. The "transparent" keyword is equivalent to ___ RGBA value.
A. rgba(0,0,0,0)
B. rgba(0,0,0,1)
C. rgba(255,255,255,0)
D. rgba(255,255,255,1)
Answer: A) rgba(0,0,0,0)
Explanation:The transparent keyword is equivalent to rgba(0,0,0,0).
Bootstrap Interview Questions
1) Explain What is Bootstrap?
Bootstrap is a platform for web development that is based on a front-end framework
and creates exceptional responsive designs. It is fast, easy and has multiple
templates designed using HTML, and CSS. These templates are used for forms,
tables, buttons, typography, models, tables, navigation, carousels and images.
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
Bootstrap also has Javascript plugins, which are optional. Bootstrap is preferred
for developing mobile web applications.
2) What are the key components of Bootstrap?
In total, there are five key components of Bootstrap i.e. CSS (multiple CSS files),
Scaffolding (essential for the basic system that consist of Grid system, background,
and link styles), Layout Components: (shares a list of all layouts), JavaScript Plugins
(includes jQuery and JavaScript plugins) and Customization (Allows customization of
all components for a desired framework)
3) What is a Bootstrap Container?
The bootstrap container is again a class that is used for creating an area in the
center of the webpage to place the content. There are row elements that act as
containers for columns thereby making a grid system. Rows are used for creating
horizontal column groups. Using the function .container, you can get a responsive
design, which will include all the other HTML code.
4) Enlist few alternative of Bootstrap?
Foundation, Bulma, UIkit, Semantic UI, Susy, Materialize, Skeleton are the top
alternatives of the Bootstrap framework.
5) What is Bootstrap Navbar?
Navigation Bar is a navigation area of the website that is placed at the top of the
website and contains links to important pages. Bootstrap navigation bar is mobile
responsive and created by adding
<nav class="navbar navbar-default"></nav>
6) What are Bootstrap alerts?
Bootstrap alerts are predefined alert messages that add styles to message which
looks more noticeable to users. .alert-success, .alert-info, .alert-warning, .alert-
danger are classes in bootstrap to decorate alert messages.
8) Why do we use Bootstrap Carousel (slideshow) plugin?
The Carousel plugin is responsible for adding a slider on the site. The developers
usually use it when the webspace is limited but the content is huge. Some of the
common carousels include:
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
.carousel (options) - Initializes the carousel with an optional options object and
starts cycling through items.
.carousel ('pause') - Stops the carousel from cycling through items.
.carousel ('prev') - Cycles to the previous item
.carousel ('next') - Cycles to the next item
.carousel ('number') - Cycles the carousel to a particular frame (0 based, similar to
an array). Returns to the caller before the target item has been shown
.carousel (‘cycle’) - Cycles through the carousel items from left to right.
9) Enlist major Typography Classes available in bootstrap?
Major Typography Classes in Bootstrap are
.lead: Used to make a paragragh diffrent from others.
.small: Reduces the font size of [Link] 85% of the size of the parent
element
.text-left: align the content text to left.
.text-lowercase: Display element text in lower case.
.list-inline: display element inline.
.pre-scrollable: Make pre tag content scrollable.
10) Explain why you prefer Bootstrap for website development?
Bootstrap has features that are way better than other web development platforms. It
provides an extensive browser support for almost every known browser such as
Opera, Chrome, Firefox, Safari etc. With adequate knowledge of CSS and HTML,
web development becomes easy on Bootstrap. Also, it supports mobile applications
with the help of responsive design. It can adjust CSS as per the device, screen size
etc. Instead of creating multiple files, it creates only a single file, which reduces any
extra effort by the developer.
11) How many types of layout are available in Bootstrap?
There are two major layouts for Bootstrap i.e. Fluid Layout (.container-fluid) and
Fixed Layout (.container).
Fluid layout is necessary for creating an app that is 100 % wider and covers all the
screen width.
Fixed Layout is used only for a standard screen (940px).
Both layouts can be used for creating a responsive design.
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
12) What is Bootstrap Grid System?
Bootstrap includes a responsive, mobile first fluid grid system that appropriately
scales up to 12 columns as the device or viewport size increases. It includes
predefined classes for easy layout options, as well as powerful mixins for generating
more semantic layouts
13) ) What is Contextual classes of table in Bootstrap?
The Contextual classes allow you to change the background color of your table rows
or individual cells. Bootstrap provides a number of contextual classes that can be
used to color the entire row or a single cell of a table. These classes should be used
with the light table and not with the dark table for a better appearance. The list of
contextual classes is given below.
table-primary
table-secondary
table-success
table-danger
table-warning
table-info
table-light
table-dark
table-active
14) What do you mean by Bootstrap collapsing elements?
Bootstrap collapsing elements is a way in which you can collapse any specific
element without developing any JavaScript code or even an accordion markup. Now,
in order to implement this element, you need to add data-toggle="collapse" in the
controller element. To automatically assign the control of the collapsible element,
you can use data-target or href along with data-toggle="collapse". There are other
options also available such as .collapse (options), .collapse ('hide'), .collapse
('show')
15) What is the role of the media objects in Bootstrap and how many types are
available?
In Bootstrap, it is possible to add images, audio, and video using media object. It can
either be placed on the left side or the right side of the content. If the developer
wishes to create a media element then they can use .media a class where the
source will be specified as a .media-object class. There are usually two types of
Media-objects i.e. .media and .media-list.
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
16) What is the role of pagination in bootstrap and what are their
classifications?
When an unordered list has to be handled by bootstrap, it uses pagination. To
handle the list, different classes are available such as ‘.pagination’, ‘.disabled’,
‘.active’, ‘.pagination-lg’. The function ‘.pagination’ to paginate the webpage. The
function ‘.disabled’ is used to make the links unclickable. The function ‘.active’ is
used for indicating the current webpage. The function ‘.pagination-lg’ and
‘.pagination-sm’ can be used for getting different size items.
17) What are bootstrap alerts?
Bootstrap Alerts provide a way to style messages to the user. They provide
contextual feedback messages for typical user actions.
You can add an optional close icon to alert.
How will you create a bootstrap alert?
You can add a basic alert by creating a wrapper <div> and adding a class of .alert
and one of the four contextual classes (e.g., .alert-success, .alert-info, .alert-warning,
.alert-danger).
18) What are glyphicons?
Glyphicons are icon fonts which you can use in your web projects. Glyphicons
Halflings are not free and require licensing, however their creator has made them
available for Bootstrap projects free of cost
19) What is the procedure to create Nav elements in Bootstrap?
There are several styling navigation elements available on bootstrap and every style
uses the same function i.e. ‘class .nav’. In order to create tabs or a tabular
navigation, you can begin with a simple or rather basic unordered list using the
function class .nav. To add the tabs the function ‘class .nav-tabs can be used.
20) How do you use Glyphicons?
To use the icons, simply use the following code just about anywhere in your code.
Leave a space between the icon and text for proper padding.
<span class = "glyphicon glyphicon-search"></span>
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
21) What do you mean by Modal plugin that is used for in Bootstrap?
When there is a need to cover a parent window, a child window can be created
using a modal. Developers generally use a custom Jquery Plugin to create a Modal
on Bootstrap. Modal windows are best when it comes to improving the experience of
a user and also adding more functionality. The modal windows can be simply
created with the help of a modal plugin.
22) How do you make images responsive?
Bootstrap 3 allows to make the images responsive by adding a class .img-
responsive to the <img> tag. This class applies max-width: 100%; and height: auto;
to the image so that it scales nicely to the parent element.
23) Why use Bootstrap?
Bootstrap can be used as −
Mobile first approach − Since Bootstrap 3, the framework consists of Mobile first
styles throughout the entire library instead of in separate files.
Browser Support − It is supported by all popular browsers.
Easy to get started − With just the knowledge of HTML and CSS anyone can get
started with Bootstrap. Also the Bootstrap official site has a good documentation.
Responsive design − Bootstrap's responsive CSS adjusts to Desktops,Tablets and
Mobiles.
Provides a clean and uniform solution for building an interface for developers.
It contains beautiful and functional built-in components which are easy to customize.
It also provides web based customization.
And best of all it is an open source
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
Bootstrap MCQs
Q1. Bootstrap Is Developed By
A. James Gosling
B. Mark Otto And Jacob Thornton
C. Mark Jukervich
D. None Of Them
Answer: Mark Otto And Jacob Thornton
Explanation: Mark Otto and Jacob Thornton developed bootstrap at Twitter. It was
released as an open-source product in August 2011 on GitHub.
Q2. Which of the following class applies the hover color to a particular row or
cell of a table?
A - .active
B - .success
C - .warning
D - .danger
Answer: .active
Q3. Which Class Indicates A Dropdown Menu?
A. .dropdown
B. .select
C. .dropdown-list
D. .dropup-list
Answer: .dropdown
Q4. Glyphicons Is Mainly Used For?
A. Slideshow
B. Graphic Images
C. Animation
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
D. Providing Different Icons
Answer: Providing Different Icons
Q5. A Standard Navigation Tab Is Created With:
A. <ul Class="navigation-tabs">
B. < ul Class="nav Tabs" >
C. < ul Class="navnav-tabs" >
D. < ul Class="navnav-navbar" >
Answer: < ul Class="nav Tabs" >
Q6. Bootstrap's Grid System Allows Up To
A. 6 Columns Across The Page
B. 8 Columns Across The Page
C. 12 Columns Across The Page
D. 24 Columns Across The Page
Answer: 12 Columns Across The Page
Q7. Default Size Of H5 Bootstrap Heading
A. 14px
B. 16 px
C. 18 px
D. 20 px
Answer: 14px
Q8. Medium Devices Are Defined As Having A Screen Width From
A. 900 Pixels To 1000 Pixels
B. 768 Pixels To 991 Pixels
C. 512 Pixels To 2048 Pixels
D. 992 Pixels To 1199 Pixels
Answer: 900 Pixels To 1000 Pixels
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
Q9. Glyphicons Used For
A. Using Different Icons Like Badge
B. Using Slideshow
C. Using Animation
D. Using Favicon
Answer: Using Different Icons Like Badge
Q10. Default Size Of H3 Bootstrap Heading
A. 18px
B. 24px
C. 26px
D. 30px
Answer: 24px
Q11. The Bootstrap Class Xs Means For
A. Tablets
B. Desktop
C. Phones
D. Larger Desktops
Answer: Phones
Q12. The Bootstrap Class Md Means For
A. Desktop
B. Tablets
C. Phones
D. Larger Desktops
Answer: Desktop
Q13. Which Of The Following Contextual Class Is Used For Warning Purpose?
A. .active
B. .warning
C. .danger
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
D. All Of The Above
Answer: .warning
Q14. Which Plugin Is Used To Cycle Through Elements, Like A Slideshow?
A. Orbit
B. Scrollspy
C. Slideshow
D. Carousel
Answer: Carousel
Q15. which class provides a responsive fixed width container in bootstrap?
A. .container-fixed
B. .container
C. .container-fluid
D. None of above
Answer: .container
Q16. Which Class Creates A List Of Items?
A. Lst-group
B. List-group
C. List-grp
D. Menu-group
Answer: List-group
Q17. What Layout Is Used For Providing 100% Width In Bootstrap?
A. Fluid Layout
B. Fixed Layout
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
C. Both (a)and (b)
D. None Of The Above
Answer: Fluid Layout
Q18. The bootstrap grid system is based on how many columns?
A. 12 column
B. 20 column
C. 10 column
D. 15 column
Answer: 12 column
Q19. What are Bootstrap Carousel plugins?
A. .carousel (options)
B. .carousel (‘pause’)
C. .carousel (‘cycle’)
D. All of these
Answer: All of these
Q20. Which of the following grid class is used for desktops?
A. md
B. lg
C. sm
D. xs
Answer: md
Q21. Bootstrap is used for
A. Data
B. IoT
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
C. Bigdata
D. Web applications
Answer: Web applications
Q22. Sass stands for .........
A. Scripting awesome Stylesheets
B. Scripting awesome Spreadsheets
C. Syntactically awesome Stylesheets
Answer: Syntactically awesome Spreadsheets
Q23. Bootstrap is used for front end development only.
A. True
B. False
Answer: True
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
JavaScript
1. JavaScript is the programming language of the _____.
A. Desktop
B. Mobile
C. Web
D. Server
Answer: C) Web
Explanation:
JavaScript is the programming language of the Web.
2. Which type of JavaScript language is _____?
A. Object-oriented
B. Object-based
C. Functional programming
D. All of the above
Answer: B) Object-based
Explanation:
JavaScript is an object-oriented based programming language.
3. Which of the following statement(s) is true about the JavaScript?
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
A. It is a scripting language used to make the website interactive
B. It is an advanced version of Java for Desktop and Mobile application
development
C. It is a markup language of Java to develop the webpages
D. All of the above
Answer: A) It is a scripting language used to make the website interactive
Explanation:
The correct statement about the JavaScript programming language is "It is a
scripting language used to make the website interactive".
4. In which HTML element, we put the JavaScript code?
A. <javascript>...</javascript>
B. <js>...</js>
C. <script>...</script>
D. <css>...</css>
Answer: C) <script>...</script>
Explanation:
The JavaScript code is written inside the <script>...</script> tag/element.
5. JavaScript code can be written in ____.
A. JavaScript file (.js file)
B. HTML document directly
C. JavaScript file and in HTML document directly
D. In style sheets (.css file)
Answer: C) JavaScript file and in HTML document directly
Explanation:
JavaScript code can be written in the JavaScript file and in HTML document directly.
6. Which symbol is used separate JavaScript statements?
A. Comma (,)
B. Colon (:)
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
C. Hyphen (_)
D. Semicolon (;)
Answer: D) Semicolon (;)
Explanation:
The semicolon (;) is used to separate the JavaScript statements.
7. JavaScript ignores?
A. newlines
B. tabs
C. spaces
D. All of the above
Answer: D) All of the above
Explanation:
JavaScript ignores spaces, tabs, and newlines written in the code, we can use them
for the alignment and separate the sections to give a perfect look at our code.
8. Which is the correct syntax to call an external JavaScript file in the current
HTML document?
A. <script src="[Link]"></script>
B. <script href=" [Link]"></script>
C. <import src=" [Link]"></import>
D. <script link=" [Link]"></script>
Answer: A) <script src="[Link]"></script>
Explanation:
The correct syntax to call an external JavaScript file in the current HTML document
is:
<script src="[Link]"></script>
9. Which JavaScript method is used to access an HTML element by id?
A. getElementById()
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
B. getElement(id)
C. getElementById(id)
D. elementById(id)
Answer: C) getElementById(id)
Explanation:
The JavaScript method [Link](id) is used to access an HTML
document by id.
10. Which property is used to define the HTML content to an HTML element
with a specific id?
A. innerText
B. innerContent
C. elementText
D. innerHTML
Answer: D) innerHTML
Explanation:
The innerHTML is the property that defined HTML content.
Example:
[Link]("notif").innerHTML = "New course launched";
11. Which JavaScript method is used to write HTML output?
A. [Link]()
B. [Link]()
C. [Link]()
D. [Link]()
Answer: A) [Link]()
Explanation:
The JavaScript method [Link]() defines the HTML output.
12. Which JavaScript method is used to write on browser's console?
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
A. [Link]()
B. [Link]()
C. [Link]()
D. [Link]()
Answer: C) [Link]()
Explanation:
The JavaScript method [Link]() is used to write on browser's console.
13. Which JavaScript method is used to write into an alert box?
A. [Link]()
B. [Link]()
C. [Link]()
D. [Link]()
Answer: B) [Link]()
Explanation:
The JavaScript method [Link]() is used to write into an alert box.
14. Which is the correct JavaScript statement to display "Hello Boss!" into an
alert box?
A. alert("Hello Boss!");
B. alert('Hello Boss!');
C. alert(Text:'Hello Boss!');
D. Both A. and B.
Answer: D) Both A. and B.
Explanation:
The both of statement are correct to display "Hello Boss!" into an alert box:
[Link]("Hello Boss!");
[Link]('Hello Boss!');
15. Which is the correct JavaScript statement to print the addition of two
numbers 10 and 20 in a paragraph whose id is "result"?
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
A. getElementById("result").innerHTML = 10+20;
B. getElementById("result").innerHTML = "10+20";
C. getElementById("#result").innerHTML = 10+20;
D. All of the above
Answer: A) getElementById("result").innerHTML = 10+20;
Explanation:
The correct JavaScript statement to print the addition of two numbers 10 and 20 in a
paragraph whose id is "result" is:
[Link]("result").innerHTML = 10+20;
16. What is the use of this JavaScript statement?
<button onclick="[Link]()">Submit</button>
A. It will write "Submit" on the current Window
B. It will print the content of the current page
C. It will write the content of the current page in the browser’s console
D. None of the above
Answer: B) It will print the content of the current page
Explanation:
The [Link]() method prints the content of the current page.
17. In JavaScript, single line comment begins with ___.
A. #
B. /*
C. $
D. //
Answer: D) //
Explanation:
In JavaScript, single line comment begins with //.
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
18. In JavaScript, multi-line comments start with __ and end with ___.
A. /* and */
B. <!—and -->
C. ## and ##
D. // and //
Answer: A) /* and */
Explanation:
In JavaScript, multi-line comments start with /* and end with */.
19. Which JavaScript keyword is used to declare a variable?
A. Var
B. var
C. Let
D. All of the above
Answer: B) var
Explanation:
The var keyword defines a variable in JavaScript.
20. How many keywords are there in JavaScript to declare variables or
constants?
A. 1
B. 2
C. 3
D. 4
Answer: C) 3
Explanation:
There are 3 ways / keywords to declare variables or constants, those are:
var
let
const
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
21. What is the main difference between var and let keywords in JavaScript?
A. var defines a variable while let defines a constant
B. var defined function scoped variable while let define block scoped variable
C. The value of a variable declared with var can be changed while the value of a
variable declared with let cannot be changed
D. All of the above
Answer: B) var defined function scoped variable while let define block scoped
variable
Explanation:
The var and let keywords are both used for variable declaration in JavaScript. But,
the main difference between them is that var defines function scoped variable
while let defines block-scoped variable.
22. The const keyword is used to define a ______.
A. Function scopes variable
B. Block scoped variable
C. Constant
D. Constant with no initial value
Answer: C) Constant
Explanation:
The const keyword is used to define a constant.
23. Which is the correct syntax to declare a constant in JavaScript?
A. const constant_name;
B. constant_name const;
C. constant_name const = value;
D. const constant_name = value;
Answer: D) const constant_name = value;
Explanation:
The correct syntax to declare a constant is:
const constant_name = value;
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
Example:
const PI = 3.14;
24. What will be the value of VALUE?
<script>
const VALUE = 10;
VALUE = 20;
</script>
A. 10
B. 20
C. ValueError
D. TypeError
Answer: D) TypeError
Explanation:
We cannot change the value of a constant, thus the above code will generate a
TypeError – "TypeError: Assignment to constant variable"
25. What is the default value of an uninitialized variable?
A. 0
B. undefined
C. null
D. NaN
Answer: B) undefined
Explanation:
The default value of an unfinalized variable is undefined.
26. What is the output of the following JavaScript code?
<script>
var a;
[Link]("demo").innerHTML = a+1;
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
</script>
A. 0
B. undefined
C. 1
D. NaN
Answer: D) NaN
Explanation:
The output of the above JavaScript code is: NaN
27. Can be redeclare a variable that is declared with var keyword?
A. Yes
B. No
Answer: A) Yes
Explanation:
Yes, we can redeclare variable that is declared with var keyword.
28. What is the output of the following JavaScript code?
<script>
var name = "Fortune" + " " + "Cloud";
[Link]("demo").innerHTML = name;
</script>
A. Fortune Cloud
B. FortuneCloud
C. TypeError
D. ValueError
Answer: A) Fortune Cloud
Explanation:
The output of the above JavaScript code is: "Fortune Cloud"
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
29. What is the output of the following JavaScript code?
<script>
var a = 10 + 20 + "5";
[Link]("demo").innerHTML = a;
</script>
A. 35
B. 305
C. TypeError
D. ValueError
Answer: B) 305
Explanation:
The output of the above JavaScript code is: 305
30. Can be redeclare a variable that is declared with let keyword?
A. Yes
B. No
Answer: B) No
Explanation:
No, we cannot redeclare variable that is declared with let keyword.
31. What is the output of the following JavaScript code?
<script>
let a = 10;
let a = 0;
</script>
A. 10
B. 0
C. SyntaxError
D. TypeError
Answer: C) SyntaxError
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
Explanation:
The output of the above JavaScript code is: "SyntaxError: 'a' has already been
declared".
32. Which is the exponentiation operator in JavaScript?
A. exp()
B. ^
C. **
D. pow
Answer: C) **
Explanation:
The exponentiation operator in JavaScript is ** which is used to calculate the result
of first operand's to the power of the second operators i.e., x**y = x to the power of
y (xy).
33. Does JavaScript support increment (++) and decrements (--) Operators?
A. Yes
B. No
Answer: A) Yes
Explanation:
Yes, JavaScript supports increment (++) and decrements (--) operators.
Example:
<script>
var x = 5;
[Link]("test").innerHTML = ++x;
</script>
34. What will be the output of the following JavaScript code?
<script>
var x = 5;
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
[Link]("demo").innerHTML = x--;
</script>
A. 5
B. 4
C. TypeError
D. ValueError
Answer: B) 4
Explanation:
The output of the above statement will be 5.
In the above statement, we used post-decrement (x--). Post-decrement decreases
the value by 1 after evaluating the current statement.
35. What will be the output of the following JavaScript code?
<script>
var x = 10 + 20 * 5;
[Link]("tes").innerHTML = x;
</script>
A. 110
B. 150
C. TypeError
D. ValueError
Answer: A) 110
Explanation:
The output of the above statement will be 110.
In the above code, the expression is 10 + 20 * 5. The precedence of multiplication
operator (*) is higher than the addition operator (+). This 20 *5 will evaluate first.
36. What will be the output of the following JavaScript code?
<script>
var x = (10 + 20) * 5;
[Link]("tes").innerHTML = x;
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
</script>
A. 110
B. 150
C. TypeError
D. ValueError
Answer: B) 150
Explanation:
The output of the above statement will be 150.
In the above code, the expression is (10 + 20) * 5. The precedence of () are higher
than any other operators This (10 + 20) will evaluate first.
37. JavaScript types are _____.
A. Static
B. Dynamic
Answer: B) Dynamic
Explanation:
JavaScript types are dynamic, which means the same variable can be used to store
the different types of values.
38. JavaScript arrays are written with _____.
A. round brackets ()
B. curly brackets {}
C. double quotes ""
D. square brackets []
Answer: D) square brackets []
Explanation:
JavaScript arrays are written with square brackets [].
39. JavaScript objects are written with _____.
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
A. round brackets ()
B. curly brackets {}
C. double quotes ""
D. square brackets []
Answer: B) curly brackets {}
Explanation:
JavaScript objects are written with curly brackets {}.
40. Which JavaScript operator is used to determine the type of a variable?
A. typeof
B. TypeOf
C. typeOf
D. sizeof
Answer: A) typeof
Explanation:
The typeof operator is used to determine the type of a variable.
41. Which is the correct syntax of JavaScript typeof operator?
A. typeof variable/value
B. typeof(variable/value)
C. Both A. and B.
D. None of the above
Answer: C) Both A. and B.
Explanation:
Both of the syntaxes can be used for JavaScript typeof operator.
42. What will be the output of the following JavaScript code?
<script>
var x = 12.34;
[Link]("test").innerHTML = typeof(x);
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
</script>
A. int
B. float
C. long
D. number
Answer: D) number
Explanation:
The output of the following JavaScript code is number.
43. Which keyword is used to define a JavaScript function?
A. module
B. fun
C. func
D. function
Answer: D) function
Explanation:
The function keyword is used to define the JavaScript function.
44. Which is the correct syntax for the function definition?
A. return_type function function_name(parameter1, parameter2, ...) { /*Function's
body*/ }
B. function function_name(parameter1, parameter2, ...) { /*Function's body*/ }
C. return_type function_name(parameter1, parameter2, ...) { /*Function's body*/ }
D. function function_name(parameter1, parameter2, ...) as return_type {
/*Function's body*/ }
Answer: B) function function_name(parameter1, parameter2, ...) { /*Function's
body*/ }
Explanation:
The function definition syntax is:
function function_name(parameter1, parameter2, ...)
{
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
/*Function's body*/
}
45. What will be the output of the following JavaScript code?
<script>
function addition(a, b) {
return a+b;
}
[Link]("test").innerHTML = addition;
</script>
A. SyntaxError
B. ValueError
C. 0
D. function addition(a, b) { return a+b; }
Answer: D) function addition(a, b) { return a+b; }
Explanation:
Calling of a function without () will return the function definition i.e., function object
instead of the result.
46. Can we use a function as a variable value?
A. Yes
B. No
Answer: A) Yes
Explanation:
Yes, a function can be used as a variable value.
47. In JavaScript a variable contains one value while an object may contain
___.
A. One value
B. Two values
C. Three values
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
D. Many values
Answer: D) Many values
Explanation:
In JavaScript a variable contains one value while an object may contain many
values.
48. Which is the correct syntax to access an object property in JavaScript?
A. objectName:propertyName
B. propertyName
C. objectName["propertyName"]
D. Both B. and C.
Answer: D) Both B. and C.
Explanation:
The properties of an object can we accessed using
either [Link] or objectName["propertyName"].
49. Which property is used to get the length of a string in JavaScript?
A. strlen
B. len
C. length
D. Length
Answer: C) length
Explanation:
The length property is used to get the length of a string in JavaScript.
50. What will be the output of the following JavaScript code?
<script>
let str = "FortuneCloud";
[Link]("test").innerHTML = [Link];
</script>
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
A. 11
B. 12
C. ValueError
D. SyntaxError
Answer: A) 11
Explanation:
The output of the above statement will be the length of the string. That is 11.
51. Which character is used to break up a code line within a text string in
JavaScript?
A. Single quote (')
B. Single backslash (\)
C. Double quote (")
D. Tipple single quote (''')
Answer: B) Single backslash (\)
Explanation:
The Single backslash (\) is used to break up a code line within a text string in
JavaScript.
Example:
[Link]("test").innerHTML = "Hello \
FortuneCloud!";
52. Will the following JavaScript code work?
<script>
[Link]("test").innerHTML = \
"Hello, FortuneCloud!";
</script>
A. Yes
B. No
Answer: B) No
Explanation:
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
No, the above code will not work. Because, we cannot breakup a JavaScript code
line with single backslash (\).
53. Which is the correct JavaScript statement to define string as object?
A. var s = new String("India!");
B. var s = String("India!");
C. var s = "India!"
D. All of the above
Answer: A) var s = new String("India!");
Explanation:
The strings can also be defined as an object using the new keyword. The correct
JavaScript statement to define a string as an object is:
var s = new String("India!");
54. What will be the output of the following JavaScript code?
<script>
let str1 = new String("FortuneCloud!");
let str2 = new String("FortuneCloud!");
[Link]("test").innerHTML = (str1==str2);
</script>
A. true
B. false
C. True
D. False
Answer: B) false
Explanation:
In the above code, str1 and str2 are the objects. And. In the JavaScript, comparison
of two objects returns false.
55. What will be the output of the following JavaScript code?
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
<script>
let x = 10;
[Link](x, " , ", toString(x));
</script>
A. 10 , 10
B. 10 , undefined
C. 10 , [object Undefined]
D. None of the above
Answer: C) 10 , [object Undefined]
Explanation:
In the above JavaScript code, the statement toString(x) will not convert number to
string because toString() is not a global method, it is a Number method and the
correct way is to call this function is [Link]().
56. What will be the output of the following JavaScript code?
<script>
let x = 10;
[Link](typeof x, " , ", typeof String(x));
</script>
A. number , string
B. number , number
C. object , string
D. object , object
Answer: A) number , string
Explanation:
In the above JavaScript code, we are using the String() method which is a global
method to convert numbers to string. Thus, the statement typeof String(x) will
return string.
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
57. In JavaScript, the string template literals use ____ rather than the quotes
("") to define a string?
A. Single quotes ('')
B. Backslash with single quote (\’'\')
C. Backslashes (\\)
D. Back-ticks (``)
Answer: D) Back-ticks (``)
Explanation:
In JavaScript, the string template literals use back-ticks (``) rather than the quotes
("") to define a string.
58. Does the following JavaScript variable definition is correct?
let x = ‘I’m "India!"`;
A. Yes
B. No
Answer: A) Yes
Explanation:
The JavaScript variable definition statement is true. Because, with the JavaScript
template literals, we can use both single and double quotes inside a string.
59. Which JavaScript method is used to get a number as a string?
A. toString()
B. intToString()
C. parseInteger()
D. All of the above
Answer: A) toString()
Explanation:
The JavaScript method toString() is used to get a number as a string.
60. What will be the output of the following JavaScript code?
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
<script>
const myArray = ['h', 'e', 'l', 'l', 'o'];
[Link](myArray[0]);
[Link](myArray[1]);
</script>
A. he
B. undefinedh
C. ValueError
D. TypeError
Answer: A) he
Explanation:
In JavaScript, the array indexing starts with 0. Thus, the above statement with print
"h" and "e".
61. What will be the output of the following JavaScript code?
<script>
let cars = ['Honda', 'Hyundai'];
[Link]('Mahindra');
[Link](typeof cars + " " + cars);
</script>
A. array Honda,Hyundai,Mahindra
B. string Honda,Hyundai,Mahindra
C. object Honda,Hyundai,Mahindra
D. object "Honda", "Hyundai", "Mahindra"
Answer: C) object "Honda", "Hyundai", "Mahindra"
Explanation:
The push() method pushes an element at the end of the array. And, typeof returns
the type of the object. Here, cars is an array.
62. What will be the output of the following JavaScript code?
<script>
let cars1 = ['Honda', 'Hyundai'];
let cars2 = cars1;
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
[Link]('Mahinda');
[Link](cars1 + "---" + cars2);
</script>
A. Honda,Hyundai,Mahinda---Honda,Hyundai
B. Honda,Hyundai,Mahinda---Honda,Hyundai,Mahinda
C. Honda,Hyundai ---Honda,Hyundai
D. [Honda,Hyundai,Mahinda]---[Honda,Hyundai,Mahinda]
Answer: B) Honda,Hyundai,Mahinda---Honda,Hyundai,Mahinda
Explanation:
In the JavaScript, the arrays are objects, and the array elements are stored by
reference. Hence, when an array value is copied, any change in the copied array will
also reflect in the original array. Thus, the values of cars1 and cars2 are the same.
63. What will be the output of the following JavaScript code?
<script>
var msgs=new Array("Hello","Hey","Morning!");
for (i=0;i<[Link];i++){
[Link](msgs[i] + " | ");
}
</script>
A. Hello | Hey | Morning! |
B. Hello | Hey |
C. ValueError
D. TypeError
Answer: A) Hello | Hey | Morning! |
Explanation:
In the above JavaScript code, the array is declared using the new operator and all
elements are printing using the loop. Thus, the output would be "Hello | Hey |
Morning! |".
64. What will be the output of the following JavaScript code?
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
<script>
var values = [10, 20, 30, 40];
var result = [Link](function(x,y){
return (x + y);
});
[Link]("Result: " + result);
</script>
A. Result: 40
B. Result: 70
C. Result: 90
D. Result: 100
Answer: D) Result: 100
Explanation:
In the above JavaScript code, we used the reduceRight() method which is used to
reduce the given array elements into a single value by executing a reducer function.
The reducer() function is applied against the accumulator and reduces all the
elements from right to left. Thus, the output would be "Result: 100".
65. What will be the output of the following JavaScript code?
<script>
var cars = ["Honda","Hyundai","Mahindra"];
var result = [Link]();
[Link]("Result: ", cars);
</script>
A. Result: Honda,Hyundai,Mahindra
B. Result: Honda
C. Result: Hyundai,Mahindra
D. Result: Honda,Mahindra
Answer: C) Result: Hyundai,Mahindra
Explanation:
In the above JavaScript code, we used the shift() method which is used to remove
the first element of the given array and return that element. This method changes
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
the length of the original array. Thus, the output would be "Result:
Hyundai,Mahindra".
66. What will be the output of the following JavaScript code?
<script>
var cars = ["Honda","Hyundai","Mahindra"];
var result = [Link]("Toyota", "Tata");
[Link]("[", result, "] ", cars);
</script>
A. [5] Toyota,Tata,Honda,Hyundai,Mahindra
B. [5]Honda,Hyundai,Mahindra,Toyota,Tata
C. [2] Toyota,Tata
D. [5] Honda,Hyundai,Toyota,Tata,Mahindra
Answer: A) [5] Toyota,Tata,Honda,Hyundai,Mahindra
Explanation:
In the above JavaScript code, we used unshift() method which is used to add one or
more elements in the beginning of the given array and returns the updated array.
This method changes the length of the original array. Thus, the output would be "[5]
Toyota,Tata,Honda,Hyundai,Mahindra".
67. Which JavaScript method is used to call a function (a callback function)
once for each array element?
A. for()
B. traverse()
C. forEach()
D. foreach()
Answer: C) forEach()
Explanation:
The JavaScript method forEach() is used to call a function (a callback function) once
for each array element.
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
[Link] will be the output of the following JavaScript code?
<script>
let x = "10";
let y = + x;
[Link](typeof y);
</script>
A. string
B. object
C. undefined
D. number
Answer: D) number
Explanation:
In JavaScript, the unary + operator can be used to convert a variable to a number.
Hence, the statement let y = + x; will convert variable to number.
jQuery
1. jQuery is a ______.
A. JavaScript Library
B. JSON Library
C. Java Library
D. JSON and CSS Library
Answer: A) JavaScript Library
Explanation:
jQuery is a JavaScript Library.
2. To work with jQuery, you should have the basic knowledge of these topics?
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
A. HTML
B. CSS
C. JavaScript
D. All of the above
Answer: D) All of the above
Explanation:
To work with jQuery, you should have the basic knowledge of HTML, CSS, and
JavaScript.
3. Who developed jQuery?
A. John Richard
B. John Resig
C. John Carter
D. John Alexander
Answer: B) John Resig
Explanation:
John Resig developed jQuery.
4. In which year jQuery was initial released?
A. 2004
B. 2005
C. 2006
D. 2007
Answer: C) 2006
Explanation:
jQuery was initial released on August 26, 2006.
5. Is jQuery case-sensitive?
A. Yes
B. No
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
Answer: A) Yes
Explanation:
Yes, jQuery is case-sensitive.
6. Which feature(s) jQuery contains?
A. HTML/DOM manipulation
B. CSS manipulation
C. HTML event methods
D. Effects and animations
E. AJAX
F. Utilities
G. All of the above
Answer: G) All of the above
Explanation:
All of the above features jQuery contains.
7. Which sign is used to define/access jQuery?
A. $
B. .
C. &
D. #
Answer: A) $
Explanation:
$ sign is used to define/access jQuery.
8. Which jQuery is used to hide the current element?
A. $(this).hideelement()
B. $(this).hide('true')
C. $(this).hide(0)
D. $(this).hide()
Answer: D) $(this).hide()
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
Explanation:
The $(this).hide() method is used to hide the current element.
9. Which is the correct jQuery statement to hide all <div> elements?
A. $("div").hide()
B. $(div).hide()
C. $(".div").hide()
D. $("#div").hide()
Answer: A) $("div").hide()
Explanation:
The $("div").hide() statement can be used to hide all <div> elements.
10. Which is the correct jQuery statement to hide all elements having class
name "new"?
A. $("new").hide()
B. $(new).hide()
C. $(".new").hide()
D. $("#new").hide()
Answer: C) $(".new").hide()
Explanation:
The $(".new").hide() statement can be used to hide all elements having class name
"new".
11. Which is the correct jQuery statement to hide all elements having id name
"new"?
A. $("new").hide()
B. $(new).hide()
C. $(".new").hide()
D. $("#new").hide()
Answer: D) $("#new").hide()
Explanation:
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
The $("#new").hide() statement can be used to hide all elements having id name
"new".
12. What is the use of jQuery Selectors?
A. jQuery selectors are used to select and manipulate HTML element(s).
B. jQuery selectors are used to import the HTML elements from the other file.
C. jQuery selectors are used to select and manipulate JSON elements(s).
D. jQuery selectors are used to select and manipulate ReactJS classes.
Answer: A) jQuery selectors are used to select and manipulate HTML element(s)
Explanation:
jQuery selectors are used to select and manipulate HTML element(s).
13. Which is the correct jQuery selector statement to select all <div>
elements?
A. $(".div")
B. $("#div")
C. $("div")
D. $("<div>")
Answer: C) $("div")
Explanation:
The statement $("div") is the correct syntax to select all <div> elements.
14. Which sign is used for class selector?
A. $class
B. .class
C. #class
D. None
Answer: C) .class
Explanation:
The dot sign (.) i.e., .class is used for the class selector.
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
15. Which sign is used for id selector?
A. $id
B. .id
C. #id
D. None
Answer: C) #id
Explanation:
The hash sign (#) i.e., #id is used for the id selector.
16. Why #id selectors are used for?
A. To select all elements having the id
B. To select all elements without having the id
C. To select all elements having the id within a specified <div>
D. To select all elements having the id within a specified section.
Answer: C) To select all elements having the id within a specified <div>
Explanation:
The #id selectors are used to select all elements having the id.
17. Which is the correct jQuery selector to select all elements?
A. $("all")
B. $("*.*")
C. $("*")
D. $("***")
Answer: C) $("*")
Explanation:
The $("*") selector is used to select all elements.
18. Which is the correct jQuery selector to select current HTML element?
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
A. $(this)
B. $(cur)
C. $(.this)
D. $(#this)
Answer: A) $(this)
Explanation:
The $(this) selector is used to select current HTML elements.
19. Which is the correct jQuery selector to select all <div> elements with class
name "new"?
A. $(".new")
B. $("[Link]")
C. $(".[Link]")
D. $(".div#new")
Answer: B) $("[Link]")
Explanation:
The $("[Link]") selector is used to select all <div> elements with class name "new".
20. Which method is used to attach an event handler function to an HTML
element on mouse click?
A. click()
B. Click()
C. dblclick()
D. DblClick()
Answer: A) click()
Explanation:
The jQuery method click() is used to attach an event handler function to an HTML
element on mouse click.
21. Which method is used to attach an event handler function to an HTML
element on mouse double click?
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
A. click()
B. Click()
C. dblclick()
D. DblClick()
Answer: C) dblclick()
Explanation:
The jQuery method dblclick() is used to attach an event handler function to an HTML
element on mouse double click.
22. Which method is used to attach an event handler function to an HTML
element when the mouse pointer enters the HTML element?
A. mouseover()
B. mousevisit()
C. mouse-enter()
D. mouseenter()
Answer: D) mouseenter()
Explanation:
The jQuery method mouseenter() is used to attach an event handler function to an
HTML element when the mouse pointer enters the HTML element.
23. Which method is used to attach an event handler function to an HTML
element when the mouse pointer leaves the HTML element?
A. mouseLeave()
B. mouseleave()
C. mouse-leave()
D. mouseexit()
Answer: B) mouseleave()
Explanation:
The jQuery method mouseleave() is used to attach an event handler function to an
HTML element when the mouse pointer leaves the HTML element.
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
24. Which method is used to attach an event handler function to an HTML
element when the left, middle or right mouse button is pressed down, while
the mouse is over the HTML element?
A. mousedown()
B. mouseover()
C. mousepress()
D. mousekey()
Answer: A) mousedown()
Explanation:
The jQuery method mousedown() is used to attach an event handler function to an
HTML element when the left, middle or right mouse button is pressed down, while
the mouse is over the HTML element.
25. Which method is used to attach an event handler function to an HTML
element when the left, middle or right mouse button is released, while the
mouse is over the HTML element?
A. mouseup()
B. mouseover()
C. mouseabove()
D. mousekey()
Answer: A) mouseup()
Explanation:
The jQuery method mouseup() is used to attach an event handler function to an
HTML element when the left, middle or right mouse button is released, while the
mouse is over the HTML element.
26. Which method is used to attach an event handler function to an HTML
element when the mouse moves over the HTML elements?
A. mousemove()
B. mouseover()
C. hover()
D. mousehover()
Answer: C) hover()
Explanation:
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
The jQuery method hover() is used to attach an event handler function to an HTML
element when the mouse moves over the HTML elements.
27. Which method is used to attach an event handler function to an HTML
element when the form field gets focus?
A. focused()
B. focuses()
C. focuselement()
D. focus()
Answer: D) focus()
Explanation:
The jQuery method focus() is used to attach an event handler function to an HTML
element when the form field gets focus.
28. Which method is used to attach an event handler function to an HTML
element when the form field loses focus?
A. blur()
B. leave()
C. focusleave()
D. leavefocus()
Answer: A) blur()
Explanation:
The jQuery method blur() is used to attach an event handler function to an HTML
element when the form field loses focus.
29. What is the use of jQuery method toggle()?
A. To hide shown elements and to show hidden elements
B. To remove current element
C. To shift current element at the previous position
D. All of the above
Answer: A) To hide shown elements and to show hidden elements
Explanation:
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
The toggle() method is used to hide the shown elements and to show the hidden
elements.
30. Which jQuery method is used to fade in a hidden element?
A. fade()
B. fadeIn()
C. fadeOut()
D. fadeToggle()
Answer: B) fadeIn()
Explanation:
The jQuery fadeIn() method is used to fade in a hidden element.
31. What is the syntax of jQuery fadeIn() method?
A. $(selector).fadeIn();
B. $(selector).fadeIn(callback, speed);
C. $(selector).fadeIn(callback);
D. $(selector).fadeIn(speed,callback);
Answer: D) $(selector).fadeIn(speed,callback);
Explanation:
The syntax of jQuery method fadeIn() is:
$(selector).fadeIn(speed,callback);
32. Which jQuery method is used to fade out a visible element?
A. fadeout()
B. fadeIn()
C. fadeOut()
D. fadeToggle()
Answer: C) fadeOut()
Explanation:
The jQuery fadeOut() method is used to fade out a visible element.
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
33. What is the syntax of jQuery fadeOut() method?
A. $(selector).fadeOut();
B. $(selector).fadeOut(callback, speed);
C. $(selector).fadeOut(callback);
D. $(selector).fadeOut(speed,callback);
Answer: D) $(selector).fadeOut(speed,callback);
Explanation:
The syntax of jQuery method fadeOut() is:
$(selector).fadeOut(speed,callback);
34. Which jQuery method toggles between the fadeIn() and fadeOut()
methods?
A. toggle()
B. Toggle()
C. fadeToggle()
D. fadetoggle()
Answer: C) fadeToggle()
Explanation:
The jQuery fadeToggle() method toggles between
the fadeIn() and fadeOut() methods.
35. What is the syntax of jQuery fadeToggle() method?
A. $(selector).fadeToggle();
B. $(selector).fadeToggle(callback, speed);
C. $(selector).fadeToggle(callback);
D. $(selector).fadeToggle(speed,callback);
Answer: D) $(selector).fadeToggle(speed,callback);
Explanation:
The syntax of jQuery method fadeToggle() is:
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
$(selector).fadeToggle(speed,callback);
36. Which jQuery method allows fading to a given opacity (value between 0
and 1)?
A. fade()
B. fadeOpacity()
C. fadeTo()
D. fadeto()
Answer: C) fadeTo()
Explanation:
The jQuery fadeTo() method allows fading to a given opacity (value between 0 and
1).
37. Which is the correct jQuery statement to fade out a <p> element?
A. $("p").fadeOut();
B. $("#p").fadeOut();
C. $(".p").fadeOut();
D. $("p").fadeout();
Answer: A) $("p").fadeOut();
Explanation:
The jQuery statement to fade out a p elements is:
$("p").fadeOut();
38. Which is the correct jQuery statement to fade out a <p> element with
duration effect "slow"?
A. $("p").fadeOut("slow");
B. $("#p").fadeOut("slow");
C. $(".p").fadeOut("slow");
D. $("p").fadeout();
Answer: A) $("p").fadeOut("slow");
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
Explanation:
The jQuery statement to fade out a <p> elements with duration effect "slow" is:
$("p").fadeOut("slow");
39. Which jQuery method is used to slide down an element?
A. slideBottom()
B. slideDown()
C. slidedown()
D. slide()
Answer: B) slideDown()
Explanation:
The jQuery slideDown() method is used to slide down an element.
40. Which jQuery method is used to slide up an element?
A. slideUp()
B. slideBottom()
C. slidebottom()
D. slide()
Answer: A) slideUp()
Explanation:
The jQuery slideUp() method is used to slide up an element.
41. Which jQuery method toggles between the slideDown() and slideUp()
methods?
A. slide ()
B. slideSwitch()
C. slidetoggle()
D. slideToggle()
Answer: D) slideToggle()
Explanation:
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
The jQuery slideToggle() method toggles between
the slideDown() and slideUp() methods.
42. Which jQuery method is used to create custom animations?
A. animation()
B. slidAnimate()
C. animate()
D. SlideAnimate()
Answer: C) animate()
Explanation:
The jQuery animate() method is used to create custom animations.
43. What is the correct syntax of animate() method?
A. $(selector).animate({params},speed,callback);
B. $(#selector).animate({params},speed,callback);
C. $(selector).animate(speed,callback);
D. $(selector).animate({speed,callback,params});
Answer: A) $(selector).animate({params},speed,callback);
Explanation:
The correct syntax of animate() method is:
$(selector).animate({params},speed,callback);
44. In the syntax of animate() method, why params parameter is used?
A. It is used to define the speed of the animation
B. It is used to define the mouse events on the HTML element
C. It is used to define the CSS property to be animated
D. None of the above
Answer: C) It is used to define the CSS property to be animated
Explanation:
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
The params parameter of jQuery animate() method is used to define the CSS
property to be animated.
45. In the syntax of animate() method, what is/are the valid value(s) of speed
parameter?
A. slow
B. fast
C. milliseconds
D. All of the above
Answer: D) All of the above
Explanation:
The following are the correct value of the speed parameter are:
slow
fast
milliseconds
46. Which jQuery method is used to stop an animation before it is finished?
A. animate(false)
B. animate('false')
C. animate("false")
D. stop()
Answer: D) stop()
Explanation:
The jQuery method stop() is used to stop an animation before it is finished.
47. In jQuery DOM, what does DOM stand for?
A. Data Object Model
B. Document Object Manipulation
C. Document Object Model
D. Document On Model
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
Answer: D) Document Object Model
Explanation:
In jQuery DOM, DOM stands for Document Object Model.
48. Which jQuery DOM method is used to set or return the text content of
selected elements?
A. content()
B. text()
C. html()
D. val()
Answer: B) text()
Explanation:
The jQuery DOM method text() is used to set or return the text content of selected
elements.
49. Which jQuery DOM method is used to set or return the content of selected
elements (including HTML markup)?
A. content()
B. text()
C. html()
D. val()
Answer: C) html()
Explanation:
The jQuery DOM method html() is used to set or return the content of selected
elements (including HTML markup).
50. Which jQuery DOM method is used to set or return the value of form
fields?
A. content()
B. text()
C. html()
D. val()
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
Answer: D) val()
Explanation:
The jQuery DOM method val() is used to set or return the value of form fields.
51. Which jQuery DOM method is used to insert content at the end of the
selected elements?
A. insert()
B. add()
C. append()
D. appendValue()
Answer: C) append()
Explanation:
The jQuery DOM method append() is used to insert content at the end of the
selected elements.
52. Which jQuery DOM method is used to insert content at the beginning of the
selected elements?
A. insert()
B. before()
C. append()
D. prepend()
Answer: D) prepend()
Explanation:
The jQuery DOM method prepend() is used to insert content at the beginning of the
selected elements.
53. Which jQuery DOM method is used to insert content after the selected
elements?
A. after()
B. postpend()
C. addafter()
D. prepend()
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
Answer: A) after()
Explanation:
The jQuery DOM method after() is used to insert content after the selected
elements.
54. Which jQuery DOM method is used to insert content before the selected
elements?
A. before()
B. addbefore()
C. addprepend()
D. prepend()
Answer: A) before()
Explanation:
The jQuery DOM method before() is used to insert content before the selected
elements.
55. Which is the correct syntax to insert content at the end of the <p>
elements?
A. $("#p").append("Text to be added");
B. $("p").before("Text to be added");
C. $("p").append("Text to be added");
D. $("p").prepend("Text to be added");
Answer: C) $("p").append("Text to be added");
Explanation:
The correct syntax to insert content at the end of the <p> elements is:
$("p").append("Text to be added");
56. Which is the correct syntax to insert content at the beginning of the <p>
elements?
A. $("#p").before("Text to be added");
B. $("p").addafter("Text to be added");
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
C. $("p").after("Text to be added");
D. $("p").prepend("Text to be added");
Answer: D) $("p").prepend("Text to be added");
Explanation:
The correct syntax to insert content at the beginning of the <p> elements is:
$("p").prepend("Text to be added");
57. Which is the correct syntax to insert content after the <div> elements?
A. $("div").after("Text to be added");
B. $("div").postpend("Text to be added");
C. $("div").addafter("Text to be added");
D. $("#div").after("Text to be added");
Answer: A) $("div").after("Text to be added");
Explanation:
The correct syntax to insert content after the <div> elements is:
$("div").after("Text to be added");
58. Which is the correct syntax to insert content before the <div> elements?
A. $("div").before("Text to be added");
B. $("div").pretpend("Text to be added");
C. $("div").addbefore("Text to be added");
D. $("#div").before("Text to be added");
Answer: A) $("div").before("Text to be added");
Explanation:
The correct syntax to insert content before the <div> elements is:
$("div").before("Text to be added");
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
59. What is the difference between remove() and empty() methods?
A. remove() removes the selected element and its child elements while empty()
removes the child elements of the selected element
B. remove() removes the child elements of the selected element while empty()
removes the selected elements and its child elements
C. remove() removes the child elements while empty() removes the content of
the selected element
D. remove() removes the child elements while empty() removes the content of
the selected element and its child elements
Answer: A) remove() removes the selected element and its child elements while
empty() removes the child elements of the selected element
Explanation:
The difference between remove() and empty() methods is: remove() removes the
selected element and its child elements while empty() removes the child elements of
the selected element.
60. Write a jQuery statement to remove all <p> elements with class="prog"?
A. $(".prog").remove();
B. $("p").empty(".prog");
C. $("p").remove(".prog");
D. $("[Link]").remove();
Answer: C) $("p").remove(".prog");
Explanation:
The jQuery statement to removes all <p> elements with class="prog" is:
$("p").remove(".prog");
61. Which method is used to add CSS class to the selected elements?
A. add()
B. addClass()
C. addClasses()
D. AddClasses()
Answer: B) addClass()
Explanation:
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
The jQuery method addClass() is used to add CSS class to the selected elements.
62. Can we add more than one CSS classes to the selected elements using the
addClass() method?
A. Yes
B. No
Answer: A) Yes
Explanation:
Yes, we can add more than one CSS classes to the selected elements using
the addClass() method.
63. Which method is used to remove CSS class to the selected elements?
A. removeCSS()
B. removeClass()
C. removeClasseses()
D. RemoveClass()
Answer: B) removeClass()
Explanation:
The jQuery method removeClass() is used to remove CSS class to the selected
elements.
64. Which method is used to set or get the CSS style attribute?
A. cssAttribute()
B. attribute()
C. attr()
D. css()
Answer: D) css()
Explanation:
The jQuery method css() is used to get or set the CSS style attribute.
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
65. Which is the correct syntax to get the value of a CSS style
attribute/property using the css() method?
A. css("propertyname");
B. css(propertyname);
C. css(".propertyname");
D. css("#propertyname");
Answer: A) css("propertyname");
Explanation:
The correct syntax to get the value of a CSS style attribute/property using
the css() method is: css("propertyname");
66. Which is the correct syntax to set the value of a CSS style
attribute/property using the css() method?
A. css("propertyname"="value");
B. css("propertyname","value");
C. css("propertyname":"value");
D. css("propertyname":="value");
Answer: B) css("propertyname","value");
Explanation:
The correct syntax to set the value of a CSS style attribute/property using
the css() method is:
css("propertyname","value");
67. Which is the correct jQuery statement to set background color and text
decoration to all <p> elements?
A. $("p").css({"background-color": "#f1f1f1"; "text-decoration": "underline"});
B. $("#p").css({"background-color": "#f1f1f1"; "text-decoration": "underline"});
C. $("p").css({"background-color": "#f1f1f1", "text-decoration": "underline"});
D. $("#p").css({"background-color": "#f1f1f1", "text-decoration": "underline"});
Answer: C) $("p").css({"background-color": "#f1f1f1", "text-decoration": "underline"});
Explanation:
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
The correct jQuery statement to set background color and text decoration to
all <p> elements is:
$("p").css({"background-color": "#f1f1f1", "text-decoration": "underline"});
68. Which jQuery method is used to get or set the width of an HTML element?
A. cssWidth()
B. Csswidth()
C. lenght()
D. width()
Answer: D) width()
Explanation:
The jQuery method width() is used to get or set the width of an HTML element.
69. Which jQuery method is used to get or set the height of an HTML element?
A. cssHeight()
B. CssHeight()
C. height()
D. getHeight()
Answer: C) height()
Explanation:
The jQuery method height() is used to get or set the height of an HTML element.
Study sincerely to become Employable
“There is no shortcut for Success”
All the Best..!
©All Rights Reserved, Fortune Cloud Technologies Group, Pune
[Link] | +91 – 9766439090 / 7083777567
You might also like
- Loyola International School,: Qatar Academic Session:2024 - 2025 Computer Science NotesNo ratings yetLoyola International School,: Qatar Academic Session:2024 - 2025 Computer Science Notes5 pages
- Cha. 2 Introduction To HTML and Cha. 3 Advanced HTMLNo ratings yetCha. 2 Introduction To HTML and Cha. 3 Advanced HTML29 pages
- G8 Chapter 1 Building Websites With HTML1No ratings yetG8 Chapter 1 Building Websites With HTML12 pages
- Class 7 Class Note 14 CH 5 Computer 2021 22No ratings yetClass 7 Class Note 14 CH 5 Computer 2021 225 pages
- Bcom Web Programs Viva & E-Commerce VivaNo ratings yetBcom Web Programs Viva & E-Commerce Viva28 pages
- TLEWebpage910 q1 Mod4 BasicHTMLSyntax V1 ForPrinting LaputNo ratings yetTLEWebpage910 q1 Mod4 BasicHTMLSyntax V1 ForPrinting Laput10 pages
- It Spring Edutech: Chapter 1: Getting Started With HTMLNo ratings yetIt Spring Edutech: Chapter 1: Getting Started With HTML12 pages
- Understanding HTML Basics and StructureNo ratings yetUnderstanding HTML Basics and Structure18 pages
- Power Pivot and Power BI (The Excel User's Guide To DAX, Power Query, Power BI & Power Pivot in Excel 2010-2016) (2nd Edition) CollieNo ratings yetPower Pivot and Power BI (The Excel User's Guide To DAX, Power Query, Power BI & Power Pivot in Excel 2010-2016) (2nd Edition) Collie10 pages
- How To Set Up Your Secondary Camera On The Duolingo English TestNo ratings yetHow To Set Up Your Secondary Camera On The Duolingo English Test4 pages
- Fundamentals SuperTAPP SG - Technical ManualNo ratings yetFundamentals SuperTAPP SG - Technical Manual126 pages
- Nokia Flexi Node B Commissioning Quick Reference V3100% (3)Nokia Flexi Node B Commissioning Quick Reference V38 pages
- Ionic Framework by Example - Sample Chapter0% (3)Ionic Framework by Example - Sample Chapter17 pages
