Upwork BootstrapTest Answers 2018

40 Answered Test Questions:

1)The following event is fired when the carousel has completed its transition;
a)bs
b)slide
c)slid
d)None of the above

2)What is Twitter Bootstrap?
a)It's css API to user interface while prototyping
b)It's HTML, CSS and JavaScript framework to build user interfaces
c)It's JS and ECMAScript framework which allows quick CSS changes
d)It's part of Twitter UI API
e)It's new way to build interfaces

3)Which class can be used for the page header element?
a).page-tittle
b).page-header
c).header
d)None of the above

4)What media queries breakpoints are available as less option to maker better UI for mobile devices?(choose all yhat apply)
a)Width-medium
b)media-query-mobile
c)screen-xs
d)screen-phone
e)small-up
f)None of the above

5)Is it possible to change table's outline color using provided Less variables?
a)No,because it's not possible to change Less configuration. It's used only by core Bootstrap developers.
b)Yes, using 'table-vorder-color' variable
c)Yes, using 'table-outline-color' variable
d)Not possible

6)What scaffolding varibles are available to use in classic CSS to override default values?
a)body-bg, gray-dark, brand-primary, link-hover-color, link-hover-decoration
b)It's not possible to override Less variables in a classic CSS file.
c)body-bg, text-color, link-color, link-hover,-docoration, link-hover-color
d)gray-drak and brand-primary

7)what preprocessor is used to build Bootstrap?
a)LESS
b)SASS
c)TcSS
d)TwitterCSS

8)What will happen if viewport with resolution of 500x800 will rotate to landscape of site which uses custom build of bootstrap/
a)items with class' .visible-xs-*' will hide
b)Result depends on less configuration
c)items with class .visible -md-* will stay hidden
d)items with class'. visible-lg -*' will stay hidden

9)Is it possible to create responsive image?
a)Yes,uing helper class: 'responsive'
b)Yes,using class: 'img-responsive
c)Yes,using helper class'img-responsive' but it will require Javascript plugins enabled
d)Yes, using class'img-rounded' so it's width will be rounded to closest integer by width of viewport.
e)Yes, using class 'img-fluid'
f)Yes,using class 'image-responsive'
g)None of these.

10)Responsive utilities are currently only avaiable for block and table toggling in the following classes;
a).visible-se-block : Small devices (more than 767px and less 992px in width)visible
b).visible-se-block : Medium devices (up to 768px in width)visible
c).visible-md-block : Medium devices (768px to 980px in width)visible
d).visible-ig : Large devices (992px and above in width)visible

11)What flexbox model css options can be used together with bootstrap?
a)None, Bootstrap does not support flexbox yet.
b)only class 'row-flex' and 'column-flex'
c)Any
d)Fireboxis provided by 3rd pary libraries and can not be used together with bootstrap

12)IS it possible to hide something from print view just using bootstrap CSS classes?
a)No, Javascript pulgins are needed to hide elements before sending viee to printer.
b)Yes
c)Yes,just add visible-print' class to html element
d)No

13)How bootstrap grid works?
a)It's done with flexbox, you just use props like flex="1" and alignitems="center"
b)Bootstrap provides custom classes to make grid, 'row' for rows and spanl, spam2, span3, etc
c)Bootstrap provides custom classes to make grid, 'row for rows and col-md3, col-lg12 etc.
d)Bootstrap provides custom classes to make grid, 'row for rows and col-mobile-3, col- tablet-12 etc for colums.

14)What will happen if sr-only class is added to some div element?
a)div will be visible only for small resolution devices
b)div will be visible only for screen readers
c)div wil slide only to right silde
d)div will only stay on right side of screen

15)Which of the following tags is used to show keyboard combinations?
a)<section>
b)<code>
c)<keyboard>
d)<kbd>

16)What Css class is needed to display form inputs one after the other in single row?
a)form-inline-mobile if viewport is smaller than 768px in width
b)form-inline if viewport is at least 768px wide
c)form-inline-desktop' if viewport is at least 768px wide
d)form -as-row if viewport is at least 768px wide
e)form-in-row if viewport is at least 768px wide
f)Can't be done because Bootstrap is mobile first and on mobile form elements are displayed for columns

