0% found this document useful (0 votes)

54 views

HTML-QnsAns Final

Uploaded by

vishnupavix47

Available Formats

Download as PDF, TXT or read online on Scribd

0% found this document useful (0 votes)

54 views

HTML-QnsAns Final

Uploaded by

vishnupavix47

Available Formats

Download as PDF, TXT or read online on Scribd

You are on page 1/ 71

SRINIVAS UNIVERSITY

COLLEGE OF COMPUTER SCIENCE & INFORMATION SCIENCE

CITY CAMPUS, PANDESHWAR, MANGALORE-575 001.

BACKGROUND STUDY MATERIAL

HTML VB SCRIPT & JAVA SCRIPT

B.C.A III Semester

2023
Hours: 30
Paper : 21CAC- HTML, VBScript and
IA : 50
8 JavaScript
Exam: 50
Theory/Week:3
HoursCredits:3
Course Objective:
 To train the student in understanding the Web environment.
 To develop websites using HTML and CSS
 To teach dynamic page creation using client side scripting JavaScript and
VBScript.
Course outcome:
After the Successful Completion of the course Students
will be ableCO1: To Identify the principles of web
coding and good design.
CO2: To demonstrate web page Design using HTML tags and features of CSS.
CO3: To apply examples of coding practice and dynamic web site design using
JavaScriptand VBScript.
MODULE – I 6 Hours
Introducing HTML and CSS: What is HTML is, What HTML Files Looks Like,
HTML Attributes, A Short History of HTML Standards,
.Learning the Basics of HTML : Structuring Your HTML, Organizing
information with Lists: Numbered Lists, Unordered Lists, Definition Lists, Nesting
Lists, The <img> tag, Image Backgrounds.
Working with Links: Creating Links, Linking Same Page and different pages using
Relative and Absolute Pathnames,
Building Tables: Creating Tables, Table Parts, Sizing tables, Borders and Cells,
Table and Cell color.

Methodology: Power point, Experimental Learning, Video Lecture, Chalk

and board,Problem solving through example, Hands on Teaching.
MODULE – II 6 Hours
Designing Forms: Understanding Form and Function, Using the <form> tag, Using
the
<label> tag, Creating Form Controls with the <input> tag, Using other Form Controls,
Using CSS to Style a Site: Including Style Sheets in a Page, Selectors, Using Colour,
Links,, More Selectors.
Formatting Text with HTML and CSS : Character-LevelElements, Character
Formatting Using CSS, Preformatted Text, Horizontal Rules, Line Breaks,
Addresses, Quotations, Special Characters.
Using CSS to Position Elements on the Page: Positioning Schemes, Absolute
Positioning,Fixed Positioning, Controlling Stacking, Creating Drop-Down
Menus.Displaying Updates with progress and meter,Applying Cascading Style
Sheet Properties to Form Elements.
Methodology: Power point, Experimental Learning, Video Lecture, Chalk and
board,Problem solving through example, Hands on Teaching.
MODULE – III 6 Hours
Introducing JavaScript: Why Would You Want to Use JavaScript, The
<script> tag, The
JavaScript Language: Operators and Expressions, Variables, Control Structures,
Functions,
Data Types, Arrays, Objects, The JavaScript Environment, Events.

Methodology: Power point, Experimental Learning, Video Lecture, Chalk

and board,Problem solving through example, Hands on Teaching.
MODULE – IV 6 Hours
Introduction to VBScript: Introduction to VBScript, Declaring and Using Variables,
Operators, Operator Precedence & Constants, Conditional Statements, Loops: for, while,
do..while, Procedures and Functions.

Methodology: Power point, Experimental Learning, Video Lecture, Chalk and

board,Problem solving through example, Hands on Teaching.
MODULE- V
6 Hours
Bootstrap Overview: History, Bootstrap Grid System, Mobile First Strategy, Typgraphy,
tables, Images, Jumbotron, BS Wells, BS Alerts, BS Buttons, BS Button Groups, BS
Glyphicons, BS Badges/Labels,BS Progress Bars, BS Pagination, BS Pager, BS
Dropdowns, BS Collapse, BS Tabs/Pills,Navigation Bars, Forms,BS Media
Objects,BSCrousel, BS Modal, Modal Plugin, Tooltip,,Popover, BS Scrollspy,BSAffix,BS
Grid Stacked to Horizontal.

Methodology: Power point, Experimental Learning, Video Lecture, Chalk and

board,Problem solving through example, Hands on Teaching.
UNIT 1

1) HTML stands for?

A. Hyper Text MarkupLanguage
B. High Text MarkupLanguage
C. Hyper Tabular MarkupLanguage
D. None ofthese

2) Which of the following tag is used to mark a begining of paragraph ?

A. <TD>
B. <br>
C. <P>
D. <TR>

3) From which tag descriptive list starts ?

A. <LL>
B. <DD>
C. <DL>
D. <DS>

4) Correct HTML tag for the largest heading is

A. <head>
B. <h6>
C. <heading>
D. <h1>

5) In HTML tables, gap between two cells of same table are known as.
A. Cell Spacing
B. Cell Padding
C. Cell Difference
D. None of the above

6) Markup tags tell the web browser

A. How to organize the page
B. How to display the page
C. How to display message box on page
D. None of these

7) Web pages starts with which of the following tag?

A. <Body>
B. <Title>
C. <HTML>
D. <Form>

8) Which of the following is a container?

A. <SELECT>
B. <BODY>
C. <INPUT>
D. Both (a) and(b)
9) The attribute, which define the relationship between current document and HREF'ed
URL is
A. REL
B. URL
C. REV
D. all ofthese

10) <DT> tag is designed to fit a single line of our web page but <DD> tag will accept a
A. line of text
B. full paragraph
C. word
D. request

11) Correct HTML to left align the content inside a table cell is
A. <tdleft>
B. <td raligh = "left">
C. <td align ="left">
D. <td leftalign>

12) The tag used to create a new list item and also include a hyperlink is
A. <LI>
B. <DL>
C. <DD>
D. <UL>

Understanding Level
13) How can you open a link in a new browser window?
A. < a href = "url" target ="new">
B. <a href = "url" target="_blank">
C. <a href = "url".new>
D. <a href = "url" target="open">

14) Which of the tag is used to create a number list?

A. <LI>
B. <OL>
C. <LI> and<OL>
D. None ofthese

15) What i s the correct HTML for adding a background color?

A. <background>yellow<Background>
B. <body color ="yellow">
C. <body bgcolor ="yellow">
D. <body bg ="yellow">

16) Main container for <TR>, <TD> and <TH> is

A. <TABLE>
B. <GROUP>
C. <DATA>
D. All ofthese

17) The body tag usually used after

A. Title tag
B. HEAD tag
C. EM tag
D. FORM tag

18) How can you make an e-mail link?

A. <mail href+"[email protected]">
B. <a href ="mail to:[email protected]">
C. <a href ="[email protected]">
D. Both (b) and(c)

19) Symbol used at the beginning of the HREF text is

A. #
B. $
C. &
D. ^

20) The web standard allows programmers on many different computer platforms to
dispersed format and display the information server. These programs are called
A. Web Browsers
B. HTML
C. Internet Explorer
D. None of these

21) HTML program is saved using extension.

A. .htnl
B. .htl
C. .hml
D. .html

22) What does vlink attribute mean?

A. visitedlink
B. virtuallink
C. very good link
D. activelink

23) Type of tag used for inserting an image in a web document?

A. <imp>
B. <img>
C. <src>
D. <images>

24) src attribute for an image specifies what?

A. Text for image
B. URL for an image
C. Alternate image
D. Both A & B

25) Which attribute is used with <img> tag to display the text if image could not load in
browser?
A. Description
B. Name
C. alt
D. id

Long Questions
1) What is HTML? What are the Features of HTML?
HTML is an acronym which stands for Hyper Text Markup Language.
Hyper Text: Hyper Text simply means "Text within Text". A text has a link within it,
is a hypertext. Every time when you click on a word which brings you to a new
webpage, you have clicked on a hypertext.
Markup language: A markup language is a programming language that is used make
text more interactive and dynamic. It can turn a text into images, tables, links etc.
FEATURES:
 It is a very easy and simple language. It can be easily understood and modified.
 It is very easy to make effective presentation with HTML because it has a lot of
formattingtags.
 It is a markup language so it provides a flexible way to design web pages along with
thetext.
 It facilitates programmers to add link on the web pages (by html anchor tag), so it
enhancesthe interest of browsing of the user.
 It is platform-independent because it can be displayed on any platform like
Windows,Linux and Macintosh etc.
 It facilitates the programmer to add Graphics, Videos, and Sound to the web pages
whichmakes it more attractive and interactive.

2) Explain Structure of HTML Document with an example.

The Basic structure of the HTML page is given below. It contains some elements like
head, title, body, etc.These elements are used to build the blocks of web pages.HTML is
case-insensitive
3) What is an Attribute? Explain common attributes of Tags
An attribute is a property name used to pro
provide
vide supplementary information about HTML
elements. Some common examples of HTML attributes are id, class, align, etc. Many
attributes are defined globally and are applied to any element, whereas we use some of
them only for specific HTML elements.
You cann define an attribute as the characteristics of any HTML tag that needs to be placed
within the opening tag.
HTML attributes consist of two parts:

1. a name and
2. a value
Examples:
Bgcolor RGB: it Specifies a background color for a document
Align left, right, center:- Deprecated − Specifies the alignment of the horizontal rule.

4) Explain the <html> and <head> tag with example.

<HTML> Tag
It is the root of the html document which is used to specify that the document is
html. This tag tells the browser that this is an HTML document.

The <HTML> tag is the container for all other HTML elements (except for the
<!DOCTYPE> tag). Practically <HTML> is the first tag in an HTML page and
</HTML> is the last tag.
<HEAD> Tag
It contains the head of an HTML document, which holds informa
information
tion about the document
such as its title. Once we opened this tag then we must close it as </HEAD>.
Eg:
<html>
<head>
<title> welcome </title>
</head>
<body>
<h1>The example</h1>
<p> welcome to HTML </p>
</body>
</html>

5) Explain <body> tag with its attributes.

<BODY> Tag
The HTML <BODY> tag is used for indicating the main
content section of the HTML document. This tag defines
the document's body. It contains all the contents of an
HTML document such as text, hyperlinks, images, tables,
lists, etc.
<BODY> tag is opened, it must be closed </BODY> before the closing of
</HTML> tag.

6) How do you create list in HTML? Explain with example.

HTML offers web authors three ways for specifying lists of information. All lists must
contain one or more list elements. Lists may contain
1. <UL> − An unordered list. This will list items using plain bullets.
2. <OL> − An ordered list. This will use different schemes of numbers to list your
items.
3. <DL> − A definition list. This arranges your items in the same way as they
are arranged in a dictionary.
Ex: <UL type=circle>
<LI>Coffee</LI>
<LI>Tea</LI>
<LI>Milk</LI>
</UL>
<OL type=”1”>
<LI>Coffee</LI>
<LI>Tea</LI>
<LI>Milk</LI>
</OL>
<DL>
<DT>Coffee</DT>
<DD>- black hot drink</DD>
<DT>Milk</D<DT> Milk </DT>
<DD>- white cold drink</DD>
</DL>

