CSS MCQ
CSS MCQ
3. Which of the following CSS selectors are used to specify a group of elements?
a) tag
b) id
c) class
d) both class and tag
View Answer
Answer: c
Explanation: Class selectors are used to specify a group of elements. Id selector specifies a
particular unique element.
4. Which of the following has introduced text, list, box, margin, border, color, and
background properties?
a) HTML
b) PHP
c) CSS
d) Ajax
View Answer
Answer: c
Explanation: CSS is a style sheet language that stands for Cascading Style Sheet. CSS has
introduced text, list, box, margin, border, color, and background properties.
7. Which of the following type of HTML tag is used to define an internal style sheet?
a) <script>
b) <link>
c) <class>
d) <style>
View Answer
Answer: d
Explanation: <style> tag is used to define an internal style sheet in HTML document.
8. Which of the following CSS property is used to make the text bold?
a) text-decoration: bold
b) font-weight: bold
c) font-style: bold
d) text-align: bold
View Answer
Answer: b
Explanation: The font-weight property is used for setting the thickness and boldness of the
font. It is used to define the weight of the text. The available weight depends on the font-
family, which is used by the browser.
h1 {color: "green";}
a) nothings happen
b) error occurs
c) heading becomes dark-green
d) heading becomes green
View Answer
Answer: a
Explanation: Output of the above code snippet won’t happen as the declaration syntax is
wrong. The correct declaration is : h1 { color: green; } which will yield an output. In CSS, we
don’t write the value in double quotes.
10. Which of the following CSS style property is used to specify an italic text?
a) style
b) font
c) font-style
d) @font-face
View Answer
Answer: c
Explanation: font-style property is used to specify an italic text. font-style property has three
values (normal, italic & oblique).
12. Which of the following are the CSS Extension Prefixes for Webkit?
a) -chrome
b) -web
c) -o-
d) -webkit
View Answer
Answer: d
Explanation: Browser sometimes adds prefixes to non-standard CSS properties. CSS
Extension prefix for Webkit is -webkit which is supported by almost all ios browsers. -o is
used by opera where as -moz is used by firefox browser.
13. Which of the following is the correct syntax to link an external style sheet in the HTML
file?
a) <link rel=”stylesheet” href=”style.css” />
b) <link rel=”stylesheet” src=”style.css” />
c) <style rel=”stylesheet” src=”style.css” />
d) <style rel=”stylesheet” link=”style.css” />
View Answer
Answer: a
Explanation: HTML file must contain a reference to the external style sheet file. External
style sheet files are defined within the <link> element and it should be inside the <head>
section. href attribute specifies the URL of the linked resource.
14. Which of the following is the first CSS specification to become an official W3C
Recommendation?
a) CSS level 2
b) (X)HTML CSS
c) CSS level 1
d) CSS level 2.1
View Answer
Answer: c
Explanation: The first CSS specification to become an official W3C Recommendation is
CSS level 1, published on December 17, 1996. Håkon Wium Lie and Bert Bos are credited
as the original developers.
15. Which of the following function defines a linear gradient as a CSS image?
a) gradient()
b) linear-gradient()
c) grayscale()
d) image()
View Answer
Answer: b
Explanation: linear-gradient() function defines a linear gradient as a CSS image. Creating a
linear gradient function we should define minimum of two color stops. color stops will tell the
browser which colors to use in the gradients for smooth transitions.
16. Which of the following CSS property can be used to set the image as a border instead
of the border style?
a) background-image-source
b) background-image
c) border-image-source
d) border-image
View Answer
Answer: c
Explanation: The border-image-source property specifies the path to the image to be used
as a border (instead of the normal border around an element).
17. Which of the following CSS property defines the different properties of all four sides of
an element’s border in a single declaration?
a) border-collapse
b) border-width
c) padding
d) border
View Answer
Answer: b
Explanation: The border-width property sets the width of an element’s four borders. This
property can have from one to four values.
18. Which of the following is the correct way to apply CSS Styles?
a) in an external CSS file
b) inside an HTML element
c) inside the <head> section of an HTML page
d) all of the mentioned
View Answer
Answer: d
Explanation: We can style the document using CSS in three different ways i.e embed, inline
and external. An inline CSS means applying styles rules directly to the HTML element. In
embed, we declare or write all the needed style in <style></style> tag in the head section of
the HTML document. We can create an external style sheet and provide its link to the
document.
19. Which of the following CSS property sets the font size of text?
a) font-size
b) text-size
c) text
d) size
View Answer
Answer: a
Explanation: CSS Syntax:
font-size: length | percentage | larger | smaller | xx-small | x-small |
small | medium | large | x-large | xx-larger | inherit
20. Which of the following is not the property of the CSS box model?
a) margin
b) color
c) width
d) height
View Answer
Answer: b
Explanation: CSS box model include height, width, padding, margin and border. All text-
fields have complete support for every property related to CSS box model. Browser relies
on system default styles when displaying these widgets.
21. Which of the following CSS property sets what kind of line decorations are added to an
element, such as underlines, overlines, etc?
a) text-decoration
b) text-style
c) text-decoration-line
d) text-line
View Answer
Answer: c
Explanation: The text-decoration-line property defines the type of line decorations that are
added to an element, such as underlines, overlines, etc.
22. Which of the following CSS property specifies the look and design of an outline?
a) outline-style
b) outline-format
c) outline-font
d) none of the mentioned
View Answer
Answer: a
Explanation: The outline-style CSS property is used to set the style of the outline of an
element. An outline is a line that is drawn around elements, outside the border edge, to
make the element stand out.
23. What will be the output of the following CSS code snippet?
span {
border: 1px solid red;
outline: green dotted thick;
}
a) All span elements will have a green thick border and a red outline
b) All span elements will have a red border and a green dotted outline
c) All span elements will have a outer green dotted border and an inner red border
d) All span elements will have an outer red border and inner green dotted border
View Answer
Answer: c
Explanation: The border property creates the inner border, while the outline sets the outer
border.
24. Which of the following CSS property sets the shadow for a box element?
a) set-shadow
b) box-shadow
c) shadow
d) canvas-shadow
View Answer
Answer: b
Explanation: box-shadow property sets the shadow for a box element.
CSS Syntax:
box-shadow: none | inherit
25. Which of the following CSS property is used to set the color of the text?
a) text-decoration
b) pallet
c) colour
d) color
View Answer
Answer: d
Explanation: The color property is used to set the color of the text. In CSS, colors can also
be specified using RGB values, RGBA values, HSL values, HEX values, etc.
26. Which of the following CSS Property controls how an element is positioned?
a) static
b) position
c) fix
d) set
View Answer
Answer: b
Explanation: Position property controls how an element is positioned. When set to absolute
or fixed, the element is removed completely from the normal flow of the document. When
set to relative, the element is moved relative to its position in the normal flow, but a space is
left where it would normally have been. The default value, static, means the element
remains in the normal flow and is not positioned.
27. Which of the following CSS selector selects the elements that are checked?
a) :checked
b) E ~ F
c) ::after
d) none of the mentioned
View Answer
Answer: a
Explanation: :checked selector selects the elements that are checked.
Example: :checked {color: blue;}
28. Which of the following is an appropriate value for the overflow element?
a) scroll
b) hidden
c) auto
d) all of the mentioned
View Answer
Answer: d
Explanation: Overflow of a div or a container can have the following values:
visible|hidden|scroll|auto|initial|inherit
29. Which of the following CSS property is used to specify table borders in CSS?
a) table:border
b) table
c) border
d) none of the mentioned
View Answer
Answer: c
Explanation: In CSS, border property is used to specify table borders.
Example:
table{border: 7px solid black;}
30. Which of the following property is used to align the text in a table?
a) text-align
b) align
c) text
d) none of the mentioned
View Answer
Answer: a
Explanation: In CSS, text-align property is used to align the text in a table.
Example:
table{text-align: left;}
31. Which of the following CSS Property sets the stacking order of positioned elements?
a) y-index
b) z-index
c) x-index
d) all of the mentioned
View Answer
Answer: b
Explanation: z-index property sets the stacking order of positioned elements.
Syntax:
z-index: auto|number|initial|inherit;
div {
border-width:5px;
border-style:dotted solid double dashed;
}
a) Box having dotted bottom outline, solid right outline, double top outline and dashed left
outline
b) Box having dotted bottom outline, solid left outline, double top outline and dashed left
outline
c) Box having dotted top outline, solid right outline, double bottom outline and dashed left
outline
d) Box having dotted top outline, solid left outline, double bottom outline and dashed right
outline
View Answer
Answer: c
Explanation: The shorthand run in clockwise direction.
33. Which of the following property allows a marquee to be used in the case of a text-
overflow?
a) overflow-marquee
b) overflow-style
c) overflow-text
d) none of the mentioned
View Answer
Answer: b
Explanation: overflow-style is a CSS property that allows a marquee to be used in the case
of a text-overflow.
Syntax:
overflow-style: auto | marquee-block
34. Which of the following CSS property defines the space between cells in a table?
a) border-spacing
b) border-style
c) border
d) none of the mentioned
View Answer
Answer: a
Explanation: border-spacing property defines the space between cells in a table.
Syntax:
border-spacing: non-negative length(s) | inherit
35. Which of the following CSS3 property can be used to allow line breaks within words?
a) line-break
b) line-wrap
c) word-wrap
d) word-break
View Answer
Answer: d
9. __________ has introduced text, list, box, margin, border, color, and background
properties.
a) css
b) html
c) ajax
d) php
View Answer
Answer: a
Explanation: CSS is a style sheet language which stands for Cascading Style Sheet. CSS
has introduced text, list, box, margin, border, color, and background properties.
10. Is it the best way to include H1 heading only one time on the web page.
a) True
b) False
View Answer
Answer: a
1. Which of the following element is used by the filter property to blur the images?
a) opaque()
b) scatter()
c) blur()
d) all of the mentioned
View Answer
Answer: c
Explanation: Blurs an element, for use by the filter property. Accepts a distance
measurement within which pixels are randomly scattered. A value of 0 leaves the image as
is.
2. Which of the following function adjust the brightness of an element’s color, for use by the
filter property?
a) contrast()
b) dark()
c) light()
d) brightness()
View Answer
Answer: d
Explanation: A value of 100% or decimal value of 1 leaves the image as is, while 0
produces black. Increasing the value from 1 or 100% brightens pixels from their original
values.
3. Which of the following function adjusts the difference between light and dark values, for
use by the filter property?
a) contrast()
b) dark()
c) light()
d) brightness()
View Answer
Answer: a
Explanation: A value of 100% or a decimal value of 1 leaves the image as is, while 0 results
in black. Increasing the value past 1 or 100% produces more dramatically stratified areas of
light and dark.
advertisement
4. Which of the following function with filter property to create your own sophisticated effects
on DOM elements?
a) create()
b) DOM()
c) custom()
d) none of the mentioned
View Answer
Answer: c
Explanation: None.
5. Which of the following function converts an element’s color to a shade of gray, for use by
the filter property?
a) shade()
b) grayscale()
c) black()
d) brightness()
View Answer
Answer: b
Explanation: A decimal value between 0 and 1 or percentage up to 100% controls the
extent of the gray effect.
6. Which of the following function flips an element’s colors, for use by the filter property?
a) image()
b) flip()
c) invert()
d) contrast()
View Answer
Answer: c
Explanation: A decimal value between 0 and 1 or percentage up to 100% controls the
extent of the color-negative effect, with 0.5 or 50% producing gray.
7. Which of the following function applies a saturation effect to an element’s color, making it
appear more or less vivid, for use by the filter property?
a) color()
b) saturation()
c) saturate()
d) none of the mentioned
View Answer
Answer: b
Explanation: A decimal value of 1 or percentage of 100% keeps the image as is, while
increasing the amount produces more dramatically stratified hues.
8. Which of the following function defines a linear gradient as a CSS image?
a) grayscale()
b) gradient()
c) image()
d) linear-gradient()
View Answer
9. Which of the following function two dimensional transformation in matrix format?
a) matrix()
b) matrix2d()
c) matrix3d()
d) perspective
View Answer
Answer: a
Explanation: None.
10. Which of the following function apply a sepia tinge to an element’s color, typical of old
photographs, for use by the filter property?
a) grayscale()
b) sepia()
c) contrast()
d) brightness()
View Answer
Answer: b
1. Which of the following value is supposed to be a slightly bolder weight that standard bold
in font attribute?
a) empasize
b) light
c) lighter
d) dark
View Answer
Answer: d
Explanation: Self-explainatory.
2. Which of the following property allows contextual adjustment of inter-glyph spacing, i.e.
the spaces between the characters in text?
a) font-style
b) font-family
c) font-kerning
d) font-variant
View Answer
Answer: c
Explanation: Self-explainatory.
3. Which of the following is not a value for font-style property?
a) normal
b) italic
c) oblique
d) none of the above
View Answer
Answer: d
Explanation: Self-explainatory.
advertisement
4. Which of the following value specifies whether the user agent is allowed to synthesize
bold or oblique font faces when a font family lacks bold or italic faces?
a) font-weight
b) font-synthesis
c) font-kerning
d) font-variant
View Answer
Answer: b
Explanation: Self-explainatory.
5. Which of the following selects a normal, or small-caps face from a font family?
a) font-weight
b) font-synthesis
c) font-kerning
d) font-variant
View Answer
Answer: d
Explanation: Self-explainatory.
7. Which of the following property adjusts the font-size of the fallback fonts defined with
font-family, so that the x-height is the same no matter what font is used?
a) default
b) font-size-fallback
c) font-adjust
d) font-size-adjust
View Answer
Answer: d
Explanation: Self-explainatory.
8. Which of the following Allows you to expand or condense the widths for a normal,
condensed, or expanded font face?
a) font-style
b) font-stretch
c) font-expand
d) none of the mentioned
View Answer
Answer: d
Explanation: Self-explainatory.
9. Which of the following font-size-adjust is value used in calculating the size of the fallback
fonts?
a) auto
b) number
c) count
d) none
View Answer
Answer: b
Explanation: Self-explainatory.
10. “font-style comes first than font-weight in font attribute”.State true or false.
a) True
b) False
View Answer
Answer: b
Explanation: Syntax:
font: font-weight font-style font-variant font-size/line-height font-family .
6. Which of the following CSS property is used to give a line over the text?
a) text-decoration: underline
b) text-decoration: overline
c) text-decoration: line-through
d) text-decoration: none
View Answer
Answer: b
Explanation: Text-decoration is a CSS property used to decorate the text. The text-
decoration property takes many values such as overline, underline, line-through, none,
inherit, etc. Overline gives a line over the text. Underline value is used to add line under the
text. None value defines a normal text. When one wants to give a line through the text, line-
through value for text-property can be used.
8. _________ first became a Candidate Recommendation on February 25, 2004, but it was
reverted to a Working Draft on June 13, 2005 for further review.
a) CSS level 1
b) CSS level 2
c) CSS level 3
d) CSS level 2.1
View Answer
Answer: d
Explanation: CSS level 2 revision 1, often referred to as “CSS 2.1”, fixes errors in CSS 2,
removes poorly supported or not fully interoperable features and adds already implemented
browser extensions to the specification. To comply with the W3C Process for standardizing
technical specifications, CSS 2.1 went back and forth between Working Draft status and
Candidate Recommendation status for many years. CSS 2.1 first became a Candidate
Recommendation on February 25, 2004, but it was reverted to a Working Draft on June 13,
2005 for further review.
10. Unlike CSS 2, which is a large single specification defining various features?
a) CSS level 1
b) CSS level 2
c) CSS level 3
d) CSS level 2.1
View Answer
Answer: c
Explanation: Unlike CSS 2, which is a large single specification defining various features,
CSS 3 is divided into several separate documents called “modules”. Each module adds new
capabilities or extends features defined in CSS 2, preserving backward compatibility.
1. ___________ describes CSS properties to manipulate the position of “ruby”, which are
small annotations on top of or next to words, especially common in Chinese and Japanese.
a) align
b) ruby
c) lang
d) text-align
View Answer
Answer: b
Explanation: Align is used to align the content either left, right or center. Ruby describes
CSS properties to manipulate the position of “ruby”, which are small annotations on top of or
next to words, especially common in Chinese and Japanese. They are often used to give
the pronunciation or meaning of difficult ideograms. Text-align is for aligning the text either
left, right or in center.
2. ___________ has a grammar but unlike traditional (X)HTML it is not defined with a
document type definition.
a) CSS 1
b) CSS 2
c) CSS 2.1
d) CSS 3
View Answer
Answer: c
Explanation: CSS 2.1 has a grammar (www.w3.org/TR/CSS21/grammar.html) but unlike
traditional (X)HTML it is not defined with a document type definition. Instead the CSS
specification is a combination of prose and a grammar that could be used to build a simple
parser.
advertisement
h1 {color: red text-decoration: underline; font-style: italic;}
h1 {color: "green";}
6. With, which tag you write the style rules directly within the document found
within the head of the document.
a) <script>
b) <php>
c) <style>
d) <css>
View Answer
Answer: c
Explanation: In <style></style> tag we write the style rules directly within the document in
the head section of the document. <script></script> tag is used to add javascript in the
document.
7. What does screen media type is used for?
a) For use with all devices
b) For use with handheld devices
c) For use with computer screens
d) For use with television-type devices
View Answer
Answer: c
Explanation: In CSS, media types are used for the compatibility of devices. There are four
types of nedia types i.e all, print, screen and speech. Out of which screen media type is
used for computer screens, tablets, smart-phones, etc.
1. Which of the following tag is used to linked information should be placed inside?
a) <head>
b) <html>
c) <div>
d) <body>
View Answer
Answer: a
Explanation: Linked information regarding CSS like external CSS document information is
always placed in <head> tag. <body> tag contains the body of the document.
3. The ________________ directive allows style sheets to be grouped and joined together,
though some might wonder what the value of this function is given what linked styles
provide.
a) <head>
b) <style>
c) <script>
d) @import
View Answer
Answer: d
Explanation: Within embedded <style> blocks, properties can be imported from an external
file and expanded in place, similar to a macro. Importing can be used to include multiple
style sheets. An imported style is defined within a <style> tag using @import followed
optionally by a type value and a URL for the style sheet. <style> & <script> tag conatins
CSS and Javascript content respectively. The metadata content is present in <head> tag.
advertisement
4. Which of the following measurement defines a measurement relative to a font’s x-height?
a) ex
b) em
c) pt
d) px
View Answer
Answer: a
Explanation: Defines a measurement relative to the height of a font in em spaces. Because
an em unit is equivalent to the size of a given font, if you assign a font to 12pt, each em unit
would be 12pt, thus 2em would be 24pt.
7. Which of the following property sets a variation of the specified or default font family?
a) height
b) font-weight
c) default
d) font-variant
View Answer
Answer: d
Explanation: Syntax:
font-variant: normal | small-caps | inherit
The small-caps value sets text in smaller-size all capitals. The normal value would be used
to override any inherited font-variant value. Font-weight is for increasing/decreasing weight
of font. It takes values like normal, bold, lighter, and bolder.
list-style-image add graphical image to a list item. List-style sets all the properties for a list.
10. Which of the following property sets the amount of spacing between letters?
a) space
b) line-height
c) letter-spacing
d) letter-space
View Answer
Answer: c
1. Which of the following CSS3 Color Feature can be used as a macro for whatever the
current color is?
a) CurrentColor keyword
b) HSLa Color
c) HSL Color
d) RGB Color
View Answer
Answer: a
Explanation: This is useful if you want to dynamically change one color and have other
related colors change.
2. Which of the following CSS3 Color Feature like RGB color but adds an alpha channel
value to specify the opacity of the color?
a) RGB
b) RGBa
c) RGBaplha
d) AlphaRGB
View Answer
Answer: b
Explanation: An RGBa is specified via a function style rgba(r,g,b,a) value, where colors r, g,
and b are specified as a decimal value from 0 to 255 or a percentage from 0 to 100%, and
the alpha channel value for defining opacity is a number between 0 (fully transparent) and 1
(fully opaque). Values outside this range will be rounded up or down to fit the closest value.
3. Which of the following Color Format is a CSS’s six-digit hexadecimal format is the same
as color defined in (X)HTML?
a) 6-Hex Color
b) 3-Hex Color
c) RGBS
d) RGBa
View Answer
Answer: a
Explanation: The format specifies color as #rrggbb, where rr is the amount of red, gg the
amount of green, and bb the amount of blue, all specified in a hexadecimal value ranging
from 00 to FF.
advertisement
4. Which of the following Color Format is a CSS2 introduced named color keywords which
allows Web page colors to be matched to an operating system’s color use?
a) HSLa Color
b) Commonly defined named colors
c) System Color Names
d) Specificationdefined named colors
View Answer
Answer: c
Explanation: None.
5. Which of the following Color Format are a 17 defined colors under CSS 2.1?
a) HSLa Color
b) Commonly defined named colors
c) System Color Names
d) Specificationdefined named colors
View Answer
Answer: d
Explanation:
maroon (#800000) red (#ff0000)
orange (#ffA500) yellow (#ffff00)
olive (#808000) purple (#800080)
fuchsia (#ff00ff ) white (#ffffff)
lime (#00ff00) green (#008000)
navy (#000080) blue (#0000ff)
aqua (#00ffff) teal (#008080)
black (#000000) silver (#c0c0c0)
gray (#808080)
Other color keywords may be commonly used but are ad hoc in their definition.
6. Which of the following Color Format is a CSS colors can also be defined using the
keyword rgb, followed by three numbers between 0 and 255, contained in parentheses and
separated by commas, with no spaces between them?
a) RGB Color
b) RGBa Color
c) HSL Color
d) HSLa Color
View Answer
Answer: a
Explanation: RGB color values can also be defined using percentages. The format is the
same, except that the numbers are replaced by percentage values between 0% and 100%.
7. Which of the following Color Format is a CSS3 HSL value with a fourth value to set the
alpha channel value for the color to define the opacity of the element?
a) RGB Color
b) RGBa Color
c) HSL Color
d) HSLa Color
View Answer
Answer: d
Explanation: None.
8. Which of the following Selector selects an element if it’s the only child of its parent with its
type?
a) @media
b) :target
c) ::selection
d) :only-of-type
View Answer
Answer: d
Explanation: None.
9. Which of the following Selector same as :firstline; changed under CSS3 to make
pseudoelements obvious?
a) :first-letter
b) :last-child
c) :first-line
d) ::first-line
View Answer
Answer: d
Explanation: None.
3. Which of the following property sets in a shorthand form any or all background
properties?
a) color
b) wrap
c) background
d) all of the mentioned
View Answer
Answer:
Explanation:
advertisement
Syntax: background: background-color
4. Which of the following Color Format can also be defined using the keyword rgb, followed
by three numbers between 0 and 255, contained in parentheses and separated by commas,
with no spaces between them?
a) RGB Color
b) RGBa Color
c) HSL Color
d) HSLa Color
View Answer
Answer: a
Explanation:
Sanfoundry Certification Contest of the Month is Live. 100+ Subjects. Participate
Now!
Example: p {color:rgb(0%,10%,50%);}
6. Which of the following element is used to specify multiple media resources for media
elements like audio and video?
a) <source>
b) <link>
c) <script>
d) <src>
View Answer
Answer: a
Explanation: Self-explainatory.
7. Which of the following Protocol enables a hyperlink to access a file on the local file
system?
a) https
b) ftp
c) file
d) telnet
View Answer
Answer: c
Explanation: Self-explainatory.
8. Which of the following element is used for linking a External Files to the html page?
a) <script>
b) <style>
c) <link>
d) all of the above
View Answer
Answer: c
Explanation: Self-explainatory.
9. Which of the following attribute specifies the URL of the linked resource?
a) src
b) link
c) rel
d) href
View Answer
Answer: d
Explanation: href attribute specifies the URL of the linked resource. A URL might be
absolute or relative.
1. Which of the following CSS property defines the different properties of all four sides of an
element’s border in a single declaration?
a) border
b) padding
c) border-collapse
d) border-width
View Answer
Answer: d
Explanation: The border-width property sets the width of an element’s four borders. This
property can have from one to four values.
2. Identify the CSS property defining bottom-left corner shape of the border?
a) border-radius
b) border-corner-radius
c) border-bottom-left-radius
d) border-left-radius
View Answer
Answer: c
Explanation: CSS3 border-radius property allows you can give any element “rounded
corners”.
3. Select the CSS property that sets the width of an element’s bottom border?
a) border-width
b) border-bottom
c) border-width-down
d) border-bottom-width
View Answer
Answer: d
Explanation: The border-bottom-width CSS property sets the width of the bottom border of a
box.
advertisement
4. Which of the following CSS property border-color property sets the color of an element’s
four borders?
a) border-background
b) border-background-color
c) border-color
d) all of the mentioned
View Answer
Answer: c
Explanation: The border-color property sets the color of an element’s four borders. This
property can have from one to four values.
5. Choose the CSS property that can be used for collapsing the borders between table
cells?
a) border
b) collapse-border
c) border-collapse
d) border-cell
View Answer
Answer: c
Explanation: The border-collapse property sets whether the table borders are collapsed into
a single border or detached as in standard HTML.
6. Which CSS property can be used to set the image as border instead of the border style?
a) background-image
b) border-image
c) background-image-source
d) border-image-source
View Answer
Answer: d
Explanation: The border-image-source property specifies the path to the image to be used
as a border (instead of the normal border around an element).
9. Which of the following specifies the distance between the borders of adjacent cells?
a) border-spacing-cell
b) border-width-spacing
c) border-spacing
d) cell-spacing
View Answer
Answer: c
Explanation: The border-spacing property sets the distance between the borders of
adjacent cells (only for the “separated borders” model).
10. Which of the following property defines the border-width, border-style and border-color
of an element’s top border in a single declaration?
a) border
b) border-top
c) border-top-corner
d) border-top-style
View Answer
Answer: b
Explanation: The border-top shorthand property sets all the top border properties in one
declaration.
1. Which of the following CSS property is used to set the text formatting?
a) font
b) font-style
c) text-decoration
d) all of the mentioned
View Answer
Answer: c
Explanation: Self-explainatory.
2. Which of the following sets the color of any text decoration, such as underlines, overlines,
and strike throughs?
a) text-font
b) text-format
c) text-color
d) text-decoration-color
View Answer
Answer: d
Explanation: Self-explainatory.
3. Which of the following sets what kind of line decorations are added to an element, such
as underlines, overlines, etc?
a) text-style
b) text-decoration
c) text-line
d) text-decoration-line
View Answer
Answer: a
Explanation: Self-explainatory.
advertisement
4. Which of the following text-decoration value specifies each line of text has a line above
it?
a) line
b) underline
c) overline
d) blink
View Answer
Answer: c
Explanation: Self-explainatory.
6. Which of the following CSS property determines how overflowed content that is not
displayed is signaled to the users?
a) text-flow
b) text-underflow
c) text-overflow
d) none of the mentioned
View Answer
Answer: c
Explanation: Self-explainatory.
7. Which of the following sets the mode for the overline text decoration, determining
whether the text decoration affects the space characters or not?
a) text-decoration
b) text-mode-overflow
c) text-mode
d) text-overline-mode
View Answer
Answer: b
Explanation: Self-explainatory.
8. Which of the following specifies what parts of an element’s content are skipped over
when applying any text decoration?
a) @font-text
b) font-style
c) text-skip
d) text-decoration-skip
View Answer
Answer: d
Explanation: Self-explainatory.
10. Which of the following property applies one or more drop shadows to the text?
a) text-shadow
b) text-effect
c) text-format
d) text-decoration-shadow
View Answer
Answer: a
1. Which of the following property sets the apparent position (in stereo sound) of the
synthesized voice for spoken media?
a) voice-balance
b) media-balance
c) balance
d) none of the mentioned
View Answer
Answer: a
Explanation: Self-explainatory.
2. Which of the following property allows the author to explicitly set the amount of time it
should take a speech synthesizer to read an element’s content?
a) @media
b) voice
c) voice-duration
d) all of the mentioned
View Answer
Answer: c
Explanation: Self-explainatory.
3. Which of the following property sets the speaker’s voice used by a speech media agent
to read an element?
a) voice-family
b) voice-check
c) voice-control
d) none of the mentioned
View Answer
Answer: a
Explanation: Self-explainatory.
advertisement
4. Which of the following property determines how much variation in pitch or tone will be
created by the speech synthesize when reading an element?
a) voice-pitch
b) voice-range
c) voice-stress
d) none of the mentioned
View Answer
Answer: b
Explanation: Self-explainatory.
5. Which of the following property sets the speed at which the voice synthesized by a
speech media agent will read content?
a) voice-volume
b) voice-pitch
c) voice-stress
d) voice-rate
View Answer
Answer: d
Explanation: Self-explainatory.
6. Which of the following property sets pitch or tone (high or low) for the synthesized speech
when reading an element; the pitch may be specified absolutely or relative to the normal
pitch for the voice-family used to read the text?
a) voice-check
b) voice-format
c) voice-pitch
d) voice-volume
View Answer
Answer: c
Explanation: Self-explainatory.
7. Which of the following property sets the volume for spoken content in speech media. It
replaces the deprecated volume property?
a) voice-volume
b) volume
c) !important
d) @media
View Answer
Answer: a
Explanation: Self-explainatory.
1. Which of the following property is used to draw a line around elements outside the
borders?
a) line
b) padding
c) outline
d) border
View Answer
Answer: c
Explanation: Outlines do not take up space, they are drawn above the content.
2. Choose the option that correctly specifies the output of the following CSS.
span {
border: 1px solid red;
outline: green dotted thick;
}
a) All span elements will have a red border and a green dotted outline
b) All span elements will have a green thick border and a red outline
c) All span elements will have an outer red border and inner green dotted border
d) All span elements will have a outer green dotted border and an inner red border
View Answer
Answer: d
Explanation: The border property creates the inner border, while the outline sets the outer
border.
advertisement
3. Which of the following property specifies the color of an outline?
a) color-outline
b) outline-color
c) outline-style-color
d) none of the mentioned
View Answer
Answer: b
Explanation: As the property name specifies, it sets the color of the outline to the provided
value.
6. Which of the following property specifies the look and design of an outline?
a) outline-font
b) outline-style
c) outline-format
d) none of the mentioned
View Answer
Answer: b
Explanation: The outline-style CSS property is used to set the style of the outline of an
element. An outline is a line that is drawn around elements, outside the border edge, to
make the element stand out.
div {
border-width:5px;
border-style:dotted solid double dashed;
}
a) Box having dotted top outline, solid right outline, double bottom outline and dashed left
outline
b) Box having dotted top outline, solid left outline, double bottom outline and dashed right
outline
c) Box having dotted bottom outline, solid right outline, double top outline and dashed left
outline
d) Box having dotted bottom outline, solid left outline, double top outline and dashed left
outline
View Answer
Answer: a
Explanation: The shorthand run in clockwise direction.
6. The __________ rule makes it possible to define different style rules for different media
types in the same stylesheet.
a) audio/video
b) sink
c) @media
d) @canvas
View Answer
Answer: c
Explanation:
Example:
@media screen {
p {
font-family: verdana, sans-serif;
font-size: 17px;
}
}
8. ____________ types are mutually exclusive in the sense that a user agent can only
support one media type when rendering a document.
a) tv
b) tty
c) media
d) audio
View Answer
Answer: c
Explanation: Media types are mutually exclusive in the sense that a user agent can only
support one media type when rendering a document. However, user agents may use
different media types on different canvases. For example, a document may (simultaneously)
be shown in ‘screen’ mode on one canvas and ‘print’ mode on another canvas.
9. If an @media/@import rule contains a malformed media type (not an identifier) then the
statement is valid. State true or false.
a) True
b) False
View Answer
Answer: b
Explanation: @media and @import rules with unknown media types (that are nonetheless
valid identifiers) are treated as if the unknown media types are not present. If an
@media/@import rule contains a malformed media type (not an identifier) then the
statement is invalid.
2. Which of the following property sets the width of an element’s bottom border?
a) border
b) border-collapse
c) border-bottom-width
d) none of the mentioned
View Answer
Answer: c
Explanation:
advertisement
Syntax: border-bottom-width: non-negative length | medium | thick | thin |
inherit
3. Which of the following property defines whether table cell borders are connected or
separate?
a) border-table
b) border
c) border-collapse
d) none of the mentioned
View Answer
Answer: c
Explanation:
Subscribe Now: CSS Newsletter | Important Subjects Newsletters
Syntax: border-collapse: collapse | separate | inherit
4. Which of the following property defines the style for the right border of an element?
a) border-spacing
b) border-spacing
c) border-right
d) border-right-style
View Answer
Answer: c
Explanation:
Syntax: border-right-style: dashed | dotted | double
5. Which of the following property defines the color of an element’s top border?
a) border-color
b) border-top
c) border-top-color-webkit
d) border-top-color
View Answer
Answer: d
Explanation:
Syntax: border-top-color: color | transparent | inherit
6. Which of the following property sets the width of an element’s complete border?
a) border-width
b) width
c) border-depth
d) none of the mentioned
View Answer
Answer: a
Explanation:
Syntax: border-width: width
7. Which of the following property defines the visual style of up to four different sides of a
border?
a) border-style
b) border
c) border-top
d) none of the mentioned
View Answer
Answer: a
Explanation: Syntax:
border-style: style
8. Which of the following defines in a shorthand form the width, style, and color for the top
border of an element?
a) border-up
b) border-bottom
c) border-style
d) none of the mentioned
View Answer
Answer: d
Explanation:
Syntax: border-top: border-width border-style border-color;
9. Which of the following property defines the y (vertical) coordinate for a positioned
element, relative to the bottom of the enclosing object or browser window?
a) border
b) bottom
c) position
d) none of the mentioned
View Answer
Answer: b
Explanation:
Syntax: bottom: length | percentage | auto | inherit
10. Which of the following property specifies the placement of an element in relation to
floating objects?
a) clear
b) color
c) space
d) none of the mentioned
View Answer
Answer: a
advertisement
2. Which of the following property defines the offset from an element’s border and its
outline?
a) outline-border
b) outline-offset
c) outline-radius
d) none of the mentioned
View Answer
Answer: b
Explanation:
Syntax: outline-offset: length | inherit
3. Which of the following property allows a marquee to be used in the case of a text
overflow?
a) overflow-style
b) overflow-text
c) overflow-marquee
d) none of the mentioned
View Answer
Answer: a
Explanation:
Sanfoundry Certification Contest of the Month is Live. 100+ Subjects. Participate
Now!
Syntax: overflow-style: auto | marquee-block
4. Which of the following property defines how content should behave when it exceeds the
width of its enclosing element?
a) overflow-y
b) overflow-x
c) overflow-z
d) overflow-width
View Answer
Answer: b
Explanation:
Syntax: overflow-x: auto | hidden
5. Which of the following property is used to give a 3-D sense of depth to an element?
a) animation
b) perspec
c) sense
d) perspective
View Answer
Answer: d
Explanation:
Syntax: perspective: none
6. Which of the following property is used to define whether an element should be resized
and, if so, upon what axis?
a) axis
b) resize
c) set-origin
d) set-axis
View Answer
Answer: b
Explanation:
Syntax: resize: both | horizontal | none
7. Which of the following property defines the alignment of Ruby text as defined by a <rt>
tag, in relation to base text defined by a <ruby> tag?
a) ruby-align
b) ruby-text
c) ruby
d) none of the mentioned
View Answer
Answer: a
Explanation:
Syntax: ruby-align: auto | center
8. Which of the following property sets the base color for a scroll bar, which will include the
scroll box, track, and scroll arrows?
a) scrollbar-base
b) scrollbar-base-color
c) scrollbar-background
d) none of the mentioned
View Answer
Answer: c
Explanation:
Syntax: scrollbar-base-color: color
9. Which of the following property defines a color for the face of a scroll bar, including arrow
regions and the scroll box?
a) scrollbar-face
b) scrollbar-face-color
c) scrollbar-face-background
d) scrollbar-background
View Answer
Answer: c
Explanation:
Syntax: scrollbar-face-color: color
10. Which of the following property defines a highlight color for a scroll bar and scroll
arrows?
a) scrollbar-color
b) scrollbar-highlight
c) scrollbar-highlight-color
d) scrollbar-highlight-background
View Answer
Answer: c
3. Which of the following font-weight property make the text lighter in relation to its parent?
a) unfocus
b) normal
c) lighter
d) normal
View Answer
Answer: c
Explanation: Self-explainatory.
advertisement
4. Which of the following property converts text to initial capitals, all uppercase, or all
lowercase?
a) text-transform
b) text
c) text-decoration
d) text-uppercase
View Answer
Answer: a
Explanation: Self-explainatory.
5. Which of the following font-variant property render text using the same letter case as in
the underlying code?
a) bold
b) small-caps
c) normal
d) none of the mentioned
View Answer
Answer: c
Explanation: Self-explainatory.
6. Which of the following property sets the alignment of the last line of a text block?
a) overflow-wrap
b) text-align-last
c) text-transform
d) text-indent
View Answer
Answer: b
Explanation: Self-explainatory.
7. Which of the following property controls how spaces and word wrapping are handled?
a) spacing
b) text-space
c) white-space
d) word-spacing
View Answer
Answer: c
Explanation: Self-explainatory.
8. Which of the following property specifies what line decorations, if any, are added to the
text?
a) text-decoration-line
b) text-line-decoration
c) text-decoration-style
d) text-style-decoration
View Answer
Answer: a
Explanation: Self-explainatory.
10. Which of the following property allows long text, such as a URL, to be broken if it would
otherwise over?
a) text-transform
b) word-wrap
c) text-overflow
d) text-indent
View Answer
Answer: b
1. Which of the following is used to associate a font name to be used in a style sheet with
some downloadable font?
a) @font-face
b) @charset
c) @media
d) !important
View Answer
Answer: a
Explanation: None.
3. Which of the following font format is supported by all the latest browser?
a) EOT
b) WOFF2
c) SVG
d) WOFF
View Answer
Answer: d
Explanation: None.
advertisement
4. Which of the following media query describe output style portrait if height is greater than
or equal to width, landscape if the opposite?
a) grid
b) monochrome
c) resolution
d) orientation
View Answer
Answer: d
Explanation: None.
5. Which of the following media query describe the ratio of the width to the height of the
media?
a) ratio
b) aspect-ratio
c) deviceaspect-ratio
d) resolution
View Answer
Answer: b
Explanation: None.
6. Which of the following media query describe describes the height of the screen or full
height of the output page?
a) height
b) aspect-ratio
c) device-height
d) resolution
View Answer
Answer: c
Explanation: None.
9. Which of the following property sets a variation of the specified or default font family?
a) fonts
b) font-style
c) font-variant
d) font-weight
View Answer
Answer: c
Explanation: Syntax:
font-variant: normal | small-caps.
10. The @font-face rules assign different names to the regular and bold versions of the
font.State true or false.
a) True
b) False
View Answer
Answer: a
2. Which of the following display property value is described by treats the element as inline?
a) inline-block
b) list-item
c) block
d) inline
View Answer
Answer: d
Explanation: Self-explainatory.
3. Which of the following property defines the style for the bottom border of an element?
a) border-bottom-style
b) border-collapse
c) border-style-bottom
d) none of the mentioned
View Answer
Answer: a
Explanation: Self-explainatory.
advertisement
4. Which of the following property defines the style for the left border of an element?
a) border-style
b) border-left-style
c) border-left-width
d) border-right
View Answer
Answer: b
Explanation: Self-explainatory.
5. Which of the following visibility property value is described by The element is not visible,
but the layout of surrounding elements is not affected?
a) visible
b) hidden
c) collapse
d) none of the mentioned
View Answer
Answer: b
Explanation: None.
6. Which of the following display property value is described by used internally by browsers
to create list items. Of no practical value to web designers?
a) inline-block
b) list-item
c) group
d) none
View Answer
Answer: b
Explanation: Self-explainatory.
7. Which of the following property controls the horizontal overflow of a block or inline block?
a) overflow-x
b) overflow
c) overflow-y
d) overflow-k
View Answer
Answer: a
Explanation: Self-explainatory.
9. Which of the following property sets a consistent margin on all four sides of the affected
element?
a) boder
b) margin
c) padding
d) none fof the mentioned
View Answer
Answer: b
Explanation: Self-explainatory.
10. Which of the following box-sizing property value is described by width and height
include content, padding, and borders?
a) border-box
b) content-box
c) content-box
d) none fof the mentioned
View Answer
Answer: a
1. Which of the following property sets the background image to scroll or not to scroll with its
associated element’s content?
a) background-scroll
b) background-attach
c) background-attachment
d) background-allowance
View Answer
Answer: c
Explanation:
Syntax: background-attachment: scroll | fixed | inherit
advertisement
2. Which of the following property sets an element’s background color?
a) background-image
b) background-color
c) background-colors
d) background-position
View Answer
Answer: b
Explanation:
Syntax: background-color: color | transparent
3. Which of the following property defines the color of an element’s right border?
a) border-right-colors
b) border-right-color
c) border-right
d) border-color
View Answer
Answer: b
Explanation:
Sanfoundry Certification Contest of the Month is Live. 100+ Subjects. Participate
Now!
Syntax: border-right-color: color | transparent
4. Which of the following property defines the space between cells in a table?
a) auto
b) border
c) spacing
d) border-spacing
View Answer
Answer: d
Explanation:
Syntax: border-spacing: non-negative length(s) | inherit
5. Which of the following property defines the visual style of up to four different sides of a
border?
a) border-color
b) border-img
c) border-visual
d) border-style
View Answer
Answer: b
Explanation:
Syntax: border-style: style
6. Which of the following property defines in a shorthand form the width, style, and color for
the top border of an element?
a) border-style
b) border-height
c) border-width
d) border-top
View Answer
Answer: d
Explanation:
Syntax: border-top: border-width border-style border-color;
7. Which of the following property sets the shadow for a box element?
a) shadow
b) set-shadow
c) canvas-shadow
d) box-shadow
View Answer
Answer: b
Explanation:
Syntax:box-shadow: none | inherit
9. Which of the following property defines a shadow color for the right and bottom edges of
a scroll bar?
a) scrollbar-darkshadow
b) scrollbar-shadow-color
c) scrollbar-darkshadow-color
d) none of the mentioned
View Answer
Answer: c
Explanation:
Syntax: scrollbar-darkshadow-color: color
10. Which of the following property defines a color for the right and bottom edges of a scroll
bar.
a) scrollbar-color
b) scrollbar-darkshadow-color
c) scrollbar-shadow
d) scrollbar-shadow-color
View Answer
Answer: d
Explanation:
CSS Questions & Answers – Styling Lists and
Navigation Menus
This set of CSS online quiz focuses on “Styling Lists and Navigation Menus”.
advertisement
2. Which of the following property assigns a graphic image to a list item?
a) list-image-style
b) list-style-image
c) list-image
d) none of the mentioned
View Answer
Answer: b
Explanation:
Syntax: list-style-image: url(url of image) | none
3. Which of the following property specifies whether the labels for an element’s list items are
positioned inside or outside the “box” defined by the listed item?
a) list-style
b) list-position
c) list-style-position
d) list-position-style
View Answer
Answer: c
Explanation:
Subscribe Now: CSS Newsletter | Important Subjects Newsletters
Syntax: list-style-position: inside | outside | inherit
6. Which of the following property defines in a shorthand form the width, style, and color for
the left border of an element?
a) border
b) border-style
c) border-left
d) none of the mentioned
View Answer
Answer: b
Explanation:
Syntax: border-left: border-width border-style border-color;
8. Which of the following property influences the horizontal alignment of an element, making
it “float” toward the left or right margin of its containing element?
a) float
b) float-left
c) float-right
d) float-align
View Answer
Answer: d
Explanation:
Syntax: float: left | right | none | inherit;
9. Which of the following property sets the font face to be used for text?
a) font
b) font-text
c) font-family
d) none of the mentioned
View Answer
Answer: c
Explanation:
Syntax: font-family: font 1
10. Which of the following property sets the font size of text?
a) font
b) font-text
c) font-size
d) none of the mentioned
View Answer
Answer: c
8. The __________ property specifies the type of positioning method used for an element.
a) align
b) float
c) position
d) padding
View Answer
Answer: c
Explanation: None.
1. Which of the following selector selects all elements of E that have the attribute attr that
end with the given value?
a) E[attr^=value]
b) E[attr$=value]
c) E[attr*=value]
d) none of the mentioned
View Answer
Answer: b
Explanation:
Example: p[title$="!"] {color: red;}
2. Which of the following selector selects the elements that are checked?
a) E ~ F
b) ::after
c) :checked
d) none of the mentioned
View Answer
Answer: c
Explanation:
advertisement
Example: :checked {color: blue;}
3. Which of the following selector selects the elements that are the default among a set of
similar elements?
a) :default
b) :%
c) :disabled
d) none of the mentioned
View Answer
Answer: a
Explanation:
Subscribe Now: CSS Newsletter | Important Subjects Newsletters
Example: :default {background-color: red;}
5. Which of the following selector selects the elements that are currently enabled?
a) :element
b) :empty
c) :enabled
d) none of the mentioned
View Answer
Answer: c
Explanation:
Example: input:enabled {background-color:white;}
6. Which of the following selector selects the element that is the first child of its parent that
is of its type?
a) :first-of-type
b) :last-child
c) ::first-line
d) ::first-letter
View Answer
Answer: a
Explanation:
Example: strong:first-of-type {font-size:bigger;}
7. Which of the following selector selects elements that do not match the selector s?
a) :!(s)
b) :nth-child(s)
c) :not(s)
d) none of the mentioned
View Answer
Answer: c
Explanation:
Example: *:not(h1) {color: black;}
8. Which of the following selector selects an element if it’s the only child of its parent?
a) :root
b) :nth-oftype(n)
c) :only-child
d) none of the mentioned
View Answer
Answer: c
Explanation:
Example: h1:only-child {color: blue;}
9. Which of the following selector selects the element that is the target of a referring URI?
a) :target
b) :selection
c) ::selection
d) :URI
View Answer
Answer: a
Explanation:
Example: :target{color:red;}
10. Which of the following selector applies styles to elements that are valid per HTML5
validations set either with the pattern or type
attributes?
a) :valid
b) :required
c) :optional
d) :invalid
View Answer
Answer: a
p {line-height: 150%;}
a) class Selectors
b) element Selectors
c) id Selectors
d) none of the mentioned
View Answer
Answer: b
Explanation: These selectors are called element selectors and are simply used
as follows:
element-name { /* properties */ }
3. The _____________ attribute is used to define the name(s) of the class(es) to which a
particular tag belongs.
a) class
b) element
c) id
d) none of the mentioned
View Answer
Answer: a
Explanation: Self-explainatory.
5. A similar rule called the ____________ is specified using the plus sign (+) and is used to
select elements that would be siblings of each other.
a) class selectors
b) attribute selectors
c) adjacent-sibling selector
d) none of the mentioned
View Answer
Answer: c
Explanation: Self-explainatory.
6. Which of the following selectors selects any tag with an id attribute set?
a) E#id
b) .class
c) #id
d) *
View Answer
Answer: c
Explanation: Example:#test {color: green;}
/* makes a tag with id=’test’ green */
a) E > F
b) E F
c) E + F
d) E ~ F
View Answer
Answer: a
Explanation: Example:
body > p {background-color: yellow;}
/* makes all p tags that have the
body tag as their immediate parent
have the background color yellow */
View Answer
Answer: b
Explanation: Example:
p ~ strong {font-style: italic;}
/* sets the font style to italic on
all strong tags that have a p tag
as a preceding sibling */
9. Which of the following selectors selects the specified elements of type E with a particular
class value?
a) E.class
b) E ~ F
c) *
d) E, F, G
View Answer
Answer: a
Explanation: Example:
h1.note {text-decoration: underline;}
/* underlines all h1 tags with
class='note' */
View Answer
Answer: c
CSS Questions & Answers – Appearance of
Form Elements
This set of CSS Multiple Choice Questions & Answers (MCQs) focuses on “Appearance of
Form Elements”.
advertisement
2. Which one can animate the width of search input when get focus?
a) focus
b) transition
c) outline
d) color
View Answer
Answer: b
Explanation: For animating the width of search input when it gets focus we used CSS
transition property,
input[type=text] {-webkit-transition: width 09s ease-in-out; transition:
width 0.9s ease-in-out; } input[type=text]:focus {width:100%;}
4. Which of the following is not the pseudo class for CSS Basic UI Level3?
a) :optional
b) :read-only
c) :valid
d) :checked
View Answer
Answer: d
Explanation: CSS Basic UI Level 3 has many pseudo-classes
like :widget, :invalid, :valid, :in-range, :required, :read-write, :read-only, :optional, :out-of-
range. CSS Selector Level 3 has the classes :disabled, :enabled, :indeterminate, :checked.
1. Which value specifies a transition effect with a slow start, then fast, then end slowly?
a) ease
b) linear
c) ease-in
d) ease-out
View Answer
Answer: a
Explanation: The transition-timing-function property takes the value ease. It specifies a
transition effect with a slow start, then fast, then end slowly and this is the default value,
ease-in specifies a transition effect with a slow start.
2. Which of the following specifies a transition effect with same speed from start to end?
a) linear
b) ease-out
c) ease-in-out
d) ease
View Answer
Answer: a
Explanation: linear value specifies a transition effect with the same speed from start to end,
ease-in-out specifies a transition effect with a slow start and end, ease-out specifies a
transition with a slow end.
3. Which of the following specifies how many seconds a transition effect takes to complete?
a) transition-delay
b) transition-duration
c) transition-property
d) transition
View Answer
Answer: b
Explanation: transition-duration specifies how many seconds or milliseconds a transition
effect takes to complete, a transition is a shorthand property for setting the four transition
properties into a single property.
advertisement
4. What specifies the speed curve of transition effect?
a) transition-delay
b) transition-property
c) transition-timing-function
d) transition-duration
View Answer
Answer: c
Explanation: transition-timing-function specifies the speed curve of transition effect,
transition-property specifies the name of the CSS property the transition effect is for,
transition-delay specifies a delay in seconds for transition effect.
5. Which of the following defines a MIME string format of the content being returned?
a) content-type:string
b) expires:date string
c) location:URL string
d) last-modified:string
View Answer
Answer: a
Explanation: Content-type:string is a MIME string defining the format of the content being
returned, example is content-type:text/html, last-modified: string defines the date of last
modification of the file.
7. Which of the following specifies the length of the data being returned?
a) set-cookie: string
b) location: URL string
c) content-length: string
d) last-modified: string
View Answer
Answer: c
Explanation: content-length: string specifies the length in bytes of the data being returned.
The browser uses this value to report the estimated download time for a file. Set-cookie:
string set the cookie passed through the string.
10. Which of the following gives the path for CGI script?
a) remote_host
b) remote_addr
c) query_string
d) path_info
View Answer
Answer: d
Explanation: path_info provides the path for the CGI script, query_string gives URL-
encoded information that is sent with GET method request, remote_addr gives the IP
address of the remote host making the request.
2. Which of the following selects all elements that are siblings of the specified element?
a) child selector
b) general sibling selector
c) adjacent sibling selector
d) descendant selector
View Answer
Answer: b
Explanation: General sibling selector selects all elements that are siblings of a specified
element, adjacent sibling selector selects all elements that are adjacent siblings of the
specified element, child selector selects all elements that are immediate children of the
specified element.
5. Which web font was developed by Apple and Microsoft in the late 1980s?
a) TTF
b) OTF
c) WOFF
d) WOFF 2.0
View Answer
Answer: a
Explanation: TrueType (TTF) is a font standard developed in the late 1980s by Microsoft
and Apple. It is the most common font format for both Microsoft Windows and Mac OS
operating systems.
13. How many values are there for the object-fit property?
a) 2
b) 5
c) 3
d) 4
View Answer
Answer: b
Explanation: object-fit property can have 5 properties names fill, contain, cover, none, scale-
down. The default value is fill, the replaced content is sized to fill element’s content box,
with help of contain the replaced content is scaled to maintain its aspect ratio while fitting
element’s content box.
14. Which property specifies the number of columns an element should be divided into?
a) column-rule
b) column-count
c) column-gap
d) column-fill
View Answer
Answer: b
Explanation: column-count specifies the number of columns an element should be divided
into, column-fill specifies how to fill the columns, column-gap specifies the gap between
columns, column-rule is for setting all the column-rule properties.
Question 1:
What does CSS stand for?
Question 2:
What is the correct HTML for referring to an external style sheet?
<style src="mystyle.css">
<stylesheet>mystyle.css</stylesheet>
Question 3:
Where in an HTML document is the correct place to refer to an external style
sheet?
<script>
<css>
Question 5:
Which HTML attribute is used to define inline styles?
class
styles
font
Question 6:
Which is the correct CSS syntax?
body:color=black;
{body;color:black;}
{body:color=black;}
Question 7:
How do you insert a comment in a CSS file?
// this is a comment //
// this is a comment
Question 8:
Which property is used to change the background color?
color
bgcolor
Question 9:
How do you add a background color for all <h1> elements?
all.h1 {background-color:#FFFFFF;}
h1.all {background-color:#FFFFFF;}
Question 10:
Which CSS property is used to change the text color of an element?
text-color Your answer
fgcolor
Question 11:
Which CSS property controls the text size?
text-style
text-size
font-style
Question 12:
What is the correct CSS syntax for making all the <p> elements bold?
p {text-size:bold;}
<p style="font-size:bold;">
<p style="text-size:bold;">
Question 13:
How do you display hyperlinks without an underline?
a {decoration:no-underline;}
a {underline:none;}
Question 14:
How do you make each word in a text start with a capital letter?
transform:capitalize
Question 15:
Which property is used to change the font of an element?
font-style
Question 16:
How do you make the text bold?
font:bold;
style:bold;
Question 17:
How do you display a border like this:
Question 18:
Which property is used to change the left margin of an element?
indent
padding-left
Question 19:
When using the padding property; are you allowed to use negative values?
No Correct answer
Question 20:
How do you make a list that lists its items with squares?
list: square;
Question 21:
How do you select an element with id 'demo'?
*demo
demo
Question 22:
How do you select elements with class name 'test'?
test
#test
*test
Question 23:
How do you select all p elements inside a div element?
div + p
Question 24:
How do you group selectors?
Question 25:
What is the default value of the position property?
fixed
absolute
2. Which of the following defined as alphanumeric names that correspond to some current
counter value in a document?
a) Class
b) Key
c) Counters
d) None of the mentioned
View Answer
Answer: c
Explanation: Counters demonstrate the possibility of variable-like values in CSS. They are
defined as alphanumeric names that correspond to some current counter value in a
document.
3. Which of the following is the Color Format that is a CSS’s six-digit hexadecimal format as
color defined in (X)HTML?
a) Specification defined named colors
b) System Color Names
c) 6-Hex Color
d) 3-Hex Color
View Answer
Answer: c
Explanation: CSS’s six-digit hexadecimal format is the same as color defined in (X)HTML.
The format specifies color as #rrggbb, where rr is the amount of red, gg the amount of
green, and bb the amount of blue, all specified in a hexadecimal value ranging from 00 to
FF.
advertisement
4. Which of the following is the Color Format that is the CSS3 HSL value with a fourth value
to set the alpha channel value for the color to define the opacity of the element?
a) HSLa Color
b) HSL Color
c) RGBa Color
d) RGB Color
View Answer
Answer: a
Explanation: An HSLa is specified via a function style hsla(hue,saturation, lightness, alpha),
where hue, saturation, and lightness are the same as standard hsl() values, and the alpha
channel value for defining opacity is a number between 0 (fully transparent) and 1 (fully
opaque).
5. Which of the following is the Color Format that is a defined using the keyword rgb,
followed by three numbers between 0 and 255, contained in parentheses and separated by
commas, with no spaces between them.
a) HSLa Color
b) HSL Color
c) RGBa Color
d) RGB Color
View Answer
Answer: d
Explanation: RGB color values can also be defined using percentages. The format is the
same, except that the numbers are replaced by
percentage values between 0% and 100%.
6. Which of the following property allows the text direction to be overridden to support
multiple languages and text flow directions in the same document?
a) unicode-bidi
b) visibility
c) top
d) vertical-align
View Answer
Answer: a
Explanation: Syntax:
unicode-bidi: bidi-override | embed | normal| inherit
7. Which of the following property determines whether or not an element is visible?
a) display
b) visibility
c) transperancy
d) disappear
View Answer
Answer: b
Explanation: This property is not the same as display: none as it simply makes the item
invisible; it does not completely remove it from the display canvas.
8. Which of the following property controls how spaces, tabs, and newline characters are
handled in an element?
a) space
b) display
c) widows
d) white-space
View Answer
Answer: d
Explanation: The values of pre-wrap and pre-line are not supported in older browsers.
9. Which of the following property defines the minimum number of lines in a paragraph to be
left at the top of a page?
a) white-space
b) widows
c) display
d) width
View Answer
Answer: b
Explanation: This property is really only meaningful in a paged environment, such as print
output.
10. Which of the following property sets the spacing between words?
a) display
b) white-space
c) sr
d) word-spacing
View Answer
Answer: d
Explanation: Syntax:
1. Which of the following property sets in a shorthand form any or all background
properties?
a) font
b) background
c) background-color
d) background-position
View Answer
Answer: b
Explanation: Syntax:
background: background-color background-image background-repeat background-
attachment background- position;
2. Which of the following property defines whether table cell borders are connected or
separate?
a) border-style
b) border-collapse
c) border-color
d) border-bottom-width
View Answer
Answer: b
Explanation:
Syntax: border-collapse: collapse | separate | inherit
3. Which of the following property defines the style for the right border of an element?
a) border-left
b) border-right
c) border-right-style
d) border-style
View Answer
Answer: c
Explanation:
advertisement
1. Which of the following css property specifies an image to use as the background of an
element?
a) background
b) background-img
c) background-image
d) none of the mentioned
View Answer
Answer: c
Explanation: Self-explainatory.
2. Which of the following css property specifies a delay for the transition effect?
a) transition-delay
b) transition-effect
c) transition
d) transition-duration
View Answer
Answer: a
Explanation: Self-explainatory.
3. Which of the following method rotates an element around its Y-axis at a given degree
using tranform 3D?
a) rotateY()
b) rotate-Y()
c) rotate-Yaxis()
d) none of the mentioned
View Answer
Answer: a
Explanation: Self-explainatory.
advertisement
4. Which of the following property defines where a 3D element is based in the x- and the y-
axis?
a) transform-style
b) perspective(n)
c) perspective-origin
d) none of the mentioned
View Answer
Answer: c
Explanation: Self-explainatory.
5. Which of the following css property repeats an image both horizontally and vertically?
a) background
b) background-image
c) background-repeat
d) background-position
View Answer
Answer: c
Explanation: Self-explainatory.
6. Which of the following CSS3 property specifies how nested elements are rendered in 3D
space?
a) transform
b) transform-style
c) transform-render
d) none of the mentioned
View Answer
Answer: c
Explanation: Self-explainatory.
7. Which of the following CSS3 property specifies the intrinsic resolution of all raster images
used in/on the element?
a) image-orientation
b) image-rendering
c) image-resolution
d) all of the mentioned
View Answer
Answer: c
Explanation: Self-explainatory.
8. Which of the following CSS3 property specifies how the contents of a replaced element
should be fitted to the box established by its used height and width?
a) object-fit
b) object-position
c) image-orientation
d) none of the mentioned
View Answer
Answer: a
Explanation: Self-explainatory.
9. Which of the following CSS3 property specifies the alignment of the replaced element
inside its box?
a) object
b) object-allign
c) object-position
d) object-render
View Answer
Answer: c
Explanation: Self-explainatory.
10. Which of the following css property defines whether or not an element should be visible
when not facing the screen?
a) visibility
b) backface-control
c) backface-visibility
d) none of the mentioned
View Answer
Answer: c
1. Which of the following selector is used to select and style when you place mouse over it?
a) focus
b) hover
c) mouse
d) all of the mentioned
View Answer
Answer: b
Explanation: Self-explainatory.
2. Which of the following method increases or decreases the size of an element using
tranform?
a) rotate()
b) scale()
c) translate()
d) matrix()
View Answer
Answer: b
Explanation: Self-explainatory.
3. Which of the following method moves an element from its current position using
tranform?
a) rotate()
b) scale()
c) translate()
d) matrix()
View Answer
Answer: c
Explanation: Self-explainatory.
advertisement
4. Which of the following property specifies the speed curve of the transition effect?
a) transition-delay
b) transition-duration
c) transition-timing-function
d) transition
View Answer
Answer: c
Explanation: Self-explainatory.
5. Which of the following method skews an element along the X-axis by the given angle
using tranform?
a) skewX()
b) skewy()
c) x-axis()
d) skew()
View Answer
Answer: a
Explanation: Self-explainatory.
6. Which of the following method skews an element along the X and Y-axis by the given
angles using tranform?
a) skewX()
b) skewy()
c) skew-X-Y()
d) skew()
View Answer
Answer: d
Explanation: Self-explainatory.
9. Which of the following transition-timing-function property lets you define your own values
in a cubic-bezier function
a) cubic(n,n,n,n)
b) matrix(n,n,n,n)
c) cubic-bezier(n,n,n,n)
d) none of the mentioned
View Answer
Answer: c
Explanation: Self-explainatory.
10. Which of the following method combines all the 2D transform methods into one using
transform?
a) combine()
b) 2D-tranform()
c) matrix()
d) matrix-2D()
View Answer
Answer: c
a) <image>
b) <svg>
c) <img>
d) <graph>
View Answer
Answer: b
Explanation: Self-explainatory.
Answer: c
Explanation: Self-explainatory.
advertisement
a) <cir>
b) <round>
c) <circle>
d) <ellipse>
View Answer
Answer: c
Explanation: Self-explainatory.
Answer: b
Explanation: Self-explainatory.
6. Which of the following is not an attribute used with SVG ellipse?
a) cx
b) cy
c) rr
d) ry
View Answer
Answer: c
Explanation: Self-explainatory.
a) <line>
b) <dot>
c) <ray>
d) <stick>
View Answer
Answer: a
Explanation: Self-explainatory.
9. Which of the following element is used to create any shape that consists of only straight
lines?
a) <polyogn>
b) <polyline>
c) <lines>
d) <multiline>
View Answer
Answer: b
Explanation: Self-explainatory.
10. Which of the following defines the color of a line, text or outline of an element?
a) text
b) stroke
c) line
d) all of the mentioned
View Answer
Answer: d
1. Which of the following css property allows elements to be offset, rotated, scaled, and
skewed in a variety of different ways?
a) transform-3D
b) transform-origin
c) transform
d) transition
View Answer
Answer: c
Explanation:
Syntax: transform: list of transform-functions | none
2. Which of the following css property is used to define a delay before an animation starts?
a) delay
b) transition-delay
c) transform-delay
d) none of the mentioned
View Answer
Answer: b
Explanation:
advertisement
4. Which of the following css property is used to define which properties a transition will be
applied to?
a) animation-property
b) transition-property
c) css3-property
d) none of the mentioned
View Answer
Answer: b
Explanation:
Syntax: transition-property: all | none | property-name-1
5. Which of the following css property is used to describe how the animation will play?
a) animation-timing-function
b) css3-timing-function
c) transform-timing-function
d) transition-timing-function
View Answer
Answer: d
Explanation:
Syntax:transition-timing-function transition-timing-function:
timingfunction,timingfunction2,...timingfunctionN]
6. Which of the following css property is used to define a delay before an animation starts?
a) transform-delay
b) delay-function
c) delay-animation
d) animation-delay
View Answer
Answer: d
Explanation: None.
Syntax: animation-delay: time1 [,..timeN]
7. Which of the following css property is used to indicate if an animation plays in reverse or
repeats itself every other iteration?
a) animation-iteration
b) animation-check
c) animation-direction
d) animation-state
View Answer
Answer: c
Explanation:
Syntax: animation-direction: normal | alternate [,normal | alternate
8. Which of the following css property is used to define the time it takes one iteration of an
animation to play?
a) animation-duration
b) animation-time
c) animation-value
d) none of the mentioned
View Answer
Answer: a
Explanation:
Syntax: animation-duration: time
9. Which of the following css property is used to define the number of times an animation
should play?
a) scale-iteration-count
b) transtion-iteration-count
c) animation-iteration-count
d) all of the mentioned
View Answer
Answer: c
Explanation:
Syntax: animation-iteration-count: number | infinite
10. Which of the following css property is used to define the animations that should be run?
a) animation-run
b) animation-name
c) transtion-name
d) none of the mentioned
View Answer
Answer: d
Explanation