17)Which of the following is the correct way to do the pagination with Bootstrap?
a)<nav aria-label="page navigation">
<ulclass ="pagination">
<li> <a herf="#>1</a></li>
<li> <a herf="#>2</a></li>
<li> <a herf="#>3</a></li>
<li> <a herf="#>4</a></li>
<li> <a herf="#>5</a></li>
</ul>
</nav>
b)<nav aria-label="page navigation">
<ulclass ="pagination">
<p> <a herf="#>1</a></p>
<p> <a herf="#>2</a></p>
<p> <a herf="#>3</a></p>
<p> <a herf="#>4</a></p>
<p> <a herf="#>5</a></li>
</ul>
</nav>
c)<nav aria-label="page navigation">
<ulclass ="pagination">
<i> <a herf="#>1</a></i>
<i> <a herf="#>2</a></i>
<i> <a herf="#>3</a></i>
<i> <a herf="#>4</a></i>
<i> <a herf="#>5</a></i>
</ul>
</nav>
d)<nav aria-label="page navigation">
<ulclass ="pagination">
<p> <a herf="#>1</a></p>
<p> <a herf="#>2</a></p>
<p> <a herf="#>3</a></p>
<p> <a herf="#>4</a></p>
<p> <a herf="#>5</a></p>
</ul>
</nav>
f)<nav aria-label="page navigation">
<ulclass ="pagination">
<i> <a herf="#>1</a></i>
<i> <a herf="#>2</a></i>
<i> <a herf="#>3</a></i>
<i> <a herf="#>4</a></i>
<i> <a herf="#>5</a></i>
</ul>
</nav>
g)None of the above

18)Is it possible to disable zooming on mobile devices while using Bootstrap?
a)No, bootstrap is mobile-first and mobile sites must have ability to zoom in or out
b)Yes, but you must enabled 35 and add data-zoom="off" on body tag
c)Zoom will be disabled only if width=device-width is in meata tag with 'name="viewport"'
d)Zoom will be disabled only if initial scalee=1, maximum-scale=1' is in meta tag with name="viewport"'

19)What browsers are supported?
a)All browsers are supported.
b)All versions of Chrome, Firefox, Opera, IE and safari.
c)Chrome, Safari, Firefox that updates automatically are fully supported and IE 8 and 9 are partly supported.
d)Chrome, Safari, Firefox that updates automatically are fully supported and IE 8 and 9 are supported only IE compatibility modes.

20)Which code is correct way to get previous active tab's text?
a)$('.nav-tabs a'),on('shown.bs.tab', function(event){
var xy = $(event, relatedTarget). previous();
});
b)$('.nav-tabs a'),on('shown.bs.tab', function(event){
var xy = $(event, relatedTarget). back();
});
c)$('.nav-tabs a'),on('shown.bs.tab', function(event){
var xy = $(event, relatedTarget). prev();
});
d)$('.nav-tabs a'),on('shown.bs.tab', function(event){
var xy = $(event, relatedTarget). text();
});

21)What options are avaiable during initialization of carousel?
a)data-interval
b)interval
c)key
d)active
e)data-active
f)cycle
g)pause

22)The affix pulgin toogles among the following classes? (Choose all that apply)
a).affix
b)affix-bottom
c).affox-top
d)None of the above

23)What code is used to create navigation?
a)<ul class="nav nav-pills">....</ul>
b)<ul class="dropdown-menu">....</ul>
c)<ul class="navigation">....</ul>
d)<ul class="nav nav-dropdown">....</ul>
e)<ul class="nav nav-tabs">....</ul>
f)<ul class="nav nav-tabs-with-dropdown">....</ul>
g)<ul class="menu">....</ul>

24)Is it possible to change shape of image file?
a)Yes
b)Only visual ouput can be changed
c)Yes, but it works only with PNG and JPG images
d)No