7) Explain how to work with images in HTML. Explain with example.

Images are very important to beautify as well as to depict many concepts on your web
page.. This is done in HTML using the <img> element
Syntax:
<img src="image URL" attr_name="attr_value"...more attributes >

Attributes of <img> tag:

Following are the attributes for <img> tag.

 width: sets width of the image. This will have a value like 10 or20%etc.
 height: sets height of the image. This will have a value like 10 or 20%etc.
 border: sets a border around the image. This will have a value like 1 or 2etc.
 src: specifies URL of the image file.
alt: this is an alternate text which will be displayed if image is missing.
 align: this lets horizontal alignment of the image and takes value either left, right or
center.
 name: name of the image with in the document.
 id: id of the image with in the document.
 style: this will be used if you are using CSS.
 title: specifies a text title. The browser, perhaps flashing the title when the mouse
passes over the link.

Example:
<html>
<body>
<img src="C:\Users\Public\Pictures\Sample Pictures\Tulips.jpg"
width="100" height="100" alt="Flower" border="5"
align="center" >
</body>
</ht

ml>
8) How do you create Hyperlink in HTML. Explain with example
The <A> tag defines a hyperlink, which is used to link from one page to another.
The most important attribute of the <A> element is the href attribute, which
indicates the link's destination.
By default, links will appear as follows in all browsers:
An unvisited link is underlined and blue
A visited link is underlined and purple
An active link is underlined and red
Ex: <a href="https://www.w3schools.com">Visit W3Schools.com!</a>

9) How to define table and what are the different attributes associate with it
with example explain.
An HTML table is defined with the <TABLE> tag. Each table row is defined
with the <TR>tag. A table header is defined with the <TH> tag. By default, table
headings are bold and centered. A table data/cell is defined with the <TD>tag.

<TH> Tag
The <TH> tag defines a header cell in an HTML table.

An HTML table has two kinds of cells:

 Header cells - contains header information (created with the <TH> element)
 Standard cells - contains data (created with the <TD>

element) the text in <TH> elements is bold and centered by

default.

 The <TR> tag defines a row in an HTML table.

 A <TR> element contains one or more <TH> or <TD> elements.

<TD> Tag
The <TD> tag defines a standard cell in an HTML table.An HTML table has two
kinds of cells:
 Header cells - contains header information (created with the <TH> element)
 Standard cells - contains data (created with the <TD> element)The text in
<TH> elements is bold and centered by default. The text in <TD> elements
is regular and left-aligned by default.

10) Explain how to merge rows and columns in table HTML with example.
To merge table columns in HTML use the colspan attribute in <td> tag. With this, merge cells with each other
<!DOCTYPE html>
<html>

<h1 style="color:green;">
welcome
</h1>

<h2>How to merge table cells in HTML?</h2>

<table align="center">
<tr>
<th>Name</th>
<th>Age</th>
</tr>
<tr>
<td>Akku</td>
<td rowspan="2">44</td>
</tr>
<tr>
<td>fahad</td>
</tr>
</table>
</body>
</html>
11. Explain Absolute and Relative URL with example.

Linking Same Page and different pages using Relative and

Absolute Pathname
Absolute URLs vs. Relative URLs
· absolute URL (a full web address) in the href attribute.
· A local link (a link to a page within the same website) is specified with a relative
URL (without the "https://www" part)
Eg:
<h2>Absolute URLs</h2>
<p><a href="https://www.w3.org/">W3C</a></p>
<p><a href="https://www.google.com/">Google</a></p>

<h2>Relative URLs</h2>
<p><a href="html_images.asp">HTML Images</a></p>
<p><a href="/css/default.asp">CSS Tutorial</a></p>

12. Explain preformatted text tag and Horizontal

tags with example.
The <pre> tag defines preformatted text.
Text in a <pre> element is displayed in a fixed-width font, and the text preserves both spaces
and line breaks. The text will be displayed exactly as written in the HTML source code.
<hr> tag is used to draw a horizontal rule.
Eg:
<!DOCTYPE html>
<html>
<body>

<h1>The pre element</h1>

<pre>
Text in a pre element
is displayed in a fixed-width
font, and it preserves
both spaces and
line breaks
</pre>
<hr>
</body>
</html>
UNIT II
1. Which one of the following is a form element?

A. text box.
B. radio button.
C. submit button.
D. All of these.

2. Which of the following tag is used for drop down list?

A. <select>
B. <text>
C. <textarea>
D. <dropdown>
3. Which HTML element is used to define multi-line input field?
A. <textarea>
B. <text>
C. <blockarea>
D. <textfields>
4. For defining a submit button which tag is used?
A. <button>
B. <submit button>
C. <submit>
D. <action submit>
5. When form data contains sensitive or personal information then which
method is more preferable?
A. Get method
B. Post method
C. Host method
D. Put method
6. In HTML form <input type=”text”> is used for?
A. One line text
B. Block of text
C. Paragraph
D. None
7. For creating a drop down list in HTML forms which element is suitable?
A. <list>
B. <dropdown>
C. <select>
D. All of the above
8. A ----------- tag defines a scale for the measurement of data within a
specified range.
A. Meter tag
B. Progress tag
C. Measure
D. Pre
9. <legend> is used to assign a caption to a set of form fields as defined by a
……………. element.
A) fieldset
B) caption
C) fieldgroup
D) assign
10. What is the default type of ‘type’ attribute of <input> element?
A. Text
B. Password
C. Numerals
D. Special Characters
11.Which attribute defines the file-select field?
A. file
B. checkbox
C. button
D. text
12.Which of the following is not used with password attribute?
A. name
B. size
C. maxlength
D. min
13.Which attribute is not used for the radio type?
A. name
B. value
C. checked
D. selected
14.Which attribute is used with <select> element?
A. multiple
B. selected
C. name
D. value
15. What is the purpose of HTML forms?
A. To display the content of an email.
B. To display animation effect.
C. To collect user input.
D. None of the above
The default value for the “position” attribute is _________.
A. fixed
B. absolute
C. inherit
D. relative
16.Choose the correct option
A. All of these
B. HTML form elements are defined inside form tag
C. HTML form elements are used for taking user input
D. HTML form elements can be of different types
17.Default method while submitting a form is
A. Set method
B. Post method
C. Get method
D. Put method
18.Action attribute in HTML forms specifies that
A. Which HTTP method is used
B. Where to submit form
C. Which action is going on
D. The auto completion
19.What is the default type of ‘type’ attribute of <input> element?
A. Special characters
B. Password
C. Numerals
D. Text
20.Which tag is used for grouping form controls?
A. <select>
B. <legend>
C. <label>
D. <fieldset>
21.How more than one option can be selected in drop down?

A. Use of multiple attribute inside <option> tag.

B. Use of multiple attribute inside <select> tag.
C. use of multiple attribute inside <text> tag.
D. It is not possible to select more than one option in drop down.

22.Which of the following CSS property adds padding to the top of an

element?
A. padding-top
B. padding-height
C. top
D. padding-left

23.Which of the following property sets the amount of spacing between

letters?
A. Space
B. line-height
C. letter-spacing
D. none of the mentioned

24.Which of the following measurement defines a measurement as a

percentage?
A. %
B. Cm
C. Em
D. in

25.Which of the following property sets the font size of text

A. text-size
B. font-size
C. size
D. text
Long Answers

1. Explain CSS fixed Positioning with suitable example.

Fixed: Any HTML element with position: fixed property will be positioned
relative to the viewport. An element with fixed positioning allows it to remain
at the same position even we scroll the page. We can set the position of the
element using the top, right, bottom, left.
When we position an element as Fixed, it always relative to its browser
window only. Additionally, it will not scroll with the document.
<html>
<head>
<style>
div.first {
border:5px solid #4FFFA1; width:200px;
}
div.second {
width:200px;
border:5px solid #CCCCCC;
}
div.third {
position: fixed; top: 0px; right:0px;
width:200px;
border:5px solid #ee3e64;
}
</style>
</head>
<body>
<divclass=”first”>
One<br> Two<br>Thre<br> Four<br> Five<br>
</div>
<div class=”second”>
Six<br> Seven<br>
Eight<br> Nine<br>
Ten<br>
</div>
<div class=”third”>Fix Here</div>
</body>
</html>

2. Explain CSS absolute Positioning with suitable example.

