Unit 2 CSS Class XI IT Question Answer | CBSE

Gretakgawshik

1 year ago

Imagine you’ve built a toy house with blocks. Now, you want to paint it, add curtains, and make it pretty. That’s what CSS does for websites! This article provide you a complete question answer from Basics About CSS Class XI IT, CBSE

Websites have content like text and pictures. But how should it all look? What color? How big? That’s where CSS comes in. CSS is like the paint and decorations for a website. It makes websites colorful, stylish, and easy to read. Just like how you’d decorate your room to make it cozy and pretty, we use CSS to decorate websites.

So, in short, CSS makes our websites look good!

Why do we use CSS? What are its basic advantages? (all the question are from CSS Class XI IT)

Answer: CSS, or Cascading Style Sheets, is used to style and layout web pages. Its advantages include:

Separation of content and design.
Site-wide consistency.
Reusability and reduced duplication.
Enhanced user experience through responsive design.
Efficient page loading.

What are the ways in which you can use CSS in your HTML document?

Answer: There are three ways:

Inline styles
Internal (or embedded) style sheets
External style sheets

What are inline style sheets?

Answer: Inline style sheets refer to CSS styles that are applied directly on individual elements in the HTML using the style attribute.

How are internal style sheets used?

Answer: Internal style sheets are defined within the <style> tag in the <head> section of an HTML document.

Does the use of CSS save time?

Answer: Yes, CSS saves time. By using external or internal style sheets, you can apply styles to multiple elements or entire pages at once, eliminating the need to style each element individually.

How are external style sheets used?

Answer: External style sheets are saved in a separate .css file. This file is linked to the HTML document using the <link> tag in the <head> section.

State the difference between inline, internal, & external style sheets?

Answer:

Inline: Applied to individual elements using the style attribute.
Internal: Defined within the <style> tag in the <head> of the HTML.
External: Stored in a separate .css file and linked to the HTML.

Why are universal and type selectors used?

Answer: Universal selectors apply styles to all elements on a page, while type selectors apply styles to all elements of a particular type.

What do we do when we have to apply a style rule to a particular element only when it lies inside a particular element?

Answer: Use descendant selectors. For example, div p { color: red; } styles only the paragraphs (p) that are inside a div.

Explain the id selector. (all the question are from CSS Class XI IT)

Answer: The id selector targets an element with a specific id attribute. It’s represented with a #. For example, #header { background-color: blue; } targets the element with id="header".

Can we define multiple style rules?

Answer: Yes, you can define as many style rules as needed in CSS to style your document.

What are the rules to override any style sheet? (all the question are from CSS Class XI IT)

Answer: Style precedence in CSS follows this order: inline styles, internal style sheets, external style sheets. Additionally, !important can be used to give priority to a specific rule.

How are the color codes represented in a style sheet?

Answer: Colors can be represented using:

Named colors, e.g., red.
Hexadecimal, e.g., #FF0000.
RGB values, e.g., rgb(255, 0, 0).
RGBA values for transparency, e.g., rgba(255, 0, 0, 0.5).

How do we select a background attachment? (all the question are from CSS Class XI IT)

Answer: Use the background-attachment property. Values can be scroll, fixed, or local.

Can we set the text direction? If yes then how?

Answer: Yes, using the direction property. Values can be ltr (left-to-right) or rtl (right-to-left).

Is RGB() property supported by all browsers?

Answer: Yes, the rgb() property is widely supported by all modern web browsers. It’s a fundamental part of CSS that allows designers and developers to define colors using red, green, and blue components. The broad acceptance and implementation of this property in browsers makes it a reliable choice for web design and development.

Unit 2 HTML Class XI IT Exercise Question Answer | CBSE

CSS Interview Questions and Answers

Below are 50 multiple-choice questions (MCQ) about the basics of CSS suitable for Interview, along with their respective answers:

