Escape Campus - Front End Quiz
-
HTML links are defined with <a> tag and address is specified by attribute
-
Hlink
-
Href
-
Src
-
Src-link
-
About This Quiz
This quiz tests knowledge on front-end web development, focusing on CSS behavior, HTML structure, and responsive design principles.
Quiz Preview
- 2.
Bootstrap’s grid system uses up to:
-
12 columns
-
6 columns
-
14 columns
-
10 columns
Correct Answer
A. 12 columnsExplanation
Bootstrap's grid system uses up to 12 columns. This means that when designing a layout using Bootstrap, the content can be divided into 12 equal-width columns. These columns can be easily rearranged and stacked on different screen sizes, allowing for a responsive design. By utilizing the grid system, developers can create flexible and dynamic layouts that adapt to various devices and screen resolutions.Rate this question:
-
- 3.
In HTML5, default character-set is known to be of
-
UTF-5
-
UTF-6
-
UTF-7
-
UTF-8
Correct Answer
A. UTF-8Explanation
The default character-set in HTML5 is known as UTF-8. UTF-8 is a widely used character encoding that can represent all possible characters in the Unicode standard. It supports a wide range of languages and characters, making it the recommended character encoding for HTML documents.Rate this question:
-
- 4.
All HTML documents must start with a declaration of
-
<DOCTYPE html>
-
<!DOCTYPE html>
-
<html>
-
<!html>
Correct Answer
A. <!DOCTYPE html>Explanation
The correct answer is "". This is because the declaration is used to specify the version and type of HTML being used in the document. It tells the browser how to interpret and render the HTML code. Without this declaration, the browser may not render the HTML correctly or may go into quirks mode, which can cause compatibility issues.Rate this question:
-
- 5.
In HTML, unordered list items are marked with
-
Bullets
-
Numerical
-
Increasingly
-
Alphabetically
Correct Answer
A. BulletsExplanation
In HTML, unordered list items are marked with bullets. This means that each item in the list is displayed with a bullet point symbol to indicate its presence in the list. This is the default style for unordered lists in HTML, and it helps to visually separate and distinguish each item in the list.Rate this question:
-
- 6.
HTML:
- <ul class="shopping-list" id="awesome">
- <li><span>Milk</span></li>
- <li class="favorite" id="must-buy"><span class="highlight">Sausage</span></li>
- </ul>
- ul li {
- color: blue;
- }
- #must-buy {
- color: black;
- }
-
Black
-
Blue
-
Neither
-
Red
Correct Answer
A. BlackExplanation
The text "Sausage" is black because in the CSS code, there is a specific rule targeting the element with the id "must-buy" and setting its color to black.Rate this question:
- 7.
For displaying a webpage within a webpage, HTML uses
-
Classes
-
Div element
-
Span Element
-
IFrames
Correct Answer
A. IFramesExplanation
HTML uses iFrames to display a webpage within a webpage. iFrames allow developers to embed another HTML document within the current document. This is useful for displaying content from another website or integrating external content into a webpage. iFrames provide a way to create a separate window or frame within a webpage, allowing for more flexibility and control over the displayed content.Rate this question:
-
- 8.
Div element defines section at a
-
Page level
-
Inline level
-
Block level
-
Tab level
Correct Answer
A. Block levelExplanation
The element is used to define a section of content on a webpage. It is a block-level element, meaning that it takes up the entire width of its parent container and creates a new line before and after the element. This allows for easy organization and styling of content within the element.Rate this question:
-
- 9.
A HTML element can be assigned a style through attribute named
-
Design
-
Theme
-
Style
-
Template
Correct Answer
A. StyleExplanation
An HTML element can be assigned a style through the attribute named "Style". This attribute allows the developer to specify CSS rules directly within the HTML tag, affecting the appearance and layout of the element. By using the "Style" attribute, developers can define properties such as color, font size, background color, and more, providing a way to customize the visual presentation of the HTML elements on a webpage.Rate this question:
-
- 10.
Attribute in HTML that defines location of where to open linked area, is said to be
-
Target
-
Framename
-
VisitLink
-
OpenLink
Correct Answer
A. TargetExplanation
The correct answer is "Target" because the attribute in HTML that defines the location of where to open a linked area is called "target". This attribute is used to specify the name of the frame or window where the linked content should be displayed.Rate this question:
-
- 11.
An element named content have other elements of
-
2 types
-
3 types
-
4 types
-
5 types
Correct Answer
A. 2 typesExplanation
The element named "content" has two types of other elements associated with it.Rate this question:
-
- 12.
A HTML element known to be <ins>, defines
-
Incapsulation
-
Insertion
-
Instance
-
Instantiation
Correct Answer
A. InsertionExplanation
The correct answer is "Insertion". The HTML element <ins> is used to represent inserted text in a document. It is typically displayed as underlined text. This element is often used in conjunction with the <del> element, which represents deleted or removed text. The <ins> element helps to indicate changes made to a document, such as additions or revisions.Rate this question:
-
- 13.
Which plugin is used to create tooltip?
-
Modal
-
Dialog box
-
Popup
-
Tooltip
Correct Answer
A. TooltipExplanation
The correct answer is "tooltip". A tooltip is a small pop-up box that appears when a user hovers over an element, providing additional information or context. It is commonly used to provide hints or explanations for icons, buttons, or links on a website or application. The tooltip plugin allows developers to easily create and customize tooltips with various styles and behaviors.Rate this question:
-
- 14.
A TARGET value that is used when a webpage is opened in a new tab, is
-
_self
-
_top
-
_parent
-
_blank
Correct Answer
A. _blankExplanation
When a webpage is opened in a new tab, the target value "_blank" is used. This target value instructs the browser to open the linked page in a new tab or window, depending on the user's browser settings. It is commonly used when you want to provide additional information or resources to the user without navigating away from the current page.Rate this question:
-
- 15.
Syntax to change font type of a heading in HTML is
-
<h1 style='font-type:verdana;'>
-
<h1 style="font-family:verdana;">
-
<style="font-family:verdana;">
-
<style='font-type:verdana;'>
Correct Answer
A. <h1 style="font-family:verdana;">Explanation
The correct answer is "". This is because the "font-family" property is used to specify the font type in CSS, and in this case, it is set to "verdana" for the heading.Rate this question:
-
- 16.
Alpha in RGB extension named RGBA, defines
-
Hue
-
Saturation
-
Lightness
-
Opacity
Correct Answer
A. OpacityExplanation
The alpha value in the RGB extension named RGBA defines the opacity of a color. It determines how transparent or opaque the color is. By adjusting the alpha value, we can control the visibility of an object or layer in an image or graphic. A higher alpha value makes the color more opaque, while a lower alpha value makes it more transparent.Rate this question:
-
- 17.
A block level element of HTML always starts on a
-
New window
-
New Tab
-
New page
-
New Line
Correct Answer
A. New LineExplanation
A block level element of HTML always starts on a new line. This means that when a block level element is encountered in the HTML code, it will be displayed on a new line, separate from any content that may appear before or after it. This is in contrast to inline elements, which do not start on a new line and can appear within a line of text.Rate this question:
-
- 18.
How do you insert a comment in a CSS file?
-
// this is a comment //
-
/* this is a comment */
-
‘ this is a comment
-
// this is a comment
Correct Answer
A. /* this is a comment */Explanation
In CSS, comments are inserted using the /* and */ symbols. Therefore, the correct answer is /* this is a comment */. This syntax allows developers to add comments within their CSS code, which are ignored by the browser when rendering the webpage. Comments are useful for documenting the code, providing explanations, or temporarily disabling certain styles.Rate this question:
-
- 19.
Which plugin is used to create a modal window?
-
Modal
-
Popup
-
Window
-
Dialog box
Correct Answer
A. ModalExplanation
The correct answer is "modal" because a modal window is a type of window that requires the user to interact with it before they can return to the main application. It is often used to display important information or to prompt the user for input. The "modal" plugin would provide the necessary functionality to create and manage modal windows within a website or application.Rate this question:
-
- 20.
Javascript is _________ language.
-
Programming
-
Application
-
Scripting
-
None of these
Correct Answer
A. ScriptingExplanation
Javascript is considered a scripting language because it is primarily used to add interactivity and dynamic behavior to web pages. It is often embedded within HTML code and executed by web browsers. Unlike programming languages, scripting languages do not require compilation and can be interpreted and executed directly. Javascript's main purpose is to manipulate the Document Object Model (DOM) of a web page, allowing for the creation of interactive elements and user-friendly interfaces. Therefore, the correct answer is "Scripting".Rate this question:
-
- 21.
Array elements are accessed using their
-
Length
-
Pointers
-
Object
-
Index
Correct Answer
A. IndexExplanation
Array elements are accessed using their index. In an array, each element is assigned a unique index value starting from 0. The index represents the position of an element within the array. By specifying the index value, we can retrieve or modify the value stored at that particular position in the array. Therefore, when accessing array elements, we use their index values to identify and manipulate the desired element.Rate this question:
-
- 22.
Syntax of style attribute of HTML is
-
<tagname style="property">
-
<tagname style="property:value;">
-
<style="value;">
-
<style="property;">
Correct Answer
A. <tagname style="property:value;">Explanation
The correct answer is "". This is the correct syntax for the style attribute in HTML. It allows you to apply inline styles to a specific HTML element by specifying the property and its corresponding value. The style attribute is placed within the opening tag of the HTML element that you want to style.Rate this question:
-
- 23.
Using a <style> element in head section is known as
-
External
-
Outline
-
Internal
-
Inline
Correct Answer
A. InternalExplanation
Using a element in the head section of an HTML document is known as internal styling. Internal styling allows the web designer to define CSS rules within the HTML document itself, making it easier to maintain and update the styling for multiple web pages. This method is different from inline styling, where CSS rules are applied directly to individual HTML elements using the style attribute. External styling, on the other hand, involves linking an external CSS file to the HTML document.Rate this question:
-
- 24.
Not a way to composite HTML Colors ?
-
RGBA
-
HSL
-
CNYK
-
HEX
Correct Answer
A. CNYKExplanation
The correct answer is "CNYK" because it is not a valid way to composite HTML colors. The correct term is "CMYK," which stands for Cyan, Magenta, Yellow, and Key (black). CMYK is a color model used in printing, while RGBA, HSL, and HEX are valid ways to represent colors in HTML.Rate this question:
-
- 25.
Browsers displays <strong> tag as
-
<i>
-
<b>
-
<u>
Correct Answer
A. <b>Explanation
The correct answer is . The tag is used to indicate text that should be displayed in a bold font. The tag is also used for the same purpose, so it can be used interchangeably with the tag. Both tags are used to emphasize text and make it stand out. The tag is used to display text in italics, while the tag is used to underline text.Rate this question:
-
- 26.
If you have a <p> element with font-size: 10rem, will the text be responsive when the user resizes / drags the browser window?
-
True
-
False
Correct Answer
A. FalseExplanation
If the font-size is set to 10rem, it means that the font size is relative to the root element's font size. Therefore, when the user resizes or drags the browser window, the font size will not be responsive as it is not set to a specific unit like pixels or percentages that would automatically adjust with the window size changes.Rate this question:
-
- 27.
HTML:
- <ul class="shopping-list" id="awesome">
- <li><span>Milk</span></li>
- <li class="favorite" id="must-buy"><span class="highlight">Sausage</span></li>
- </ul>
- ul {
- color: red;
- }
- li {
- color: blue;
- }
-
Red
-
Blue
-
Neither
-
Black
Correct Answer
A. BlueExplanation
The text "Sausage" is blue because the CSS rule `li {color: blue;}` applies a blue color to all `li` elements, including the one containing the text "Sausage". The `ul` element also has a CSS rule `ul {color: red;}`, but this rule does not affect the color of the text within the `li` elements. Therefore, the correct answer is Blue.Rate this question:
- 28.
If form data contains sensitive or personal information, method to use is
-
Post
-
Get
-
Set
-
Append
Correct Answer
A. PostExplanation
The correct answer is "Post" because the POST method is used to send data to the server in a secure and confidential manner. When sensitive or personal information is involved, it is important to use the POST method as it sends the data in the body of the HTTP request, making it less visible and accessible compared to the GET method which sends the data in the URL.Rate this question:
-
- 29.
Element to use for making responsive webpages, is called
-
<viewres>
-
<meta>
-
<portview>
-
<viewport>
Correct Answer
A. <meta>Explanation
The correct answer is . The element is used in HTML to provide metadata about the webpage. It can be used to specify various attributes, including the viewport attribute, which is commonly used for making webpages responsive. The viewport attribute allows developers to control the width and scaling of the webpage on different devices, ensuring that the content is displayed correctly and optimally for different screen sizes.Rate this question:
-
- 30.
Which of the following class is used to create a button as a link in bootstrap?
-
.btn-hyperlink
-
.btn-link
-
.btn-anchor
-
None of these
Correct Answer
A. .btn-linkExplanation
The correct answer is .btn-link. This class is used in Bootstrap to create a button that functions as a link. It provides the styling and behavior of a button, but when clicked, it navigates to a specified URL just like a regular anchor tag.Rate this question:
-
- 31.
When an attribute of HTML value contains double quotes, it is necessary to use
-
Single quotes
-
Double quotes
-
Single+Double quotes
-
No quotes
Correct Answer
A. Single quotesExplanation
When an attribute of HTML value contains double quotes, it is necessary to use single quotes. This is because using single quotes for the attribute value allows for the attribute itself to be enclosed in double quotes without causing any conflicts or syntax errors. By using single quotes, it ensures that the attribute value is correctly interpreted by the HTML parser.Rate this question:
-
- 32.
In HTML, element defining a table heading is
-
<style>
-
<head>
-
<thead>
-
<th>
Correct Answer
A. <th>Explanation
The correct answer is . In HTML, the element is used to define a table heading. This element is typically used within the element, which represents the group of header content in a table. The element is used to mark up the cells in the header row or column of a table, providing a semantic indication that the content within those cells represents headings for the table data.Rate this question:
-
- 33.
Element used as a container for some text is defined as
-
<span>
-
<div>
-
<container>
-
<style>
Correct Answer
A. <span>Explanation
A element is used as a container for some text. It is an inline element that is typically used to apply styling or manipulate specific parts of a text within a larger block of content. It does not affect the layout and structure of the document. The element, on the other hand, is a block-level element used to group larger sections of content. The and elements are not valid HTML elements.Rate this question:
-
- 34.
Font to be used for an HTML element can be defined through property
-
Font
-
Font-name
-
Font-src
-
Font-family
Correct Answer
A. Font-familyExplanation
The correct answer is "Font-family". The font-family property in HTML is used to define the typeface or font of an element. It allows you to specify multiple font choices, in order of preference, to ensure that if the first choice is not available, the browser will try the next one. This property is commonly used to style text on web pages and can be applied to various HTML elements such as headings, paragraphs, and spans.Rate this question:
-
- 35.
<div> element used along together with CSS, can generate
-
Content blocks
-
Table blocks
-
Style blocks
-
Div Blocks
Correct Answer
A. Style blocksExplanation
The element, when used together with CSS, can generate style blocks. This means that the element can be used to create a container or a section of a webpage that can be styled using CSS properties and rules. By applying CSS styles to a element, you can control its appearance, such as its size, color, background, and positioning, allowing you to customize the layout and design of your webpage.Rate this question:
-
- 36.
To access an external sheet link is added over section
-
<head>
-
<!DOCTYPE>
-
<h1>
-
<body>
Correct Answer
A. <head>Explanation
The given answer is "". In HTML, the element is used to define the head section of a document, which contains meta information about the document such as title, stylesheets, scripts, etc. It is typically placed before the element. In this case, the question mentions that a link is added over a section, and it is common practice to include external stylesheets or scripts in the section using the tag. Therefore, adding a link over a section would require placing it within the element.Rate this question:
-
- 37.
An external CSS usually defines style for?
-
Single element
-
Single HTML page
-
Multiple elements
-
Multiple HTML pages
Correct Answer
A. Multiple HTML pagesExplanation
An external CSS is typically used to define styles for multiple HTML pages. By linking an external CSS file to multiple HTML pages, the same styles can be applied consistently across all of them. This allows for easier maintenance and updates, as changes made to the external CSS file will automatically be reflected in all the linked HTML pages.Rate this question:
-
- 38.
Which of the following is/are true about Bootstrap?
-
Free front-end framework.
-
Open source product.
-
It gives you the ability to create responsive designs
-
All of the above
Correct Answer
A. All of the aboveExplanation
Bootstrap is a free front-end framework and an open-source product. It provides developers with the ability to create responsive designs, meaning that the websites or applications built with Bootstrap can adapt and adjust their layout and design based on the device or screen size they are being viewed on. Therefore, all of the given statements are true about Bootstrap.Rate this question:
-
- 39.
HTML element <div> describes
-
Divisor
-
Divided
-
Division
-
Diversion
Correct Answer
A. DivisionExplanation
The HTML element is used to create a division or a section in an HTML document. It is a container that allows you to group and organize other HTML elements. It is commonly used to separate content into different sections or to apply styling and formatting to a specific area of a webpage. Therefore, the correct answer is "division".Rate this question:
-
- 40.
Element to use for making responsive webpages, is called
-
<viewres>
-
<meta>
-
<portview>
-
<viewport>
Correct Answer
A. <meta>Explanation
The correct answer is . The element is used to provide metadata about the HTML document, including information about the viewport, which is crucial for making webpages responsive. The viewport meta tag allows the browser to adjust the webpage's layout and dimensions to fit different screen sizes and orientations, ensuring a better user experience on various devices.Rate this question:
-
- 41.
In HTML elements, CSS can be added in different
-
2 ways
-
3 ways
-
4 ways
-
5 ways
Correct Answer
A. 3 waysExplanation
CSS can be added to HTML elements in three different ways. The first way is by using inline styles, where CSS is directly added to the HTML element using the "style" attribute. The second way is by using internal stylesheets, where CSS is written within the "style" tags in the head section of the HTML document. The third way is by using external stylesheets, where CSS is written in a separate file with a .css extension and linked to the HTML document using the "link" tag.Rate this question:
-
- 42.
Bootstrap global default font-size is
-
15px
-
14px
-
13px
-
None
Correct Answer
A. 14pxExplanation
The correct answer is 14px. Bootstrap's global default font-size is set to 14 pixels. This means that all text within the Bootstrap framework will have a font-size of 14 pixels unless otherwise specified.Rate this question:
-
- 43.
A sequence of characters forming a
-
Pattern Expression
-
Regular expression
-
Expression parsing
-
Expression detailing
Correct Answer
A. Regular expressionExplanation
Regular expressions are a sequence of characters that define a search pattern. They are used in various programming languages and tools to match and manipulate text. Regular expressions allow for complex pattern matching, making it easier to search for specific strings or patterns within a larger text. Therefore, the given answer "Regular expression" accurately describes the sequence of characters forming a pattern expression.Rate this question:
-
- 44.
Syntax of style attribute of HTML is
-
<tagname style="property">
-
<tagname style="property:value;">
-
<style="value;">
-
<style="property;">
Correct Answer
A. <tagname style="property:value;">Explanation
The correct answer is "". This is the correct syntax for the style attribute in HTML. The style attribute is used to apply inline CSS styles to a specific HTML element. It is written as "style=" followed by the CSS property and its corresponding value, separated by a colon. Multiple properties and values can be added by separating them with a semicolon.Rate this question:
-
- 45.
Does setting margin-top and margin-bottom have an affect on an inline element?
-
NO
-
YES
Correct Answer
A. NOExplanation
Setting margin-top and margin-bottom does not have an effect on an inline element. Inline elements are formatted in a way that they do not respect top and bottom margins. Instead, they only respect left and right margins. This is because inline elements are intended to flow within a line of text and not disrupt the vertical layout. Therefore, any margin values applied to an inline element for top and bottom will not be applied.Rate this question:
-
- 46.
Does setting padding-top and padding-bottom on an inline element add to its dimensions?
-
True
-
False
Correct Answer
A. FalseExplanation
Setting padding-top and padding-bottom on an inline element does not add to its dimensions. Padding only affects the spacing inside an element, not its overall size. In the case of an inline element, the padding will create space around the content within the element, but it will not change the height or width of the element itself. Therefore, the statement is false.Rate this question:
-
- 47.
HTML: <p id="example">Hello</p> CSS: #example { margin-bottom: -5px; } What will happen to the position of #example?
-
It will move 5px downwards
-
All elements succeeding #example with move 5px upwards
-
Neither
Correct Answer
A. All elements succeeding #example with move 5px upwardsExplanation
The CSS rule "#example { margin-bottom: -5px; }" will move the position of the element with the id "example" 5px upwards. This means that all elements succeeding the element with the id "example" will also move 5px upwards.Rate this question:
-
- 48.
Browsers displays <em> tag as
-
<i>
-
<b>
-
<strong>
-
<u>
Correct Answer
A. <i>Explanation
The browser displays the tag as . The tag is used to emphasize text, and the tag is used to italicize text. Both tags visually appear the same way in most browsers, so they can be used interchangeably.Rate this question:
-
- 49.
Through which class we can make a fixed navigation bar at the top?
-
.navbar-fixed
-
.navbar-fixed-top
-
Both (A) and (B)
-
None
Correct Answer
A. .navbar-fixed-topExplanation
The correct answer is .navbar-fixed-top. This class can be used to create a fixed navigation bar at the top of the page. The "navbar-fixed-top" class is specifically designed for this purpose and can be applied to the navigation bar element to ensure that it remains fixed at the top of the page even when scrolling. The other option, .navbar-fixed, does not specifically indicate that the navigation bar should be placed at the top, so it is not the correct choice for this requirement.Rate this question:
-
Quiz Review Timeline (Updated): Mar 20, 2023 +
Our quizzes are rigorously reviewed, monitored and continuously updated by our expert board to maintain accuracy, relevance, and timeliness.
-
Current Version
-
Mar 20, 2023Quiz Edited by
ProProfs Editorial Team -
Jan 06, 2020Quiz Created by
Albertoc
Senior Front End Developer Quiz Questions And Answers
Do you want to be a senior front-end web developer, or are you already one? Here, we have a few front-end web development quiz questions and answers to check if you know how to...
Questions:
48 |
Attempts:
2752 |
Last updated:
Dec 02, 2024
|
Test On Front-end Web Development! Trivia Questions Quiz
Welcome to the trivia test On Front-end Web Development. This type of development involves producing HTML, CSS and JavaScript for a website or Web Application so that a user can...
Questions:
60 |
Attempts:
1356 |
Last updated:
Sep 16, 2024
|
Intelligent Front-End Developer Test Quiz
As a front-end web developer, you will produce a number of programming, style sheets, and scripting languages for a website or web app which users can interact directly with. Take...
Questions:
10 |
Attempts:
6342 |
Last updated:
Aug 27, 2024
|
Quiz: Aptitude Test For Web Development
Embark on a transformative journey to unravel the depths of your web development aptitude with our "Aptitude Test for Web Development" quiz. Whether you're a...
Questions:
15 |
Attempts:
1228 |
Last updated:
Nov 13, 2024
|
Online Quiz With Javascript
This online quiz assesses knowledge in web development, focusing on HTML and JavaScript. It covers topics like HTML tags, JavaScript integration, and web standards, providing a...
Questions:
10 |
Attempts:
180 |
Last updated:
Mar 17, 2022
|
Senior Front End Developer Quiz Questions And Answers
Do you want to be a senior front-end web developer, or are you already one? Here, we have a few front-end web development quiz questions and answers to check if you know how to...
Questions:
48 |
Attempts:
2752 |
Last updated:
Dec 02, 2024
|
Back to top