Absolute: An element with position: absolute will be positioned with respect to
its parent. The positioning of this element does not depend upon its siblings or
the elements which are at the same level.
When we position an element as Absolute, that element is is completely
removed from the document`s normal flow. In Absolute position, the position is
set through some combination of left, right, top and bottom properties.
<html>
<head>
<style>
kcdiv.first {
border:5px solid #4FFFA1; width:200px;
}
div.second {
width:200px;
border:5px solid #CCCCCC;
}
div.third {
position: absolute; top: 10px;
right:10px; width:200px;
border:5px solid #ee3e64;
}
</style>
</head>
<body>
<div class=”first”>First Div</div>
<div class=”second”>Second Div</div>
<div class=”third”>Third Div</div>

</body>
</html>

3. What is text input control? Explain its types.

Text Input Controls:
There are actually three types of text input used on forms:
· Single-line text input controls: Used for items that require only one
line of user input, such as search boxes or names. They are created using the
<input>element.
· Password input controls: <input> elements of type password provide
a way for the user to securely enter a password. The element is presented as a
one-line plain text editor control in which the text is obscured so that it cannot be
read,
· Multi-line text input controls: Used when the user is required to
give details that may be longer than a single sentence. Multi-line input controls
are created with the <textarea> element.

Single-line text input controls:

Single-line text input controls are created using an <input> element whose type
attribute has a value of text.

4. Explain buttons in html form with example ?

Button: This creates a button that is used to trigger a client-side script when the
user clicks that button.
Example:
<html>
<body>
<form action="http://www.example.com/test.asp" method="get">
<input type="submit" name="Submit" value="Submit" />
<br /><br />
<input type="reset" value="Reset" />
<input type="button" value="Button"/>
</form>
</body>
</html>

5. Explain the difference between checkbox and radio buttons?

Checkboxes are used when more than one option is required to be selected.
They are created using <input> tag as shown below.
Following is the list of important checkbox attributes:
· type: Indicates that you want to create acheckbox.
· name: Name of the control.
· value: The value that will be used if the checkbox is selected. More
than one checkbox should share the same name only if you want to allow users
to select several items from the same list.
· checked: Indicates that when the page loads, the checkbox should
beselected.

Radio Buttons are used when only one option is required to be selected. They are
created using
<input> tag as illustrated below.
Following is the list of important radiobox attributes:
· type: Indicates that you want to create a radiobox.
· name: Name of the control.
· value: Used to indicate the value that will be sent to the server if this
option isselected.
checked: Indicates that this option should be selected by default

6. Explain progress and meter tag?

Progress tag
This tag is used to represent a progress bar on the webpage in order to show the
progress of a task. Some uses of the progress bar include showing the file
upload/download progress on a website. The progress bar is created using the
following syntax.
<progress>....</progress>
The progress tag can also be styled using
Attributes: This tag accepts two attributes as mentioned below.
· max: It represents the total work is to be done for completing a task.
· value: It represents the amount of work that is already completed.

<!DOCTYPE html>
<html lang="en">
<head>
<title>Progress tag</title>
</head>
<body>
<p>Normal Progress bar</p>
<progress></progress>
<p>Progress bar with max and value attributes</p>
<progress value="50" max="200"></progress>
<p>Progress bar with CSS</p>
<progress style="width:200px; height:40px;" ></progress>
</body>
</html>
Meter tag
A Meter tag is also known as a gauge and basically defines a scale for the
measurement of data within a specified range. The uses of a meter tag may
include the fuel left in the tank, the temperature of an object, etc. The meter tag is
written as follows.
Syntax:

<meter>....</meter>
Attributes: This tag accepts many attributes which are listed below.
· form: It defines one or more forms that the meter tag belongs to.
· max: It is used to specify the maximum value of a range.
· min: It is used to specify the minimum value of a range.
· high: It is used to specify the range considered to be a high value.
· low: It is used to specify the range value that is considered to below.
· optimum: It is used to specify the optimum value for the range.
· value: It is used to specify the required or actual value of the range.
<!DOCTYPE html>
<html lang="en">
<head>
<title>Meter tag</title>
</head>
<body>
<p>Normal Meter</p>
<meter value="0.6"></meter>
<p>Meter tag with attributes</p>
<meter value="50" max="200" min="20"></meter>
<p>Meter tag with CSS</p>
<meter value="0.4" style="width:200px; height:40px;"></meter>
</body>
</html>

7. Explain with example what is <pre> tag

The <pre> tag defines preformatted text.
Text in a <pre> element is displayed in a fixed-width font, and the text preserves both spaces
and line breaks. The text will be displayed exactly as written in the HTML source code.
Eg:
<!DOCTYPE html>
<html>
<body>

<h1>The pre element</h1>

<pre>
Text in a pre element
is displayed in a fixed-width
font, and it preserves
both spaces and
line breaks
</pre>
</body>
</html>

8. What is form tag? List out various form controls

<FORM> Tag

The HTML <FORM> element defines a form that is used to collect user
input:

Form elements are different types of input elements,

There are different types of form controls that you can use to collect data from a
visitor to your site.
Text inputcontrols
Buttons
Checkboxes and radiobuttons
Selectboxes
File selectboxes
Hidden controls
Submit and reset button

9. Explain Universal and Grouping selectors with example?

The CSS Universal Selector
The universal selector (*) selects all HTML elements on the page.
Eg:
*{
text-align: center;
color: blue;
}
<!DOCTYPE html>
<html>
<head>
<style>
*{
text-align: center;
color: blue;
}
</style>
</head>
<body>

<h1>Hello world!</h1>

<p>Every element on the page will be affected by the style.</p>

</body>
</html>
The CSS Grouping Selector
The grouping selector selects all the HTML elements with the same style definitions.
Look at the following CSS code (the h1, h2, and p elements have the same style definitions)
h1 {
text-align: center;
color: red;
}

h2 {
text-align: center;
color: red;
}

p{
text-align: center;
color: red;
}
It will be better to group the selectors, to minimize the code.
To group selectors, separate each selector with a comma.
h1, h2, p {
text-align: center;
color: red;
}

10.Explain with example what is select box control?

Select box Control:
Drop Down Box is used when we have many options available to be selected but only one
or two will be selected.
Following is the list of important attributes of <select>:
 name: This is the name for the control.
 size: This can be used to present a scrolling listbox.
 multiple: If set to "multiple" then allows a user to select multiple items from
themenu. Following is the list of important attributes of<option>:
 value: The value that is sent to the server if this option isselected.
 selected: Specifies that this option should be the initially selected value when the
page loads.
 label: An alternative way of labeling options.

Example:
<html>
<body>
<form action="/cgi-bin/dropdown.cgi" method="post">
<select name="dropdown">
<option value="Maths" selected>Maths</option>
<option value="Physics">Physics</option>
<option value="Chemistry">Chemistry</option>
</select>
<input type="submit" value="Submit" />
</form>
</body>
</html>

11.Explain various methods to include style sheets in a page?

CSS can be added to HTML in the following ways:
§ Inline - using the style attribute in HTML elements

Example:
<html>
<body style="background-color:yellow;">
<h2 style="background-color:red;">This is a heading</h2>
<p style="background-color:green;">This is a paragraph.</p>
</body>
</html>

§ Internal - using the <style>element in the <head> section

<html>
<head>
<style>
body {
background-color:pink;
}
p{
color:blue;
}

</style>
</head>
<body>
I am Jahnavi. This is Internal Style sheet
<p> Cascading Style Sheets </p>
</body>

</html>

§ External - using an external CSS file

Example:
/* This is an external style sheet file. Save this file as
mystyle.css*/ hr

{
color: yellow;
}

h2
{
color: red;
text-align: left; font-size: 8pt;

12.Explain Horizontal rules with custom CSS code?

By default, the hr tag is just a thin straight line. It doesn’t possess any special properties, but
you can make it look more appealing with some custom CSS code.
The hr HTML tag represents a break between paragraphs and looks like a straight line. It has
a display: block property by default which means the element will span the full width of
the container.

That being said you’ll need to write custom CSS in order to change its appearance. The
default styling for the hr tag is pretty much similar across different browsers and consists of
CSS rules that style the border of the element.

hr {
border-style: inset;
border-width: 1px;
}

Styling Horizontal rule using border

One of the ways you can modify the appearance of the horizontal rule element is to change
the border CSS rule, which includes the border-style, border-width, border-
color and border-radius properties.

You can do that in just one line of CSS:

hr {

border: 1px dashed cornflowerblue;

}
UNIT 3
Understanding Level
1. Javascriptis language.
A. Programming
B. Application
C. None ofThese
D. Scripting

2. JavaScript is Side Scripting Language.

A. Server
B. ISP
C. None ofThese
D. Browser

3. JavaScript is designed for the following purpose-

A. To Style HTMLPages
B. To add interactivity to HTMLPages.
C. To Perform Server Side ScriptingOperation
D. To Execute Query Related to DB onServer

4. JavaScript is can be written-

A. directly into JS file and included intoHTML
B. None ofthese
C. directly on the ServerScript
D. directly into HTMLpages

5. JavaScript Code is
written inside filehavingextension .
A. .jvs
B. .javascript
C. .js
D. .jsc

6. State the correct place of JS Code inside HTML-

A. Inside Body
B. Inside Head
C. Inside Single Java Script File
D. All of these

7. ............................................. The href property of the object is a string that

contains the complete text of the
URL.
A. location
B. pathname
C. port
D. search

8. .............................................................. JavaScript code can register by assigning a

function to a property of an
element object that represents an HTML document in the document.
A. Event handler
B. Function handler
C. Document handler
D. HTML handler

9. ........................... A mostly used to take users choice on any option and displays
adialog
box with two buttons Ok and Cancel.
A. Alert dialogbox
B. Information dialogbox
C. Prompt dialogbox
D. Confirmation dialogbox

10. JavaScript is also called client-side JavaScript.

A. Microsoft
B. Navigator
C. LiveWire
D. Native

11. What are variables used in JavaScript Programs?

A. Storing numbers, dates, or other values
B. Varying randomly
C. Causing high-school algebra flashbacks
D. None of the above

12. JavaScript statements embedded in an HTML page can respond to user events
such as mouse-clicks, form input, and page navigation.
A. Client-side
B. Server-side
C. Local
D. Native

Application Level
13. Which of the following can't be done with client-side JavaScript?
A. Validating a form
B. Sending a form's contents by email
C. Storing the form's contents to a database file on the server
D. None of the above

14. Which of the following are capabilities of functions in JavaScript?

A. Return a value
B. Accept parameters and Return a value
C. Accept parameters
D. None of the above

15. Which of the following attribute can hold the JavaScript version?
A. LANGUAGE
B. SCRIPT
C. VERSION
D. None of the above

16. What is the correct JavaScript syntax to write "HelloWorld"?

A. System.out.println("HelloWorld")
B. println ("HelloWorld")
C. document.write("HelloWorld")
D. response.write("HelloWorld")

17. Inside which HTML element do we put theJavaScript?

A. <js>
B. <scripting>
C. <script>
D. <javascript>

18. What is the correct syntax for referring to an external script called "abc.js"?
A. <script href="abc.js">
B. <script name="abc.js">
C. <script src="abc.js">
D. None of the above

19. Which is the correct way to write a JavaScript array?

A. var txt = newArray(1:"tim",2:"kim",3:"jim")
B. var txt = newArray:1=("tim")2=("kim")3=("jim")
C. var txt = newArray("tim","kim","jim")
D. var txt = newArray="tim","kim","jim"

20. What does the <noscript> tagdo?

A. Enclose text to be displayed by non-JavaScript browsers.
B. Prevents scripts on the page from executing.
C. Describes certain low-budget movies.
D. None of the above

21. Which of the following event fires when the form element loses the focus:<button>,
<input>, <label>, <select>, <textarea>?
A. onfocus
B. onblur
C. onclick
D. ondblclick

22. method evaluates a string of JavaScript code in the context of the specified object.
A. Eval
B. ParseInt
C. ParseFloat
D. Efloat

23.Using________statement is how you test for a specific condition.

A. Select
B. If
C. Switch
D. For
24. Which of the following is the structure of an if statement?
A. if (conditional expression is true) then execute this code endif
B. if (conditional expression is true)execute this code endif
C. if (conditional expression is true) {then execute thiscode>->}
D. if (conditional expression is true) then {execute thiscode}

25. The method of an Array object adds and/or removes elements from an array.
A. Reverse
B. Shift
C. Slice
D. Splice
Long Questions

1. What is JavaScript? What can JavaScript do?

 JavaScript("JS" for short) is a full-fledged dynamic programming language that, when
applied to anHTMLdocument, can provide dynamic interactivity on websites. It was
invented by Brendan Eich, co-founder of the Mozilla project, the Mozilla Foundation, and
the MozillaCorporation.
 JavaScript is incredibly versatile. You can start small, with carousels, image galleries,
fluctuating layouts, and responses to button clicks. With more experience, you'll be able to
create games, animated 2D and 3D graphics, comprehensive database-driven apps, and much
more!
 JavaScript itself is fairly compact yet very flexible. Developers have written a large
variety of tools on top of the core JavaScript language, unlocking a vast amount of extra
functionality with minimumeffort.
 JavaScript was designed to add interactivity to HTMLpages
 JavaScript is a scriptinglanguage
 A scripting language is a lightweight programminglanguage
 JavaScript is usually embedded directly into HTMLpages
 JavaScript is an interpreted language (means that scripts execute withoutpreliminary
compilation)
 Everyone can use JavaScript without purchasing alicense

JavaScriptcan do the following things:

• JavaScript gives HTML designers a programming tool - HTML authors are normally not
programmers, but JavaScript is a scripting language with a very simple syntax! Almost anyone
can put small "snippets" of code into their HTMLpages.
• JavaScript can react to events - A JavaScript can be set to execute when something
happens, like when a page has finished loading or when a user clicks on an HTMLelement
• JavaScript can read and write HTML elements - A JavaScript can read and change the
content of an HTMLelement
• JavaScript can be used to validate data - A JavaScript can be used to validate form data
before it is submitted to a server. This saves the server from extraprocessing
• JavaScript can be used to detect the visitor's browser - A JavaScript can be used to
detect the visitor's browser, and - depending on the browser - load another page specifically
designed for thatbrowser
• JavaScript can be used to create cookies - A JavaScript can be used to store and retrieve
information on the visitor'scomputer

2. What is variable? How to declare the variable in JavaScript? What are the
variable naming conventions?
JavaScript variables are containers for storing data values. Each variable is given a name so
that you can refer to it elsewhere in your code.
Declaring a variable in JavaScript:
<html>
<body>
<h2>JavaScript Variables</h2>
<p>In this example, x, y, and z are variables.</p>
<p id="demo"></p>
<script>
var x = 5;
var y = 6;
var z = x + y;
document.getElementById("demo").innerHTML =
"The value of z is: " + z;
</script>
</body>
</html>

OUTPUT:
JavaScript Variables
In this example, x, y, and z are variables.
The value of z is: 11

Variable names must follow certain rules.

 Variable names cannot contain spaces.
 Variable names must begin with a letter, an underscore (_) or a dollar sign ($).
 Variable names can only contain letters, numbers, underscores, or dollar signs.
 Variable names are case-sensitive

3. Explain different types of datatypes in JavaScript

Numerical Data
Numerical data comes in two forms:
 Whole numbers, such as 145, which are also known as integers.
 These numbers can be positive or negative and can span a very wide range: –253 to253.
 Fractional numbers, such as 1.234, which are also known as floating-point
numbers.Like integers, they can be positive or negative, and they also have a
massiverange.

Text Data
Another term for one or more characters of text is a string.
We tell JavaScript that text is to be treated as text and not as code simply by enclosing it
inside quote marks ("). For example, "Hello World" and "A" are examples of strings that
JavaScript will recognize. You can also use the single quote marks (')
Boolean Data
 The use of yes or no, positive or negative, and true or false is commonplace in the "real"
world.
 The idea of true and false is also fundamental to digital computers; they don't
understand maybes, only true and false. In fact, the concept of "yes or no" is so useful it has
its own data type in JavaScript: the Boolean data type.
 The Boolean type has two possible values: true for yes and false for no.

4. Explain different decision making statements in JavaScript.

if statement - use this statement to execute some code only if a specified conditionis true
if...else statement - use this statement to execute some code if the condition is trueand
another code if the condition isfalse
if...elseif. ........... else statement - use this statement to select one of many blocks of codeto be
executed
switch statement - use this statement to select one of many blocks of code tobe
executed

JavaScript If Statement Syntax

There are two major parts to an If Statement: the conditional statement and the code to be
executed.
The conditional statement is a statement that will evaluate to be either True or False. The
most common type of conditional statement used checks to see if something equals a value.
An example would be checking if a date equals your birthday.
<script
type="text/javascript">Var
my Num = 7;

if(myNum == 7){
document.write("Lucky 7!");
}
</script>

JavaScript If Statement: Else

If. elseStatement
Usethe if. else statement to execute some code if a condition is true and another code ifthe
condition is not true.

The Else clause is executed when the conditional statement is False.

if(myNum ==7){
document.write("Lucky 7!");
}else{
document.write("You're not very lucky today...");
}
</script>
If...else if...else Statement
Use the if....else if...else statement to select one of several blocks of code to be executed.
Syntax
if (condition1)
{
code to be executed if condition1 is true
}
else if (condition2)
{
code to be executed if condition2 is true
}
else
{
code to be executed if neither condition1 nor condition2 is true
}
Example
If the time is less than 10:00, you will get a "Good morning" greeting, if not, but the time
is less than 20:00, you will get a "Good day" greeting, otherwise you will get a
"Goodevening" greeting:
if (time<10)
{
x="Good morning";
}
else if(time<20)
{
x="Goodday";
}
else
{
x="Good evening";
}
The result of x will be:
Good day
The switch statement is used to perform different action based on different conditions.
The JavaScript Switch Statement
Use the switch statement to select one of many blocks of code to be executed.
Syntax
switch(n)
{
case 1:
execute code block 1
brea
k;
case
2:
execute code block 2
brea
k;
defa
ult:
code to be executed if n is different from case 1 and 2
}
This is how it works: First we have a single expression n (most often a variable), that is
evaluated once. The value of the expression is then compared with the values for each case
in the structure. If there is a match, the block of code associated with that case is executed.
Use break to prevent the code from running into the next case automatically.
Example
Display today's weekday-name. Note that Sunday=0, Monday=1, Tuesday=2,
etc: var day=new Date().getDay();
switch (day)
{
case 0:
x="Today
it'sSunday"; break;
case1:
x="Today it's
Monday"; break;
case2:
x="Today it's
Tuesday"; break;
case 3:
x="Today it'sWednesday";
break;
case4:
x="Today it's
Thursday"; break;
case5:
x="Today it's
Friday"; break;
case 6:
x="Today it's
Saturday"; break;
}
The result of x will be:
Today it's Tuesday
The default Keyword
Use the default keyword to specify what to do if there is no match:

5. Explain switch statement in JavaScript with example

The JavaScript Switch Statement
Use the switch statement to select one of many blocks of code to be executed.
Syntax
switch(n)
{
case 1:
execute code block 1
brea
k;
case
2:
execute code block 2
brea
k;
defa
ult:
code to be executed if n is different from case 1 and 2
}
This is how it works: First we have a single expression n (most often a variable), that is
evaluated once. The value of the expression is then compared with the values for each case
in the structure. If there is a match, the block of code associated with that case is executed.
Use break to prevent the code from running into the next case automatically.
Example
Display today's weekday-name. Note that Sunday=0, Monday=1, Tuesday=2,
etc: var day=new Date().getDay();
switch (day)
{
case 0:
x="Today
it'sSunday"; break;
case1:
x="Today it's
Monday"; break;
case2:
x="Today it's
Tuesday"; break;
case 3:
x="Today it'sWednesday";
break;
case4:
x="Today it's
Thursday"; break;
case5:
x="Today it's
Friday"; break;
case 6:
x="Today it's
Saturday"; break;
}
The result of x will be:
Today it's Tuesday
The default Keyword
Use the default keyword to specify what to do if there is no match:

6. Explain while loop statement in JavaScript

The while loop loops through a block of code as long as a specified condition is true.
There are two key parts to a JavaScript while loop:
1. The conditional statement which must be True for the while loop's code to beexecuted.
2. The while loop's code that is contained in curly braces "{ and }" will be executed ifthe
condition isTrue.
Syntax
while (condition) {
// code block to be executed
}

Example:
<html>
<body>
<h2>JavaScript While Loop</h2>
<p id="demo"></p>

Output:
JavaScript While Loop

The number is 0
The number is 1
The number is 2
The number is 3
The number is 4

7. Explain how to declare and access array object in JavaScript with example.
Arrays are special memory locations because it can hold more than one
value at a time, and you can access these values individually.
Example:
varmyVar = 10; //Variable Declaration
varmyVarArray = new Array(); //Array Declaration

varmyVarArray = new Array(10);

The above array declaration creating an Array using the Constructor, that holds 10 undefined
elements. Similarly, you can directly initialize the Array elements when declaring an Array
Object.
varweekArray = new Array("Sunday","Monday","Tuesday");
Arrays are a group of data items that you can treat as a single unit. It is helpful when you
want to store a group of values in the same variable instead of using separate variables for
each value. Like other programming languages, JavaScript array indexes start from 0 (zero)
and continue as 1,2,3 etc..
varweekArray = new Array();
myArray[0]"Sunday"; myArray[1] =
"Monday"; myArray[2] = "Tuesday";
myArray[3] = "Wednesday; myArray[4=
"Thursday"; myArray[5] = "Friday";
myArray[6] = "Saturday";

8. Explain any 4 different JavaScript array object with example.

The Array object is used to store multiple values in a single variable:
<script>
const cars = ["Saab", "Volvo", "BMW"];
document.getElementById("demo").innerHTML = cars;
</script>
Array.push()
The array.push() in Javascript add new elements to the end of an Array and changes the
length of the array.

var colors = ["Red", "Green", "Blue"]; colors.push("Yellow")

alert(colors.toString());
The above code will return Red, Green, Blue , Yellow, that is Yellow added at the end of the
Array
Array.contains()
The Array.Contains() method checking whether or not an item is contained within your array.

varweekArray = new
Array("Sunday","Monday","Tuesday"); if
(weekArray.contains('Sunday')) {
// write your code here
}
Array.sort
JavascriptArray.sort() method sort the elements in an Array either Alphabetic or Numeric,
also you can sort ascending or descending. The default sort order is alphabetic and
ascending.
Alphabetical Order

varweekArray = new
Array("Sunday","Monday","Tuesday"); weekArray.sort();
The array order will be...Monday, Sunday, Tuesday

weekArray.reverse();
The array order will be...Tuesday, Sunday, Monday
Numerical Order
varnumArray = [80,30,50,40];
numArray.sort()
The array order will be..30, 40, 50,
80 numArray.reverse();
The array order will be..80, 50, 40, 30
Array.splice()
The splice() method in Javascript add new elements to the Array and removing old elements
from Array.
var colors = ["Red", "Blue", "Green"];
colors.splice(2,0,"Yellow","Orange");
colors.splice(2,0,"Yellow","Orange") means that add new elements at the array index 2 and
removed 0 elements.
The array order will be ...Red, Blue, Yellow, Orange, Green
Array.slice()
The slice() method in Javascript retrieve the elements starting at the first argument, and ends at
second argument-1.
var colors = ["Red", "Blue", "Green", "Yellow","Orange"];
varselectedColors = colors.slice(1, 3);
The selectedColors are...Blue,Green.
colors.slice(1, 3) select 1 to 3-1 elements from colors.
Array.join()
The join() method in Javascript will be separated by a specified separator with given
argument. var colors = ["Red", "Blue", "Green"];
alert(colors.join('#'));
The result will be
Red#Blue#Greenalert(colors.join
(''));
The result will be RedBlueGreen

9. What is a function? How to define and call function in JavaScript with example.
Javascript functions are considered as first-class objects, because they can be manipulated
like any other object in the language. Javascript functions can have properties and methods,
also it can be passed as arguments
Each function in your JavaScript must be addressing it by a unique name for that particular
page. Always use meaningful function names, so that when you see it being used later in
your programming code. Function names are case sensitive, that is a function name "callMe"
is not same as "callme"
Function Declarations:
Syntax:
functionfunctionName(parameters (optional))
{
FunctionBody
}
The parameter is optional, you can write function without any
parameters. E.g.
Function without arguments

function greetings()
{
alert("Good morning");
}
Function with arguments

functionfindSum(a,b)
{
alert("Sum is : " + (a + b));
}
Calling a Function:
You can call Javascript functions by simply call the function name.

function greetings()
{
alert("Good Morning");
}
greetings(); //just give the function name only When you
run the above code, it will alert "Good Morning".

Function Arguments (Function parameters)

In javascript you can pass pass any number of arguments while calling a function, no matter
how many of them are listed. The parameters you pass to the function will captured inside
the function and any manipulation can be done over those arguments. A function can take
any number of arguments separated by a comma delimiter
Syntax:

functionfunctionName(parameter1, parameter2, parameter3)

{
FunctionBody
}
Function with one argument

10. Explain Alert Box and Confirmation Box with syntax and example.
Alert Box
An alert box is often used if you want to make sure information comes through to the user.
When to Use Popups / Alerts
JavaScript alerts are ideal for the following situations:
 If you want to be absolutely sure they see a message before doing anything onthe
website.
 You would like to warn the user about something. For example "the followingpage
contains humor not suitable for those under the age of14."
 An error has occurred and you want to inform the user of theproblem.
 When asking users for confirmation of some action. For example, if they have just
agreed to sign over the deed to their house and you want to ask them again if they are
absolutely positive they want to go through with thisdecision!

When an alert box pops up, the user will have to click "OK" to proceed.
Syntax
alert("sometext");
Example
<html>
<head>
<script>
functionmyFunction()
{
alert("I am an alert box!");
</script>
</head>
<body>
<input type="button" onclick="myFunction()" value="Show alert box" />

</body>
</html>

Confirm Box
A confirm box is often used if you want the user to verify or accept something.
When a confirm box pops up, the user will have to click either "OK" or "Cancel" to proceed.
The JavaScript confirm function is very similar to the JavaScript alert function. A small
dialogue box pops up and appears in front of the web page currently in focus. The confirm
box is different from the alert box. It supplies the user with a choice; they can either press
OK to confirm the popup's message or they can press cancel and not agree to the popup's
request.
If the user clicks "OK", the box returns true. If the user clicks "Cancel", the box returns false.
Syntax
confirm("sometext");
Example
<html>
<head>
<script
type="text/javascript">funct
ion confirmation() {
var answer = confirm("Leave the document") if
(answer){
alert("Bye bye!")

}
else{
alert("Thanks for sticking around!")
}
}
</script>
</head>
<body>
<form>
<input type="button" onclick="confirmation()" value="Leave document">
</form>
</body>
</html>

11. Explain how to work with prompt box with suitable example.
Prompt Box
A prompt box is often used if you want the user to input a value before entering a page.
When a prompt box pops up, the user will have to click either "OK" or "Cancel" to proceed
after entering an input value.
If the user clicks "OK" the box returns the input value. If the user clicks "Cancel" the box
returns null.
Syntax
prompt("sometext","defaultvalue");
Example
var name=prompt("Please enter your name","Harry
Potter"); if (name!=null && name!="")
{
x="Hello " + name + "! How are you today?";
}

12. How to work with onmouseover and onmouseout events withexample.

The onmouseover and onmouseout events can be used to trigger a function when the user
mouses over, or out of, an HTML element.
OnMouseOver, as the name suggests, will execute the code when the mouse passes over the
link. The onMouseOver will execute a piece of code when the mouse moves away from the
link. They are used in exactly the same way as onClick.
The onmouseout event occurs when the mouse pointer is moved out of an element, or out of
one of its children.
EXAMPLE
<html>
<head>
<script
type="text/javascript">
function popup() {
alert("Hello World")
}
</script></head>
<input type="button" value="Click Me!" onclick="popup()" onmouseover=""
onMouseout="popup()"><br/>
</body>
</html>
UNIT 4
Application Level
1. Which browser has built-in support for executing VBScript?
A. Internet Explorer
B. Mozilla Firefox
C. Opera
D. None of these

2. Which statement is true for VBScript names e.g. variable names or procedure names?
A. They are case sensitive.
B. They are case insensitive.
C. They are case insensitive but should be written consistently for readability.
D. Only variable names are case insensitive.

3. What is the data type of a variable in VBScript?

A. String
B. Variant
C. It is the datatype specified when that variable is declared.
D. None of the above

4. In the Select Case statement, which case is used for unknown cases?
A. Else
B. Default
C. Unknown
D. Not

5. Which loop is used to iterate till a condition becomes true?

A. For Next loop
B. For Each Next loop
C. Do While loop
D. Do Until loop

6. What is the purpose of the Set keyword in VBScript?

A. Assign a value to any variable
B. Assign a value to an object variable
C. Declare an array
D. Configure the VBScript program

7. In which of the following scope, variables are available to all the procedures across all the?
A. All of the above
B. Dim
C. Public
D. Private

8. Which of the following is true about string value assignment inVBScript?

A. The string values should be enclosed within the hashsymbol(#)
B. None of the above
C. The string values should be assigned in double quotes
D. The string values should be enclosed within double-quotes(")
9. What is the output of A & B in VBScript if A = "VB" and B = "Script"?
A. VBScript
B. Error
C. VBScript
D. A=VB B=VBScript

10. How will you get a subset of an array inVBScript?

A. Using IsArrayfunction
B. Using EraseFunction
C. Using Joinfunction
D. Using Filterfunction

11. What is the output of A & B in VBScript if A = 5 and B =10?

A. 15
B. 510
C. 150
D.105

12. Which of the following operator is supported inVBScript?

A. ComparisonOperators
B. All of thegiven
C. LogicalOperators
D. ArithmeticOperators

Skill Level
13. How will you get a combined string from an array of string in VBScript?
A. Using Erase Function
B. Using Join function
C. Using Filter function
D. Using IsArray function

14. How will you format a number upto 3 decimal places in VBScript?
A. Using FormatPercent function
B. Using Log function
C. Using FormatNumberFunction
D. Using Int function

15. How will you trim the leading as well as trailing spaces of a string using VBScript?
A. Using Trim function
B. Using Len function
C. Using Replace function
D. Using Space function

16. Where to Put the VBScript code

A. Head section
B. Body Section
C. Both body and head section
D. None of these

17. What does the Option Explicit directive do?

A. It forces you to declare all of your variables
B. It forces you to call the method
C. It forces you to declare all of your static variables
D. It forces you to declare all of your global variables

18. Which VBScript function converts an input string to allow ercase?

A. LCase
B. Lower Case
C. Lower
D. There is no such function to directly convert to lowercase

19. VBScript was launched in

A. 1995
B. 1996
C. 1994
D.1997

20. VBScript is developed by

A. Netscape
B. Opera
C. Sun
D. Microsoft

21. Which browser has built-in support for executing VBScript?

A. InternetExplorer
B. Mozilla Firefox
C. Opera
D. None ofthese

22. Where to Put the VBScript code

A. Head section
B. Body Section
C. Both body and head section
D. None of these

23. How to pass argument by value to a function in VBScript?

A . Using ByVal keyword
B .Using ByRef keyword
C. Both of the above.
D . None of the above.

24. How will you check that a variable is an array in VBScript?

A . Using Join function
B .Using Filter function
C .Using IsArray function
D .Using Erase Function

25. How will you get the smallest subscript of an array in VBScript?
A . Using ReDim statement
B . Using LBound function
C . Using UBound function
D . Using Split function

Long Questions
1) How to create variable inVBScript
Dim keyword to tell VBScript you are about to create a variable
Dim nQuantity
Dim Statement
The Dim statement declares and allocates storage space in memory for variables. The Dim
statement is used either at the start of a procedure or the start of a global script block. In the
first case, the variable declared using Dim is local to the procedure. In the second, it's
available throughout themodule.
Syntax
Dim varname[([subscripts])][, varname[([subscripts])]] . . .
.

2) How to work with Array inVBScript.

Declaration of Arrays in VBScript
Declaration of an Array can be done in the same manner in which Variables are declared but with
the difference that array variable is declared by using parenthesis‗()‘.
The Dim keyword is used to declare an Array.
Ways to declare an Array:
There are 3 ways in which an Array can be declared.
They are as follows:
#1) Way 1: Dim array1()
Here, array1 is the name of an array and as parenthesis is empty it means that the size of an
array is not defined here.
If you want to declare an array by mentioning its size then it can be done in the following way.
#2) Way 2: Dim array1(5)
In this, array1 is declared with the size as 5 which states it holds 6 values considering that the
index of an array always starts from 0. These 5 values can be of integer type, string or
charactertypes.
#3) Way 3 : array1 = Array(1,2,3,4,5,6)
Here, Array Function is used to declare an array with a list of arguments inside the parenthesis
and all integer values are passed directly inside the parenthesis without any need of
mentioning the size of an array.
Note: Index value of an Array can never be a negative value. Next, let‘s discuss how to assign
values to an array

3) What is the use of redim and preserve keyword inVBScript

RedimStatement is used to re-define the size of an Array. When the array is declared without
any size, then it can be declared again using Redim with the feasibility of specifying the size
of an array.
Preserve keyword is used to preserve the contents of a current array when the size of an array
gets changed.
<html>
<head>
<title>Let‘s see implementation of Redim and Preserve</title>
</head>
<body>
<script language=‖vbscript‖ type=‖text/vbscript‖>Dim
array1()
REDIM array1(3)
array1(0) = ―hello‖
array1(1) =12
array1(2) =13
array1(3) = ―how are you‖
REDIM PRESERVE array1(5)
array1(4) = 15

array1(5) = 16
For i = 0 to ubound(array1)
Msgbox―Value present at index ‖&i&‖ is ―&array1(i) &―<br/>‖Next
</script>
</body>
</html>
Output is:
Value present at index 0 is
hello Value present at index 1
is 12 Value present at index 2
is13
Value present at index 3 is how are
you Value present at index 4 is15
Value present at index 5 is16

4) Explain any four array function inVBScript

#1) lbound:
This is the opposite of ubound (used above). This returns the smallest integer index value of an
array i.e. the smallest subscript of an array.
E.g:In above example, size of an array is 5. Hence, lbound will be 0 as this is the smallest
subscript of an array.
#2) ubound:
This is already used above. This returns the largest subscript of a defined array.
E.g:In the above example, size of an array is 5. Hence, in this case, ubound is 5
#3) Split:
This returns an array consisting of a number of sub-strings and can be split using some
delimiter. The syntax of this is: Split(expression,[delimiter])
Using a delimiter is an optional condition.
#4) Join:
This is the opposite of the Split function. Here, String is returned which includes various
substrings in an array and thus joins all the sub-strings into one string.
The syntax of this is: Join(array,[delimiter]. Using a delimiter is an optional condition.
#5) IsArray:
This returns True/False on the basis of a specified variable. If the variable is passed is an Array
then True is returned else False.
The syntax is: IsArray( array variable)
#6) Filter:
This returns a subset of an array based on the filter condition i.e. data is filtered on the basis of
some condition.
The syntax is: Filter(array, filter condition)

Example:
<html>
<head>
<title>Let‘s see implementation of In-Built Array Functions</title>
</head>
<body>
<script language=‖vbscript‖ type=‖text/vbscript‖>
Dimarray1= Array(―January‖,‖February‖,‖March‖,‖April‖)
Dim a , b , c , d , e ,
f a = lbound(array1)
b=
ubound(array1)
c=Split(array1,‖,‖)
d=Join(array1,‖$―)e
=IsArray(array1)
f = Filter(array1,‖J‖)
Msgbox(a)&―<br/>‖M
sgbox(b)&―<br/>‖Msg
box(c)&―<br/>‖Msgb
ox(d)&―<br/>‖Msgbox
(e)&―<br/>‖
Msgbox(f)
</script>
</body>
</html>
Output is:
0
3
January February March April
January $ February $ March $
April True
January

5) Explain decision making statement with example in VBScript

Decision making allows programmers to control the execution flow of a script or one of its
sections. The execution is governed by one or more conditional statements.
Following is the general form of a typical decision making structure found in most of the
programming languages:
VBScript provides following types of decision making statements. Click the following links to
check their details.
if statement An ifstatement consists of a boolean expression followed by one or more
statements.

if..elsesta An if else statement consists of a boolean expression followed by one or

tement more statements. If the condition is True, the statements
under Ifstatements are executed. If the condition is false, Else part of the
script isExecuted

if...elseif..els An ifstatement followed by one or more ElseIfStatements, that consists of

estatement boolean expressions and then followed by an optional else statement,
which executes when all the condition becomesfalse.

nested An ifor elseifstatement inside another if or elseifstatement(s).

if
statements
switchsta A switch statement allows a variable to be tested for equality against a list
tement of values.

6) What is Exit do and Exit for Statement explain with example.

Exit For Statements

AExit For Statement is used when we want to Exit the For Loop based on certain criteria.
When Exit Foris executed, the control jumps to next statement immediately after the
For Loop.
Syntax
The syntax for Exit ForStatement in VBScript is:
Exit For
Example
The below example uses Exit For. If the value of the Counter reaches 4, the For Loop is Exited
and control jumps to the next statement immediately after the ForLoop.

Example:
<html>
<body>
<script language="vbscript" type="text/vbscript">

Dim a :a=10
For i=0 to a Step 2 'i is the counter variable and it is incremented by 2
document.write("The value is i is : " &i) document.write("<br></br>")
If i=4 Then
i=i*10 'This is executed only if i=4
document.write("The value is i is : " &i) Exit For
'Exited when i=4
End If
Next
</script>
</body>
</html>

When the above code is executed, it prints the following output in the console.
The value is iis :0
The value is iis :2
The value is iis :4
The value is iis :40

Exit Do Statements
An Exit Do Statement is used when we want to Exit the Do Loops based on certain criteria. It
can be used within both Do..Whileand Do..UntilLoops.
When Exit Do is executed, the control jumps to next statement immediately after the Do
Loop. Syntax
The syntax for Exit Do Statement in VBScript is:
Exit Do

Example
The below example uses Exit Do. If the value of the Counter reaches 10, the Do Loop is Exited
and control jumps to the next statement immediately after the ForLoop.
<html>
<body>
<script language="vbscript" type="text/vbscript">

i= 0
Do While i<= 100
If i>10 Then
Exit Do ' Loop Exits if i>10 End
If
document.write("The Value of i is : " &i)
document.write("<br></br>")
i= i+ 2
Loop

</script>
</body>
</html>

When the above code is executed, it prints the following output in the console
The Value of iis :0
The Value of iis :2
The Value of iis :4
The Value of iis :6
The Value of iis :8
The Value of iis :10

7) Explain switch statement with example in VB script

Switch Statement
When a User want to execute a group of statements depending upon a value of an Expression,
then Switch Case is used. Each value is called a Case, and the variable being
switched ON based on each case. Case Else statement is executed if test expression doesn't
match any of the Case specified by the user.
Case Else is an optional statement within Select Case, however, it is a good programming
practice to always have a Case Else statement.
Syntax
The syntax of a Switch Statement in VBScript is:
Select Case
expressionCase
expressionlist1
statement1
statement2
....
....
statement1n
Case expressionlist2
statement1
statement2
....
....
Case expressionlistn
statement1
statement2
....
....
Case Else
elsestatement1
elsestatement2
....
....
End
Select
Example
<html>
<body>
<script language="vbscript" type="text/vbscript">
Dim MyVar
MyVar = 1

Select case MyVar

case 1
Document.write "The Number is the Least Composite Number"
case 2
Document.write "The Number is the only Even Prime Number"
case 3
Document.write "The Number is the Least Odd Prime Number"
case else
Document.write "Unknown Number"End
Select
</script>
</body>
</html>
In the above example, the value of MyVar is 1. Hence, Case 1 would be
executed.The Number is the Least Composite Number

8) Explain for loop with syntax and example?

For Loop
A for loop is a repetition control structure that allows a developer to efficiently write a loop
that needs to execute a specific number of times.
Syntax
The syntax of a for loop in VBScript is:
For counter = start To end [Step
stepcount][statement 1]
[statement 2]
....
[statement n]
[Exit For]
[statement 11]
[statement 22]
....
[statement n]
Next

Flow Diagram
Here is the flow of control in a For Loop:
 The For step is executed first. This step allows you to initialize any loop control
variables and increment the step counter variable.
 Secondly, the condition is evaluated. If it is true, the body of the loop is executed. If it
is false, the body of the loop does not execute and flow of control jumps to the next statement
just after the For Loop.
 After the body of the for loop executes, the flow of control jumps tothe
Next statement. This statement allows you to update any loop control variables. It is updated
based on the step counter value.
 The condition is now evaluated again. If it is true, the loop executes and the process
repeats itself (body of loop, then increment step, and then again condition). After the
condition becomes false, the For Loop terminates.
Example
<html>
<body>
<script language="vbscript" type="text/vbscript">
Dim a : a=10
For i=0 to a Step 2 'i is the counter variable and it is incremented by 2
document.write("The value is i is : " & i) document.write("<br></br>")
Next

</script>
</body>
</html>
When the above code is compiled and executed, it produces the following result:
The value is i is :

0 The value is i is

: 2 The value is i

is : 4 The value is

i is : 6 The value

is i is : 8
The value is i is : 10

9) Explain for….each loop with syntax and example?

For….each
A For Each loop is used when we want to execute a statement or a group of statements for
each element in an array or collection.
A For Each loop is similar to For Loop; however, the loop is executed for each element in an
array or group. Hence, the step counter won't exist in this type of loop and it is mostly used
with arrays or used in context of File system objects in order to operate recursively.
Syntax
The syntax of a For Each loop in VBScript is:
For Each element In Group
[statement 1]
[statement 2]
....
[statement n]
[Exit For]
[statement 11]
[statement 22]Next

Example:
<html>
<body>
<script language="vbscript" type="text/vbscript">

'fruits is an array
fruits=Array("apple","orange","cherries")
Dim fruitnames
'iterating using For each loop
<html>
<body>
<script language="vbscript" type="text/vbscript">

'fruits is an array
fruits=Array("apple","orange","cherries")
Dim fruitnames
'iterating using For each loop.
For each item in fruits
fruitnames=fruitnames&item&vbnewline
Next
msgbox fruitnames
</script>
</body>
</html>
When the above code is executed, it prints all the fruitnames with one item in each line.
Apple
orange
cherries

10) Explain while…wend with syntax and example?

While Wend Loop

In a While..Wend loop, if the condition is True, all statements are executed
until Wend keyword is encountered.
If the condition is false, the loop is exited and the control jumps to very next statement
after Wend keyword.
Syntax
The syntax of a While..Wend loop in VBScript is:

While condition(s)
[statements 1]
[statements 2]
...
[statements n]
Wend
Example
<html>
<body>
<script language="vbscript" type="text/vbscript">

Dim Counter : Counter = 10

While Counter < 15 ' Test value of Counter.
Counter = Counter + 1 ' Increment Counter.
document.write("The Current Value of the Counter is : " & Counter)
document.write("<br></br>")
Wend ' While loop exits if Counter Value becomes 15.

</script>
</body>
</html>
When the above code is executed, it prints the following output in the console.
The Current Value of the Counter is : 11
The Current Value of the Counter is : 12
The Current Value of the Counter is : 13
The Current Value of the Counter is : 14
The Current Value of the Counter is : 15
11) Explain do….while with syntax and example?

A Do..While loop is used when we want to repeat a set of statements as long as the condition
is true. The Condition may be checked at the beginning of the loop or at the end of the loop.
Syntax
The syntax of a Do..While loop in VBScript is:
Do While condition
[statement 1]
[statement 2]
...
[statement n]
[Exit Do]
[statement 1]
[statement 2]
...
[statement n]
Loop
Example
The below example uses Do..while loop to check the condition at the beginning of the loop.
The statements inside the loop are executed only if the condition becomes True.
<html>
<body>
<script language="vbscript" type="text/vbscript">

Do While i < 5
i=i+1
Document.write("The value of i is : " & i)
Document.write("<br></br>")
Loop

</script>
</body>
</html>
When the above code is executed, it prints the following output in the console.
The value of i is : 1
The value of i is : 2
The value of i is : 3
The value of i is : 4
The value of i is : 5
Alternate Syntax
There is also an alternate Syntax for Do..while loop which checks the condition at the end of
the loop. The Major difference between these two syntax is explained below with an example.
Do
[statement 1]
[statement 2]
...
[statement n]
[Exit Do]
[statement 1]
[statement 2]

...
[statement n]
Loop While condition
Example
The below example uses Do..while loop to check the condition at the end of the loop. The
Statements inside the loop are executed atleast once even if the condition is False.
<html>
<body>
<script language="vbscript" type="text/vbscript">

i=10
Do
i=i+1
Document.write("The value of i is : " & i)
Document.write("<br></br>")
Loop While i<3 'Condition is false.Hence loop is executed once.

</script>
</body>
</html>
When the above code is executed, it prints the following output in the console.
The value of i is : 11

12) Explain do…..until with syntax and example?

Do Until condition
[statement 1]
[statement 2]
...
[statement n]
[Exit Do]
[statement 1]
[statement 2]
...
[statement n]
Loop
Example
The below example uses Do..Until loop to check the condition at the beginning of the loop.
The Statements inside the loop are executed only if the condition is false. It exits out of the
loop when the condition becomes true.
<html>
<body>
<script language="vbscript" type="text/vbscript">
i=10
Do Until i>15 'Condition is False.Hence loop will be executed
i=i+1
Document.write("The value of i is : " & i)
Document.write("<br></br>")
Loop

</script>
</body>
</html>
When the above code is executed, it prints the following output in the console.

The value of i is :
11
The value of i is :
12
The value of i is :
13
The value of i is :
14
The value of i is :
15
The value of i is :
16

Alternate Syntax
There is also an alternate Syntax for Do..Until loop which checks the condition at the end of
the loop. The Major difference between these two syntax is explained below with an example.
Do
[statement 1]
[statement 2]
...
[statement n]
[Exit Do]
[statement 1]
[statement 2]
...
[statement n]
Loop Until condition
Example
The below example uses Do..Until loop to check the condition at the end of the loop.
TheStatements inside the loop are executed atleast once even if the condition is True.
<html>
<body>
<script language="vbscript" type="text/vbscript">
i=10
Do
i=i+1
Document.write("The value of i is : " & i)
Document.write("<br></br>")
Loop Until i<15 'Condition is True.Hence loop is executed once.
</script>
</body>
</html>
When the above code is executed, it prints the following output in the console.
The value of i is : 11
UNIT-V
`
BOOTSTRAP

