Cascading Style Sheets

Overview

Rewards

FAQs

Overview

CSS (Cascading Style Sheets) is a styling language used to design and format web pages, controlling layout, colors, fonts, and animations. It works alongside HTML to enhance user experience by making websites visually appealing and responsive across devices. With features like Flexbox, Grid, and media queries, CSS enables precise control over web design while maintaining clean, efficient code. Its cascading nature allows styles to inherit and override rules, ensuring consistency and flexibility in modern web development.

Take this assessment to check how good you are with CSS.

Click the Rewards tab for eligibility requirements.

Read the FAQs tab carefully for Instructions before beginning the assessment.

Rewards

NYXPoints are used to generate the Leaderboard (coming soon). They are awarded for achieving a certain score.

200 nyxpoints for a passing score of 80% or more
300 nyxpoints for a perfect score of 100%
Didn’t pass? You still get 30 nyxpoints for attempting the assesment

FAQs

IMPORTANT instructions for taking the Assessment

The timer starts when you click Start Assessment
DO NOT refresh/reload the page or use the back button to navigate away from the page.
Navigating away from the assessment page DOES NOT stop/pause the timer and the will restart the assessment when you come back to it. The answers are NOT saved.

General

There are NO pre-requisites to take this assessment. Take this assessment even if you are completely new to Linux.
The assessment is completely FREE.
Preferably take it in a closed book mode.
DO NOT copy/paste, share or upload questions elsewhere.

Eligible Rewards

300 NyxCoins*

* NyxCoins vary on score

Questions

Minutes

1 %

Passing Score

Time limit: 0

Assessment Summary

0 of 30 Questions completed

Questions:

Information

You have already completed the assessment before. Hence you can not start it again.

Assessment is loading…

You must sign in or sign up to start the assessment.

You must first complete the following:

Results

Assessment complete. Results are being recorded.

Results

0 of 30 Questions answered correctly

Your time:

Time has elapsed

You have reached 0 of 0 point(s), (0)

Earned Point(s): 0 of 0, (0)
0 Essay(s) Pending (Possible Point(s): 0)

Average score
Your score

Categories

Not categorized 0%

Current
Review
Answered
Correct
Incorrect

Question 1 of 30

1. Question
Which CSS property is used to change the font of text?
- font-style
- font-family
- text-decoration
- font-weight
Correct

Incorrect
Question 2 of 30

2. Question
How do you select an element with the class name `menu-item` in CSS?
- menu-item
- #menu-item
- *menu-item
- menu-item
Correct

Incorrect
Question 3 of 30

3. Question
How would you create a responsive layout using Flexbox, ensuring items wrap onto a new line when necessary?
- flex-wrap: nowrap;
- flex-wrap: wrap;
- flex-wrap: flex;
- flex-wrap: wrap-reverse;
Correct

Incorrect
Question 4 of 30

4. Question
Which of these is the default value of the position property?
- relative
- fixed
- absolute
- static
Correct

Incorrect
Question 5 of 30

5. Question
How do you set different background images for the same element depending on the screen size using CSS?
- Use @media queries with the background-image property
- Set multiple background-image values for different screen sizes
- Use background-image: url() in combination with @media queries
- Use background-size to define different images based on the viewport
Correct

Incorrect
Question 6 of 30

6. Question
The `z-index` property can be used to specify the layering order of which elements?
- All elements
- Only elements with `position: relative`
- Only elements with `position: absolute` or `fixed`
- Only `<div>` elements
Correct

Incorrect
Question 7 of 30

7. Question
Which CSS property is used to set the space between lines of text?
- spacing
- line-spacing
- line-height
- text-spacing
Correct

Incorrect
Question 8 of 30

8. Question
What will be the effect of the `display: inline-block;` property on an element?
- The element will be displayed as a block
- The element will be displayed as inline
- The element will behave like a block element, but sit inline
- The element will be invisible
Correct

Incorrect
Question 9 of 30

9. Question
Which CSS property makes an element’s text bold?
- font-style: bold
- font-weight: bold
- text-decoration: bold
- font-size: bold
Correct

Incorrect
Question 10 of 30

10. Question
What does the `:hover` pseudo-class do?
- It styles an element when it is clicked
- It styles an element when it is hovered over with a cursor
- It styles an element when it is double-clicked
- It styles an element when it is active
Correct

Incorrect
Question 11 of 30

11. Question
Which property is used to make text italic?
- font-weight
- text-style
- font-style
- font-variant
Correct

Incorrect
Question 12 of 30

12. Question
Which property is used to prevent Flex items from growing beyond their container’s available space?
- flex-grow
- flex-shrink
- flex-basis
- flex-wrap
Correct

