1. What is the full form of CSS?
CSS stands for Cascading Style Sheets.
2. Why was CSS developed?
CSS was first developed in 1997 as a way for web developers to define the visual appearance of the web pages that they were creating.
3. What is CSS?
It is a popular styling language which is used with HTML to design websites.
4. What is the origin of CSS?
SGML (Standard Generalized Markup Language) is the origin of CSS. It is a language that defines markup languages.
5. How case-sensitive is CSS?
CSS is not case-sensitive, but the URLs of images and font families are case-sensitive.
6. What are the major versions of CSS?
CSS 1 CSS 2 CSS 2.1 CSS 3 CSS 4
7. What are CSS frameworks?
CSS frameworks are libraries that make web page styling easier.
8. Name some CSS frameworks.
Foundation, Bootstrap, Gumby, Ukit, and Semantic UI.
9. What is a CSS selector?
A CSS selector is the part of a CSS ruleset that actually selects the content you want to style.
10. What are the different types of Selectors in CSS?
Universal Selector, Element Type Selector, ID Selector, Class selector, Group selector, Attribute selector
11. What do you understand by the universal selector?
A universal selector matches the name of any element type instead of selecting elements of a particular type.
12. What is meant by RGB stream?
RGB represents colors in CSS. The three streams are namely Red, Green, and Blue.
13. Name some CSS style components.
Selector, Property, Value
14. What are the elements of the CSS Box Model?
The elements are content (like text and images, padding (the area around content), border (the area around padding), and margin (the area around the border).
15. What is the z-index in CSS?
The z-index helps specify the stack order of positioned elements that may overlap one another.
16. What are CSS Sprites?
CSS sprites combine multiple images into one single larger image.
17. How can you target h3 and h2 with the same styling?
Multiple elements can be targeted by separating with a comma: h2, h3 {color: red;}
18. Tell us about the property used for image scroll controlling.
The background-attachment property sets whether the background image is fixed or scrolls with the rest of the page.
19. Name some font-related CSS attributes.
The font-related attributes are Font- style, variant, weight, family, size, etc.
20. Define contextual selectors.
In CSS, contextual selectors allow developers to specify styles for different parts of the document.
21. What are the different types of Selectors in CSS?
Universal Selector, Element type Selector, ID selector, Class selector, Descendant combinatory, Child Combinator, General Sibling Combinator, Adjacent sibling combinator, and Attribute selector.
22. What is a CSS preprocessor?
CSS preprocessor is a tool that enhances basic functionality and allows us to use complex logical syntax, such as variables, functions, mixins, and code nesting, within vanilla CSS scripts.
23. Define CSS image scripts.
CSS image scripts are a group of images that are placed into one image.
24. What is CSS specificity?
CSS specificity is a score or rank that decides which style declaration has to be used for an element. (*) this universal selector has low specificity while ID selectors have high specificity.
25. How do we make a rounded corner by using CSS?
We can make a rounded corner by using the property “border-radius”.
26. What is VH/VW (viewport height/ viewport width) in CSS?
VH and VW are CSS units used to measure viewport height and width, respectively, in percentage form in responsive design techniques.
27. What are Pseudo classes?
Pseudo-classes are pseudo-elements that don’t exist in a normal document tree.
28. Does margin-top or margin-bottom have an effect on inline elements?
No, margin-top or margin-bottom does not affect the inline elements.
29. What property is used for changing the font face?
The font-family property is used to change the font face that is applied to the element in the DOM.
30. What is cascading in CSS?
Cascading is defined as the process of style declaration and its weight, which helps the browser select the styling rules with respect to time.
31. When does DOM reflow occur?
DOM reflow occurs when you insert, move, update, remove, and animate the elements in the DOM, as well as when you modify the page's content and style.
32. Different Box Sizing Property?
Content-box, Padding-box and Border-box
33. What is the grid system?
The CSS grid system is a powerful layout for 2-dimensional systems with respect to columns and rows.
34. What are the different ways to hide the element using CSS?
display: none, visibility: hidden, position: absolute
35. What is the meaning of the CSS selector?
The selector in CSS is used for the purpose of linking HTML and style sheet elements — just like string in HTML.
36. What does the: root pseudo-class refer to?
The: root selector pseudo-class refers to the CSS selector level 3. It helps to target the highest-level parent element present in the DOM.
37. How do I restore the default value of a property?
keyword “initial” is used to restore the default value of a property.
38. How does Calc work?
Calc can be used to specify the result of the mathematical operation of two or more elements.
39. What do CSS Custom properties variables mean?
CSS Custom properties variables are defined for CSS variables as well as cascading variables with specific values that can be reused.
40. How to determine if the browser supports a certain feature?
@support tag in the CSS is used to scan and determine whether the browser supports a certain feature or not.
41. Does style1.css have to be downloaded and parsed before style2.css can be fetched?
No. The CSS file will be downloaded via browser in order to appear on the HTML page.
42. How does absolute positioning work?
Absolute positioning is used to place the element which is then removed from the HTML document from the normal workflow without creating any space for the element in the HTML page layout.
43. What is the overflow property in CSS used for?
The overflow property specifies what should happen if content overflows an element’s box.
44. Does this property work overflow: hidden?
Overflow: The hidden property is used to specify the content’s clipping.
45. What are mixins?
A mixin is similar to a function block of code returning a single value—mixin output lines of Sass code that directly compiles into CSS styles.
46. What is the float property used for in CSS?
The float CSS property places an element on the left or right side of its container, allowing text and inline elements to wrap around it.
47. What are the different media types allowed by CSS?
all, print, speech, screen
48. How do you control image repetition using CSS?
You can use the background-repeat property to control image.
49. Name the property for controlling the image position in the background.
The background-position property is used to define the initial position of the background image.
50. Name the property for controlling the image scroll in the background.
The background-attachment property is used to specify if the background image is fixed or scroll with the rest of the page in the browser window.
51. Name the property used to specify the background color of an element.
The background-color property is used to specify the background color of the element.
52. What is the use of ruleset?
The ruleset is used to identify that selectors can be attached with other selectors.
53. What is the property that is used for controlling image-scroll?
The background-attachment property sets whether a background image scrolls with the rest of the page, or is fixed.
54. How to include CSS in the webpage?
External Style Sheet, Embed CSS with a style tag, Add inline styles to HTML elements, Import a stylesheet file.
55. What is the use of CSS Opacity?
The CSS opacity property is used to specify the transparency of an element.
56. Which command is used for the selection of all the elements of a paragraph?
The p[lang] command is used for selecting all the elements of a paragraph.
57. What is the use of % unit?
It is used for defining percentage values.
58. What is RWD?
RWD stands for Responsive Web Design.
59. What is tweening?
It is the process of generating intermediate frames between two images.
60. How do you center block elements using CSS1?
In order to center the block-level elements, we need to set the margin-right and margin-left properties to explicit values.
61. What are the external style sheets?
External style sheets are sheets used externally which can be linked to the HTML pages.
62. What are embedded style sheets?
These are the sheets where style sets for the entire HTML document are defined in a single place.
63. What is a declaration block?
The declaration block is a catalog of directions comprising the property, followed by a colon, and finally, the value enclosed within braces.
64. How does importing a file make it easy to insert?
Importing files helps integrate external sheets that can be inserted in multiple sheets.
65. What are pseudo-elements?
Pseudo-elements are used to provide special effects to certain selectors.
66. What are CSS counters?
Counters are variables that can be increased by using CSS that inspect and find the number of times of usage of variables.
67. How are percentage values decoded in CSS?
Percentage values are decoded in CSS using a percentage symbol.
68. What is RWD?
It is used to display the designed page suitably on any kind of screen size depending on the device under consideration.
69. What is the difference between the class selector and ID selector?
A class selector takes an overall block while an ID selector takes a single element that differs from others.
70. How do you center block elements using CSS1?
71. What are the ways to integrate CSS as a web page?
Embedded, Inline, Imported or Linked
72. Is it possible to make a class selector for a particular elements? If so how?
Yes, it is possible to make a class selector for a particular element- write a period (.) character, followed by the name of the class.
73. How to use grouping in CSS?
Grouping is used for applying CSS styles for more than one HTML element, and this can be done with a single declaration.
74. Define gradients in CSS.
The gradient is a property of CSS that allows displaying smooth transformation between more than one specified color.
75. What are the types of gradients in CSS?
Linear, Radial, Conic
76. What do CSS Custom properties variables mean?
Custom properties are also called CSS variables or cascading variables, and they are defined by users that contain some specific values to be reused throughout a document.
77. What is Flexbox in CSS?
Flexbox (Flexible Box Layout) is a layout model in CSS that allows for the creation of responsive and flexible layouts.
78. What are CSS Grid?
CSS Grid is a two-dimensional layout system that allows for the creation of complex web layouts using rows and columns.
79. What is a CSS reset?
A CSS reset is a set of CSS rules used to remove browser-specific styling and create a consistent starting point for your CSS.
80. What is the box-sizing property used for?
The box-sizing property is used to alter the default CSS box model.
81. How does !important work in CSS?
!important gives the highest priority to the style rule and overrides the cascaded property.
82. Describe the 'stacking context' in CSS.
A stacking context is a three-dimensional conceptualization of HTML elements along an imaginary z-axis relative to the user.
83. What are CSS Custom Properties (CSS Variables)?
CSS Custom Properties, also known as CSS Variables, are entities defined by developers that contain specific values to be reused throughout a document.
84. What are CSS Containment?
CSS Containment is a performance optimization technique that isolates a subtree of the document from the rest of the page.
85. What are CSS Logical Properties?
CSS Logical Properties are writing-mode-relative alternatives to physical properties like left, right, top, and bottom.
86. What is BEM in CSS?
BEM (Block, Element, Modifier) is a CSS naming convention that provides a structured approach to naming classes.
87. Describe the CSS Box Alignment properties?
CSS Box Alignment properties control alignment and distribution of space between and around content items within a flex or grid container.
88. What are CSS Shapes?
CSS Shapes allow you to wrap content around custom shapes or images, rather than just rectangular boxes.
89. What is clip-path in CSS?
The clip-path property is used to define a visible region of an element, clipping away the rest.
90. What is object-fit?
The object-fit property controls how content (like images or videos) fits within a container, especially when the container’s aspect ratio differs from the content's aspect ratio.
91. What are keyframes?
@keyframes define the sequence of styles or animations that an element should go through at specific points.
92. What does the box-shadow property do in CSS?
It adds a shadow effect around an element's frame.
93. Do margin-top and margin-bottom affect inline elements?
No, it does not affect the inline parts. Inline items flow with the page’s content.
94. How will you add border images to an HTML element?
We can set the image to be used as the border image alongside an element by using the property of CSS “border-image”.
Share this protal to share friends and complete unlimited tests here. You can also make friends on our protal also start mutual competition tests with your firends easily.