1. Who developed the bootstrap?

a. James Gosling
b. Mark Jukervich
c. Dennis Ritchie
d. Mark Otto and Jacob Thornton

2. Is Bootstrap3 mobile-first?

a. True
b. False
c. Can't say
d. May be

3. Which of the following class in Bootstrap is used to provide a responsive fixed width
container?

a. .container-fixed
b. .container-fluid
c. .container
d. All of the above

4. How many columns are allowed in a bootstrap grid system?

a. box
b. .container
c. .container-fluid
d. .jumbotron

5. The correct syntax of creating a standard navigation bar is -

a. <nav class="navigationbar navbar">

b. <nav class="navbar navbar-default">
c. <nav class="nav navbar">
d. <nav class="navbar default">

6. Which of the following is the correct syntax of creating a standard navigation tab?

a. <ul class="navigation nav-tabs">

b. <ul class="nav tab">
c. <ul class="nav nav-tabs">
d. <ul class="navigation tabs">

7. The plugin used to create a cycle through elements as a slideshow is -

a. slideshow
b. scrollspy
c. carousel
d. None of the above

8. Which of the following class in Bootstrap is used to create a dropdown menu?

a. .dropdown
b. .select
c. .select-list
d. None of the above

9. Which of the following class in Bootstrap is used to create a basic list group?