Incorrect
Question 13 of 30

13. Question
Which is the only CSS property that defines the size of an element’s content area?
- padding
- margin
- width
- border
Correct

Incorrect
Question 14 of 30

14. Question
How do you change the list style of `<ul>` elements to circles?
- list-style-type: circle;
- list-type: circle;
- bullet-style: circle;
- list-circle: true;
Correct

Incorrect
Question 15 of 30

15. Question
What does the `@font-face` rule do?
- It imports a font from a file
- It imports fonts from Google
- It specifies a custom font to display text
- It changes the font of an element
Correct

Incorrect
Question 16 of 30

16. Question
Which value of the `overflow` property displays a scrollbar if content overflows?
- visible
- hidden
- scroll
- auto
Correct

Incorrect
Question 17 of 30

17. Question
How do you make Flex items stretch to fill the container along the main axis?
- justify-content: center;
- align-items: stretch;
- align-self: stretch;
- justify-content: space-between;
Correct

Incorrect
Question 18 of 30

18. Question
Which CSS function is used to apply a shadow to text?
- box-shadow
- shadow-text
- text-outline
- text-shadow
Correct

Incorrect
Question 19 of 30

19. Question
Which CSS property is used to create a transition effect when changing a property?
- animation
- transform
- transition
- transition-time
Correct

Incorrect
Question 20 of 30

20. Question
How do you select all `<p>` elements inside a `<div>` with the class ‘container’?
- p.container
- .container p
- div.container p
- #container p
Correct

Incorrect
Question 21 of 30

21. Question
Which Flexbox property allows you to align items along the cross axis (vertically by default)?
- align-items
- justify-items
- align-self
- justify-self
Correct

Incorrect
Question 22 of 30

22. Question
What does `box-sizing: border-box;` do?
- Includes only padding in width/height
- Includes only border in width/height
- Includes padding and border in width/height
- Excludes padding and border in width/height
Correct

Incorrect
Question 23 of 30

23. Question
What does `vw` represent in CSS units, and when is it applicable?
- Viewport width, used for responsive design to set widths relative to the viewport
- Viewport width is used to set font size dynamically based on screen size
- Vertical width is used to control layout direction
- Vertical width is used to control font scaling
Correct

Incorrect
Question 24 of 30

24. Question
Which CSS property adjusts the element opacity?
- transparency
- opacity
- visibility
- display
Correct

Incorrect
Question 25 of 30

25. Question
How do you center-align a block element?
- text-align: center
- display: center
- margin: auto
- padding: center
Correct

Incorrect
Question 26 of 30

26. Question
What does `flex-grow: 1;` do to a flex item?
- It grows the item based on the container size
- It keeps the item fixed
- It shrinks the item
- It removes the item from the container
Correct

Incorrect
Question 27 of 30

27. Question
Which of the following CSS functions is used to blend colors?
- mix-color
- color-blend
- blend-mode
- mix-blend-mode
Correct

Incorrect
Question 28 of 30

28. Question
How do you apply multiple background images in CSS?
- background-images: url1, url2;
- background: url1 url2;
- background: url1, url2;
- bg-image: url1, url2;
Correct

Incorrect
Question 29 of 30

29. Question
Which CSS property controls the stacking order of elements?
- stacking
- float
- z-index
- display
Correct

Incorrect
Question 30 of 30

30. Question
How can you make a list item marker appear inside the content box?
- list-style-position: inside;
- marker-position: inside;
- list-position: inside;
- marker-style: inside;
Correct

Incorrect

Cookie	Duration	Description
cookielawinfo-checkbox-analytics	11 months	This cookie is set by GDPR Cookie Consent plugin. The cookie is used to store the user consent for the cookies in the category "Analytics".
cookielawinfo-checkbox-functional	11 months	The cookie is set by GDPR cookie consent to record the user consent for the cookies in the category "Functional".
cookielawinfo-checkbox-necessary	11 months	This cookie is set by GDPR Cookie Consent plugin. The cookies is used to store the user consent for the cookies in the category "Necessary".
cookielawinfo-checkbox-others	11 months	This cookie is set by GDPR Cookie Consent plugin. The cookie is used to store the user consent for the cookies in the category "Other.
cookielawinfo-checkbox-performance	11 months	This cookie is set by GDPR Cookie Consent plugin. The cookie is used to store the user consent for the cookies in the category "Performance".
viewed_cookie_policy	11 months	The cookie is set by the GDPR Cookie Consent plugin and is used to store whether or not user has consented to the use of cookies. It does not store any personal data.