What does CSS stand for?
- A. Computer Style Sheets
- B. Cascading Style Sheets
- C. Colorful Style Sheets
- D. Computerized System Styles
- Answer: B. Cascading Style Sheets
Which tag is used in HTML to link to an external CSS file?
- A. <link>
- B. <stylesheet>
- C. <style>
- D. <css>
- Answer: A. <link>
Which HTML attribute is used to define styles inline?
- A. stylesheet
- B. styles
- C. css
- D. style
- Answer: D. style
How can you add a comment in a CSS file?
- A. //This is a comment//
- B. –This is a comment–
- C. /*This is a comment*/
- D. <!–This is a comment–>
- Answer: C. /*This is a comment*/
Which property is used to set the font size?
- A. text-size
- B. font-style
- C. text-style
- D. font-size
- Answer: D. font-size
Which CSS property changes the background color of an element?
- A. background-color
- B. color
- C. bgcolor
- D. background
- Answer: A. background-color
What does the CSS ‘margin’ property define?
- A. The spacing between the content of an element and its border
- B. The spacing around elements
- C. The thickness of the element’s border
- D. The opacity of the element
- Answer: B. The spacing around elements
Which of these is NOT a valid color value in CSS?
- A. red
- B. #FF0000
- C. rgb(255,0,0)
- D. color(255,0,0)
- Answer: D. color(255,0,0)
What is the default value of the position property?
- A. fixed
- B. relative
- C. absolute
- D. static
- Answer: D. static
Which property is used to control the wrapping of lines?
- A. white-space
- B. wrap-text
- C. line-wrap
- D. text-wrap
- Answer: A. white-space
Which of these is NOT a CSS pseudo-class?
- A. :first-child
- B. :second-item
- C. :hover
- D. :not
- Answer: B. :second-item
What does the CSS display property with the value none do?
- A. Makes the element transparent
- B. Reduces the size of the element to zero
- C. Hides the element
- D. Makes the element a block-level element
- Answer: C. Hides the element
Which of these is a correct way to apply multiple classes to an HTML element?
- A. <div class="class1, class2">
- B. <div class="class1 class2">
- C. <div class=".class1 .class2">
- D. <div class="class1+class2">
- Answer: B. <div class="class1 class2">
How is a class selector represented in CSS?
- A. $classname
- B. classname{}
- C. .classname
- D. #classname
- Answer: C. .classname
How is an ID selector represented in CSS?
- A. $idname
- B. idname{}
- C. .idname
- D. #idname
- Answer: D. #idname
Which property is used to add rounded corners to an element?
- A. border-radius
- B. border-corner
- C. round-corner
- D. curve-edge
- Answer: A. border-radius
What unit is NOT used to define font sizes in CSS?
- A. px
- B. em
- C. dm
- D. rem
- Answer: C. dm
Which CSS property is used to set the horizontal alignment of text?
- A. text-align
- B. text-horizontal
- C. text-style
- D. align-text
- Answer: A. text-align
What is the default value of the z-index property?
- A. 0
- B. auto
- C. 1
- D. -1
- Answer: B. auto
Which property can be used to set the space between the characters of text?
- A. letter-spacing
- B. text-spacing
- C. character-gap
- D. font-spacing
- Answer: A. letter-spacing
The CSS flexbox layout is most appropriate for:
- A. Positioning items in a one-dimensional layout
- B. Creating a grid of items
- C. Styling text
- D. Creating animations
- Answer: A. Positioning items in a one-dimensional layout
To apply styles to an element when the mouse is over it, which pseudo-class should be used?
- A. :hover
- B. :mouseover
- C. :focus
- D. :click
- Answer: A. :hover
Which of the following values of the overflow property will not hide any overflowing content?
- A. visible
- B. scroll
- C. hidden
- D. auto
- Answer: A. visible
The CSS box-sizing property with the value border-box does what?
- A. Includes padding and border in the total width/height
- B. Excludes padding and border from the total width/height
- C. Adds extra space for the border
- D. None of the above
- Answer: A. Includes padding and border in the total width/height
Which of the following is NOT a valid value for the display property?
- A. inline
- B. block
- C. circle
- D. flex
- Answer: C. circle
Which property is used to set the stacking order of positioned elements?
- A. order
- B. z-order
- C. z-level
- D. z-index
- Answer: D. z-index
The !important rule in CSS is used to:
- A. Comment out code
- B. Make an animation more important
- C. Give a style rule higher importance than other defined rules
- D. Make a text important
- Answer: C. Give a style rule higher importance than other defined rules
What is the correct syntax to select all <p> elements inside a <div> element in CSS?
- A. p + div
- B. div p
- C. div > p
- D. p.div
- Answer: B. div p
Which of the following is NOT a CSS property used to manage space inside an element?
- A. border
- B. padding
- C. margin
- D. volume
- Answer: D. volume
Which of the following CSS properties will NOT affect the position of an element?
- A. border
- B. float
- C. position
- D. left
- Answer: A. border
The property used to specify the space between cells in a table is:
- A. border-spacing
- B. cell-gap
- C. cell-spacing
- D. table-gap
- Answer: A. border-spacing
Which of the following is NOT a valid border style in CSS?
- A. dotted
- B. wavy
- C. dashed
- D. solid
- Answer: B. wavy
Which CSS unit is relative to the root font size of the document?
- A. em
- B. px
- C. rem
- D. pt
- Answer: C. rem
Which property allows you to create a shadow effect around an element’s frame?
- A. box-shadow
- B. border-shadow
- C. frame-shadow
- D. element-shadow
- Answer: A. box-shadow
Which CSS method allows for multiple backgrounds on an element?
- A. Using the multi-background property
- B. Applying multiple background-image properties
- C. Comma separating values in the background-image property
- D. Using the backgrounds property
- Answer: C. Comma separating values in the background-image property
What does the opacity property do in CSS?
- A. Sets the thickness of an element’s border
- B. Defines the transparency level for an element
- C. Sets the color saturation of an element
- D. Specifies the boldness of a font
- Answer: B. Defines the transparency level for an element
In a CSS rule, what is the part that gets styled called?
- A. Property
- B. Selector
- C. Method
- D. Argument
- Answer: B. Selector
Which CSS property helps to animate an element smoothly from one style to another?
- A. animation
- B. movement
- C. animate
- D. transition
- Answer: D. transition
In CSS, which of these is a way to define colors using the Red-Green-Blue system?
- A. RGB(255, 255, 255)
- B. COLOR(255, 255, 255)
- C. #FFFFFF
- D. COLOR: WHITE
- Answer: A. RGB(255, 255, 255)
What is the purpose of the :after pseudo-element in CSS?
- A. Select elements after the current element
- B. Insert content after the content of an element
- C. Style the text after a specific word
- D. Animate elements after a certain duration
- Answer: B. Insert content after the content of an element
If you want an element to not be displayed, but still occupy space, which value of the visibility property would you use?
- A. visible
- B. hidden
- C. none
- D. collapse
- Answer: B. hidden
Which of the following CSS properties can have a value of bold?
- A. font-weight
- B. font-style
- C. text-size
- D. text-weight
- Answer: A. font-weight
What does vh stand for in CSS units?
- A. Vertical Height
- B. Very High
- C. Viewport Height
- D. Virtual Horizontal
- Answer: C. Viewport Height
Which CSS property adjusts the space between lines of text?
- A. text-space
- B. line-spacing
- C. line-height
- D. text-line
- Answer: C. line-height
Which of the following is NOT a valid CSS unit?
- A. cm
- B. inch
- C. px
- D. em
- Answer: B. inch
What is the CSS property to set an image as a background on a web page?
- A. background-image
- B. background
- C. bgcolor
- D. image-background
- Answer: A. background-image
Which property is used to specify whether an element’s box is sized to include padding and border or not?
- A. box-sizing
- B. box-shape
- C. box-style
- D. box-mode
- Answer: A. box-sizing
Which pseudo-class is used to select the first line of an element?
- A. :first-line
- B. :beginning
- C. :line-start
- D. :start-line
- Answer: A. :first-line
Which property can be used to specify the space between words in a text?
- A. word-spacing
- B. text-gap
- C. text-space
- D. word-gap
- Answer: A. word-spacing
What is the correct way to specify a fallback font in CSS?
- A. font-family: "Times New Roman", Times, serif;
- B. font-family: Times New Roman or Times or serif;
- C. font-family: "Times New Roman" || Times || serif;
- D. font-family: "Times New Roman" > Times > serif;
- Answer: A. font-family: "Times New Roman", Times, serif;