a. .grouped-list
b. .select-list
c. .list-group
d. .list-grouped

10. The class used to shape an image to a circle is -

a. .img-rounded
b. .img-circle
c. .img-rounded
d. None of the above

11. Which of the following class in Bootstrap is used to add a zebra-stripe to a table?

a. .tab-striped
b. .zebra-strip
c. .table-stripped
d. .table-striped

12. Which of the following class in Bootstrap is used to create a large button?

a. .btn-xl
b. .btn-lrg
c. .btn-large
d. .btn-lg

13. Which of the following plugin in Bootstrap is used to create a modal window?

a. popup
b. alert
c. modal
d. window

14. Which of the following class in Bootstrap is used to create basic pagination?

a. .page
b. .pagin
c. .paginate
d. .pagination

15. Which of the following class in Bootstrap is used to create a badge?

a. tag
b. .badge
c. .page
d. .flag

16. The class in Bootstrap used to provide rounded corners to the image is -

a. .img-circle
b. .image-circle
c. .image-rounded
d. .img-rounded

17. Which of the following class in Bootstrap is used to create a panel?

a. .panel
b. .container
c. .box
d. .jumbotron

18. Using which of the following, we can create a pager in Bootstrap?

a. carousel
b. .collapse
c. .pager
d. None of the above