25)What is default way to have red button?
a)<button type="buttom" class="btn btn-default"> Default</button>
b)<button type="buttom" class="btn btn-default-red"> Default as red</button>
c)<button type="buttom" class="btn" color"red"> Red</button>
d)<button type="buttom" class="btn btn-red">Red</button>
e)<button type="buttom" class="btn btn-danger"> Danger</button>
f)<button type="buttom" class="btn btn-alert"> Danger</button>

26)How can you insert a serach icon?
a)<span class="glyphicon glyphicon-search"></span>
b)<span class="glyph glyph-search"></span>
c)<span class="glyphicon-search"></span>
d)<span class="glyphicon search"></span>

27)What is true about icons in Bootsrap?
a)Bootstrap don't provide icons out of the box, but it's possible to use materia desing font awesome or any other icons set together with bootstrp.
b)If icon is needed after the text of div, icon can be added simply like this:</div class ="glyphicon glyphicon-serach">Search</div>
c)Icon classes can be directly combined with any other elements
d)Icon classes should be used only with empty elements
e)None of the these

28)Bootstrap provides the following classes that can be used to apply some simple styles to images?
(choose all that apply)
a).img-thumbnail:adds a bit of padding and a gray border
b).img-rounded: adds border-radius: 6px to give the image rounded corners
c).img-circle: makes the entire image round by adding border-radius:50%
d).img-rounded: adds border-recat: 6px to give the image react corners
e).img-circle: makes the entire image radius by adding border.rounded

29)Bootstrap provides you with following types of rom layouts: (Choose all that apply)
a)Horizontal form
b)Inline form
c)Outline form
d)Vertical (default) form

30)Which of the following bootstrap classes can be used to create tabs?
a).navigation.navigation-tabs
b).nav .nav-tabs
c).nav-tabs-navigation . nav-tabs-childern
d)None of the above

31)What is Jumbotron?
a)Such thing does not exist in bootstrap it's some word used to describe big tv sets
b)It's element to showcase key content
c)It's container element to hold grid layout
d)It's countainer element to hold images in full-screen mode

32)Which of the following bootstrap classes can be used to create navigation bar?
a).navbar.navbar.default
b).navigation-bar .navigation-bar-default
c).nb ,nb-default
d)None of the above

33)The Bootstrap grid system has the following class prefixes? (choose all that apply)
a)col-lg-
b)col-sm-
c)col-em-
d)col-xs
e)col-sx-

34)The following event is fired immediately when the hide instance method has been called?s
a)$('#popoverExample').on ("show.bs.popover",
funciton() {
// do something....
})
b)$('#popoverExample').on ("shown.bs.popover",
funciton() {
// do something....
})
c)$('#popoverExample').on ("hidden.bs.popover",
funciton() {
// do something....
})
d)$('#popoverExample').on ("hide.bs.popover",
funciton() {
// do something....
})

35)What is visual differnce between <del>text A</del> and <s> text B</s> for end users?
a)With 'del' tag text looks like deleted text and with 's' tag is used to make strikethrough texts
b)No visual differnece
c)There is slight difference for Safari users on Mac, while no difference for any other
d)del' and 's' represent different things and del text is also red, while 's' text is just strike through

36)
a)Add clas 'bold'
b)Use HTML 'bold' tag
c)Use HTML 'strong' tag
d)Use HTML 'b' tag
e)Add class 'strong'
f)None of these

37)Which class is used to create a black navigation bar?
a).navbar-inverse
b).navbar-black
c).navbar-default
d).navbar-dark

38)Which code will create bootstrap button?
a)<button type="button" class="button success"> Button</button>
b)<button type="button" class="btn btn-success"> Button</button>
c)<button type="button"success"> Button</button>
d)<button type="button" class="btn flat"> Button</button>

39)In Bootstrap, collapsing elements enables you to collapse any element without using external_____?
a)LESS
b)CSS
c)Javascript
d)Modal

40)What is needed to be used to make marked text?
a)Add class'mark' to some html tag
b)with <mark> html tag
c)Add class 'marked' to some html tag
d)Add ckass 'is-marked' to some html tag
e)Add class 'marked-text' to some html tag

Posted by : Unknown

4 Comments

Tuesday, March 14, 2017

Upwork BootstrapTest Answers 2018