19. The class in Bootstrap which is used to specify the collapsible elements is -

a. .collapse
b. .carousel
c. .pager
d. None of the above

20. Which of the following class in Bootstrap is used to create a well?

a. .wel
b. .well
c. .well-container
d. .container-well

21. The class used for creating the large size wells is -
a. .well-large
b. .well-big
c. .well-lg
d. .well-sm

22. The class used for creating the small size wells is -

a. .well-small
b. .well-short
c. .well-lg
d. .well-sm

23. Which of the following class in Bootstrap is used for creating the large size modals?

a. .modal-large
b. .modal-sm
c. .modal-big
d. .modal-lg

24. Which of the following plugin is used to create a tooltip?

a. popover
b. tooltip
c. modal
d. None of the above

25. Which of the following is the correct syntax to insert search icon?

a. <span class = "glyph glyphicon-search"> </span>

b. <span class = "glyphicon glyph-search"> </span>
c. <span class = "glyphicon glyphicon-search"> </span>
d. <span class = "glyphicon-search"> </span>
Question Bank with Answers:

1. What are the advantages of Bootstrap?

The following are some advantages of Bootstrap:

 Bootstrap is simple to use and anyone with a basic understanding of HTML and CSS
can get started.
 Features that adapt to phones, tablets, and desktops: Bootstrap's responsive CSS
adapts to phones, tablets, and desktops.
 A mobile-first strategy: Mobile-first styles are built into the Bootstrap framework.
 Bootstrap 4 is compatible with all modern browsers, including Chrome, Firefox,
Internet Explorer 10+, Edge, Safari, and Opera.

2. What is a Bootstrap Container, and how does it work?

A bootstrap container is a handy class that generates a central region on the page where we
can put our site content. The bootstrap .container has the advantage of being responsive and
containing all of our other HTML code. Containers are used to pad the content within them,
and there are two types of containers:

 The .container class creates a fixed-width container that is responsive.

 The .container-fluid class creates a full-width container that spans the entire viewport
width.
3. What do you know about the Bootstrap Grid System?

The Bootstrap Grid System is a mobile-first, responsive grid system that scales up to 12
columns as the device or viewport size grows. Predefined classes for quick layout options
and powerful mix-ins for creating successful semantic layouts are included in the system.

There are five classes in the Bootstrap 4 grid system:

 .col- for extra small devices, whose screen width is less than 576px.
 .col-sm- small devices, whose screen width is equal to or greater than 576px.
 .col-md- medium devices, whose screen width is equal to or greater than 768px.
 .col-lg- large devices, whose screen width is equal to or greater than 992px.
 .col-xl- extra large devices, whose screen width is equal to or greater than 1200px.

The classes listed above can be combined to build layouts that are more dynamic and
adaptable.
4. Write a note on Button group and breadcrumb in Bootstrap?

Button group:

 Multiple buttons can be placed together on a single line using button grou
groups. You
can use this to group objects together, such as alignment buttons.
 The .btn-group
group class is used for basic button groups. You can use the class .btn to
wrap a set of buttons in .btn
.btn-group.

Breadcrumbs:

Breadcrumbs are a wonderful way to display a site's hierarchy-based

based information.
Breadcrumbs can show the dates of publication, categories, and tags in the case of blogs.
They show where the current page is in the navigational hierarchy.

In Bootstrap, a breadcrumb is essentially an unordered list wit

withh the class .breadcrumb. CSS
adds the separator for you automatically.

5. In Bootstrap, what are the two codes for displaying code? What is alead?

In Bootstrap, there are two straightforward ways to display code:

 The <code> element is used to showcase a pi

piece of inline code.
 You can use the <pre> tag to display a code that has multiple lines or even a block
element.
Lead:

Lead adds some emphasis to a paragraph. The .lead class is used to achieve this and it
makes the font larger, taller, and lighter in weight.

<p class= "lead" > Paragraph </p>

6. Write a note on Alert and Bootstrap card.

Bootstrap alert:

Create a wrapper <div> and add a class of .alert and one of the contextual classes to create
a basic alert (e.g., .alert-success, .alert-info, .alert-warning, .alert-danger, .alert-primary,
.alert-secondary, .alert-light or .alert-dark).

Bootstrap Card:

In Bootstrap 4, a card is a bordered box with padding surrounding its content. It has options
for headers, footers, content, and colors, among other things.
<div class="card">
<div class="card-header">Header</div>
<div class="card-body">Body</div>
<div class="card-footer">Footer</div>
</div>
Another example:
<div class="card" style="width:400px">
<img class="card-img-top" src="img_avatar.png" alt="Card image">
<div class="card-body">
<h4 class="card-title">Richard Taylor</h4>
<p class="card-text">Some example text.</p>
<a href="#" class="btnbtn-primary">See Profile</a>
</div>
</div>

7. Discuss Bootstrap table and various classes that can change the appearance of the table.

 A basic Bootstrap 4 table features horizontal divisions and light padding.

 The .table class gives a table some basic styling.
 The .table-striped class gives zebra stripes to the table.
 The .table-bordered class adds borders to the table and cells on all sides.
 On table rows, the .table-hover class adds a hover effect (grey background color).

Here is how the zebra-striped table looks like:

8. Write a note on Bootstrap Well and Pagination.

Bootstrap Well:
The Bootstrap well is simply a container that makes the content appear sunken. It can also produce
an inset effect on the webpage. With the aid of <div> and class, a developer may create a well
andalso wrap the content in the well. The content will be displayed according to your preferences.
Bootstrap Pagination:

If your website has lots of pages, you might require adding some sort of pagination to each
page.

<ul class="pagination">
<li class="page-item"><a class="page-link" href="#">Previous</a></li>
<li class="page-item"><a class="page-link" href="#">1</a></li>
<li class="page-item"><a class="page-link" href="#">2</a></li>
<li class="page-item"><a class="page-link" href="#">3</a></li>
<li class="page-item"><a class="page-link" href="#">4</a></li>
<li class="page-item"><a class="page-link" href="#">Next</a></li>
</ul>

Pagination is how Bootstrap handles an unordered list. The following classes are provided
by bootstrap to manage pagination:

.pagination: This class is required to enable pagination on your page.

.disabled, .active: Use .disabled for unclickable links and .active to indicate the current
page when customising links.

.pagination-Ig and .pagination-sm: use these to get different size items.

9. What are badges? Which class will you use to make your badge look more rounded?

Badges are used to supplement any content with additional information. To make
rectangular badges, use the .badge class with a contextual class (like .badge-secondary)
within <span> elements. It's worth noting that badges scale to fit the parent element's size
(if any).

To make the badges more rounded, we use the .badge-pill class.

10. What do you understand by column ordering in Bootstrap?

 One of the most intriguing properties of bootstrap is column ordering.

 The columns can be readily written in a specific order by utilizing relevant
functions.
 We can alternatively put them in a different column. Use the push and pull column
classes to easily rearrange or rearrange the order of the columns.
 These classes are used in conjunction with the .col-xs-#, .col-sm-#, .col-md-#, and
.col-lg-# Bootstrap grid classes.
 .col-xs-push-# and .col-xs-pull-# are the push and pull classes for the Bootstrap grid.
 This also works well for sm, md, and lg. The pull class moves columns to the left,
whereas the push class moves them to the right.

11. How is tooltip different from popover?

When the user moves the mouse pointer over an element, the Tooltip component appears as
a little pop-up box. The Popover component is a pop-up box that emerges when the user
clicks on an element. The popover may hold a lot more information.

The popover will show on the right side of the element by default whereas the tooltip will
show on the top of the element by default.
12. What classes can help you change the default settings of positioning a popover and
closing a popover?

 The popover will show on the right side of the element by default.
 To position the popover on the top, bottom, left, or right side of the element, use the
data-placement attribute.
 When you click on the element again, the popover closes by default.
 However, the data-trigger="focus" attribute can be used to close the popover when
the user clicks outside the element.
 Use the data-trigger attribute with the value "hover" if you want the popover to
appear when you move the mouse cursor over the element.

The Art of Problem Solving Intermediate Algebra
96% (25)
The Art of Problem Solving Intermediate Algebra
720 pages
Digital SAT Math Practice Questions
61% (31)
Digital SAT Math Practice Questions
29 pages
Discovering Geometry Solutions Manual
70% (10)
Discovering Geometry Solutions Manual
304 pages
Woodcock Johson IV Training Manual PDF
100% (2)
Woodcock Johson IV Training Manual PDF
48 pages
Introduction To Geometry
90% (21)
Introduction To Geometry
580 pages
The Motivational Interviewing Workbook - Exercises To Decide What You Want and How To Get There
100% (10)
The Motivational Interviewing Workbook - Exercises To Decide What You Want and How To Get There
224 pages
Algebra Cheat Sheet
97% (72)
Algebra Cheat Sheet
2 pages
Workout Log
63% (19)
Workout Log
8 pages
Physics Primer - Homework - 1
95% (42)
Physics Primer - Homework - 1
40 pages
Golf Strategies - Dave Pelz's Short Game Bible PDF
92% (24)
Golf Strategies - Dave Pelz's Short Game Bible PDF
444 pages
Catherine V Holmes - How To Draw Cool Stuff, A Drawing Guide For Teachers and Students
97% (35)
Catherine V Holmes - How To Draw Cool Stuff, A Drawing Guide For Teachers and Students
260 pages
Parts Work 4th Edition
100% (30)
Parts Work 4th Edition
166 pages
[Algebra Essentials Practice Workbook with Answers Linear and Quadratic Equations Cross Multiplying and Systems of Equations Improve your Math Fluency Series] Chris McMullen - Algebra Essentials Practice Workbook with A.pdf
82% (11)
[Algebra Essentials Practice Workbook with Answers Linear and Quadratic Equations Cross Multiplying and Systems of Equations Improve your Math Fluency Series] Chris McMullen - Algebra Essentials Practice Workbook with A.pdf
207 pages
Math 87 Mathematics 8 - 7 Textbook An Incremental Development Stephen Hake John Saxon
100% (10)
Math 87 Mathematics 8 - 7 Textbook An Incremental Development Stephen Hake John Saxon
696 pages
Astrology Cheatsheet
98% (44)
Astrology Cheatsheet
15 pages
Self-System Therapy For Depression Client Workbook
100% (9)
Self-System Therapy For Depression Client Workbook
113 pages
ICTWS - (18.3.2) Web Scripting Learning Plans - SJE
No ratings yet
ICTWS - (18.3.2) Web Scripting Learning Plans - SJE
64 pages
The Colossal Book of Mathematics PDF
100% (11)
The Colossal Book of Mathematics PDF
744 pages
Algebra 8-1studyguide
71% (7)
Algebra 8-1studyguide
110 pages
HTMLCSS JS Database Training Syllabus 2019
No ratings yet
HTMLCSS JS Database Training Syllabus 2019
20 pages
INT42D
No ratings yet
INT42D
2 pages
Int 42 D
No ratings yet
Int 42 D
2 pages
III SEMESTER WT Datascience
No ratings yet
III SEMESTER WT Datascience
7 pages
Web I It 21025
No ratings yet
Web I It 21025
3 pages
Course 55320
No ratings yet
Course 55320
8 pages
Ict 101
No ratings yet
Ict 101
6 pages
It8078 Web Design and Management
No ratings yet
It8078 Web Design and Management
27 pages
Assignment PDF
100% (1)
Assignment PDF
10 pages
Web Technology (2 & 11 Marks)
No ratings yet
Web Technology (2 & 11 Marks)
196 pages
html completed
No ratings yet
html completed
18 pages
Unit
No ratings yet
Unit
28 pages
Web Designing
No ratings yet
Web Designing
6 pages
E Commerce PDF
No ratings yet
E Commerce PDF
62 pages
HTML Final File3
No ratings yet
HTML Final File3
30 pages
Unit - I Web Technologies Notes
No ratings yet
Unit - I Web Technologies Notes
72 pages
HTML Final File (3) Harshitaaaaaaaaaaa
No ratings yet
HTML Final File (3) Harshitaaaaaaaaaaa
30 pages
Computer multimedia animation unit 1 assignment
No ratings yet
Computer multimedia animation unit 1 assignment
11 pages
Occ Record
No ratings yet
Occ Record
145 pages
html
No ratings yet
html
13 pages
Web Programming
No ratings yet
Web Programming
12 pages
Web Programming
No ratings yet
Web Programming
109 pages
Unit-3 Questions
No ratings yet
Unit-3 Questions
6 pages
Bootcamp
No ratings yet
Bootcamp
6 pages
Web Development Java Script
No ratings yet
Web Development Java Script
20 pages
WT Question Bank
No ratings yet
WT Question Bank
4 pages
Final Lab Mannual Web Tech
No ratings yet
Final Lab Mannual Web Tech
33 pages
A Report of Two Weeks Industrial Training: Sigma Services
No ratings yet
A Report of Two Weeks Industrial Training: Sigma Services
40 pages
Internet Technology 2
No ratings yet
Internet Technology 2
319 pages
Solution For Excersize1 (Advanced Web Desigining)
No ratings yet
Solution For Excersize1 (Advanced Web Desigining)
9 pages
SFS, Gurukul Marg, Mansarovar, Jaipur: Web Design and Technology
No ratings yet
SFS, Gurukul Marg, Mansarovar, Jaipur: Web Design and Technology
16 pages
Web-Interface_Designing_Technologies
No ratings yet
Web-Interface_Designing_Technologies
2 pages
SHUBHAM Complete Computer Applications File
No ratings yet
SHUBHAM Complete Computer Applications File
23 pages
Industrial Training 5th Sem
No ratings yet
Industrial Training 5th Sem
16 pages
FEDT - Question Bank
No ratings yet
FEDT - Question Bank
15 pages
HTML Crash Course: by Daniel D'Agostino 2 June 2007 Revised 19 June 2007
No ratings yet
HTML Crash Course: by Daniel D'Agostino 2 June 2007 Revised 19 June 2007
51 pages
Web Syllabus 20242
No ratings yet
Web Syllabus 20242
5 pages
Lab Assignment Mscit III
No ratings yet
Lab Assignment Mscit III
2 pages
HTML Interview QA
No ratings yet
HTML Interview QA
5 pages
Advanced Web Design
No ratings yet
Advanced Web Design
9 pages
Web Application and Development
No ratings yet
Web Application and Development
4 pages
Programming With HTML, Css and Javascript (55320A) : Module 1: A Quick Overview of Web Development
No ratings yet
Programming With HTML, Css and Javascript (55320A) : Module 1: A Quick Overview of Web Development
11 pages
SEC HTML
No ratings yet
SEC HTML
2 pages
Web Technology and Programming I
100% (1)
Web Technology and Programming I
5 pages
IT0322 Web Systems LAB Manual
No ratings yet
IT0322 Web Systems LAB Manual
104 pages
HTML& CSS (Eng)
No ratings yet
HTML& CSS (Eng)
24 pages
HTML Interview Questions
No ratings yet
HTML Interview Questions
6 pages
Impressive web designing Q&A
No ratings yet
Impressive web designing Q&A
30 pages
General Introduction To Internet and WWW
No ratings yet
General Introduction To Internet and WWW
15 pages
CSE326
No ratings yet
CSE326
5 pages
Muhammad Aamir 2023 CS 566
No ratings yet
Muhammad Aamir 2023 CS 566
39 pages
Cse 326
No ratings yet
Cse 326
2 pages
Web Development Project Report
No ratings yet
Web Development Project Report
38 pages
Internet Programming Slide New
No ratings yet
Internet Programming Slide New
100 pages
20480B Programming in HTML5 With JavaScript and CSS3
No ratings yet
20480B Programming in HTML5 With JavaScript and CSS3
11 pages
Web Development (Basic One)
No ratings yet
Web Development (Basic One)
11 pages
HTML & CSS: Basic Web Dev Lessons
No ratings yet
HTML & CSS: Basic Web Dev Lessons
51 pages
Learn HTML & CSS: From Beginner to Expert
From Everand
Learn HTML & CSS: From Beginner to Expert
Mohammed Mastafi
No ratings yet
Mastering HTML and CSS for Modern Development
From Everand
Mastering HTML and CSS for Modern Development
THE NORTHERN HIMALAYAS
No ratings yet
Log
No ratings yet
Log
3 pages
Log
No ratings yet
Log
3 pages
Cs Final Assignment Teams
No ratings yet
Cs Final Assignment Teams
2 pages
Part A Program 6
No ratings yet
Part A Program 6
3 pages
Part A Program 1-1
No ratings yet
Part A Program 1-1
3 pages
Algebra 2
95% (19)
Algebra 2
200 pages
How To Read Sheet Music For Beginners
100% (2)
How To Read Sheet Music For Beginners
15 pages
Tarasov Calculus
100% (1)
Tarasov Calculus
179 pages
Pre-Algebra and Algebra
100% (23)
Pre-Algebra and Algebra
66 pages
How To Distinguish ADHD From Typical Toddler Behavior
100% (1)
How To Distinguish ADHD From Typical Toddler Behavior
24 pages
Mathematics Fundamentals
89% (9)
Mathematics Fundamentals
198 pages
Day 2 Math, Distributive Property
No ratings yet
Day 2 Math, Distributive Property
9 pages
Fractions
100% (10)
Fractions
50 pages
ECG Rhythm Interpretation 2007
100% (20)
ECG Rhythm Interpretation 2007
533 pages
M. Aurelius PDF
100% (10)
M. Aurelius PDF
366 pages
Florida Teacher Certificate Examinations (FTCE) Study Guide
0% (2)
Florida Teacher Certificate Examinations (FTCE) Study Guide
20 pages
Week 1 Byteshell 1
No ratings yet
Week 1 Byteshell 1
14 pages
Manifest NonUFSFiles Win64
No ratings yet
Manifest NonUFSFiles Win64
339 pages
NET Programming Notes
No ratings yet
NET Programming Notes
4 pages
Log
No ratings yet
Log
36 pages
Linked List Data Structure Operations and Its Pseudocodes
No ratings yet
Linked List Data Structure Operations and Its Pseudocodes
7 pages
Minesweeperr
No ratings yet
Minesweeperr
10 pages
Ex1.1 C
No ratings yet
Ex1.1 C
6 pages
Exercises
No ratings yet
Exercises
4 pages
icjecapu08
No ratings yet
icjecapu08
6 pages
Practical Slip - 2
No ratings yet
Practical Slip - 2
1 page
Technical PI Questions
No ratings yet
Technical PI Questions
5 pages
2.2 Circular Queue
No ratings yet
2.2 Circular Queue
3 pages
Centurion University of Technology and Managament: Topic: Numpy, Pandas, Matplotlib
No ratings yet
Centurion University of Technology and Managament: Topic: Numpy, Pandas, Matplotlib
12 pages
preUPS 2 SET 2
No ratings yet
preUPS 2 SET 2
4 pages
Chapter - 5 Exception Handling Multithreaded Programming
No ratings yet
Chapter - 5 Exception Handling Multithreaded Programming
24 pages
Logcat
No ratings yet
Logcat
20 pages
Sample Paper - CS201P
No ratings yet
Sample Paper - CS201P
7 pages
12th Computer Science Interior Questions EM
No ratings yet
12th Computer Science Interior Questions EM
1 page
PracticeQuestions Final
No ratings yet
PracticeQuestions Final
9 pages
Simple Code To Consume Web Service Using SAP ABAP
No ratings yet
Simple Code To Consume Web Service Using SAP ABAP
2 pages
Log
No ratings yet
Log
12 pages
MCQ_QuestionBank
No ratings yet
MCQ_QuestionBank
11 pages
Java Interview Question
No ratings yet
Java Interview Question
2 pages
Csharp Generic
No ratings yet
Csharp Generic
16 pages
81301M.Sc-III Sem. INFO. TECHNOLOGY- DOT NET TECHNOLOGY
No ratings yet
81301M.Sc-III Sem. INFO. TECHNOLOGY- DOT NET TECHNOLOGY
2 pages
ACSE0202
No ratings yet
ACSE0202
5 pages