CSS

Here is the List of Top 54 CSS (Cascading Style Sheet) Interview Questions and Answers to reveals the concept of CSS(Cascading Style Sheet) and CSS 3. 

 

1.What is meant by CSS ?

 

     CSS is the full form of Cascading Style Sheets and it gives the styles to web pages based on the user requirements.

 

2. What are the versions of CSS available?

 

  1. CSS 1
  2. CSS 2
  3. CSS 3

 

3. What are the features of the CSS ?

 

It is simple language used to change appearance your webpages.

It makes your webpage more presentable

It is client side scripting language

We can able to embed CSS into HTML

It is a case sensitive

Code reusability

It is a global web standards

 

4. What is syntax of the CSS?

 

Selector
{
Property:value;
}

In this selector is used to select which type of html tag.

5. What are the types of CSS?

 

Inline CSS

Internal CSS

External CSS

 

6. What is meant by Inline CSS ?

 

We can able to apply style sheet within the html tag using style attribute.

 

<tagname style=”property:value”>….</tagname>

 

7. What is meant by Internal CSS?

 

We can apply stylesheet within the html document using <style> </style>

 

8. Mention How to use the External CSS?

 

We create a seperate file and style sheet then save the filename.css.After that embedded the CSS file into HTML using

 

<link rel=”stylesheet” href=”filename.css</link>

 

9. What is the main advantages of the External CSS?

 

The main advantages of the External CSS is to apply external CSS to multiple web pages.

 

10. What are the properties are used in the CSS ?

 

Background

Font

Text

Border

 

11. Mention the whole properties used in the CSS?

 

Box model

 

Display

 

Position

 

Float

 

List

 

Z-index

 

Opacity

 

Overflow

 

Wrap

 

 

12. What are the features used in the CSS Background?

 

Background-color

 

Background-image

 

Background-size

 

Background-repeat

 

Background-position

 

Background-attachment

 

13. Is it possible to set the background size in CSS?

 

Yes, It is possible to set the background size in CSS by using Height and weight.

 

14. What are the types of options in CSS for Background repeat?

 

Repeat

No Repeat

Repeat – X

Repeat – Y

 

15. What are the four types to set the background position?

 

Left

Right

Top

Bottom

 

16. What are the way to set the background attachment?

 

Fixed (Background-attachment:fixed)

 

Scroll (Background-attachment:scroll)

 

17. What are the properties of font in CSS?

 

Font-size

Font-weight

Font-family

Font-variant

Font-color

 

18. What is meant by font weight in CSS?

 

Font weight is used to give the weight to fonts which mean texts.

 

19. What is meant by font-family in CSS?

 

Not only in CSS in designing world we are using the font to the text to appear in different styles.

Example:

Arial, san-serif, Helvetica

 

 

20. What are the features of TEXT properties in CSS?

 

Text-align

 

Text-indent

 

Text-transform

 

Text-decoration

 

Text-shadow

 

Letter-spacing

 

Word-spacing

 

Line-height

 

21. What are the options available in Text-transform ?

 

Uppercase

 

Lowercase

 

Capitalize

 

22. What are the options are available in Text-Decoration?

 

None

 

Underline

 

Overline-through

 

23. What are the features available in the Border properties?

 

Border-width

 

Border-style

 

Border-color

 

Border-left

 

Border-right

 

Border-top

 

Border-bottom

 

24. What is meant by Z-index?

 

Z-index used to display overlapped content from forward to backward or backward to forward.

 

Z-index : -1; (backward)

 

Z-index : 1 (forward)

 

25. What is the use of Opacity in CSS?

 

Opacity is used to reduce the brightness of the object. It values are 0.1 to 1.

 

26. What is the use of the Float in CSS?

 

It is used to display the content in horizontal way for different tag format.

 

float:left(it is used for left side arrangement)

 

float:right(it is used for right side arrangement)

 

27. What is the use of the Clear property in CSS?

 

Clear is used to clear the float property.The syntax of the clear property is

 

Clear: left|right|both

 

28. What is the use of the overflow in CSS?

 

Overflow is used to place the content with the specified width and height which is also create a scrollbar.

 

29. What is the use of the word-wrap in CSS?

 

It is used to breaks the content when specified width is reached.

 

Syntax:

 

Word-wrap: break-word;

 

30. What are the features are involved in the display properties?

 

Display : inline

Display : block

Display :inline-block

Display : list-item

Display :table

Display : table-row

Display : table-cell

Display :table-row

Display : none

Visibility : hidden

 

It is used to removes the content but space will be there in the webpage.so this is the use of the visibility:hidden in css.

 

32. What is the difference between display:inline and display:block?

 

Display:inline :

 

It is used to arrange the content in the horizontal way with space.

 

Display:block :

 

It is used to arrange the content in the vertical way.

 

33. What is the speciality of the none option in Display properties?

 

None is used to remove the content with space.

 

34. Is it padding and margin will accept the negative value?

 

Yes, Both the padding and margin will accept the negative value in the CSS.

 

35. What is meant by Padding in CSS?

 

Padding is the process of creating the space between the element and also space between the content and border.

 

36. What is meant by Box Model?

 

In HTML and CSS each and every element is associated with the Box Model. It is the relationship between outline,margin,padding.

37.

It is used to remove the content but space will be there.

 

38. What are the types of selectors in CSS?

 

Universal selector

Tag selector

Id selector

Class selector

Descendent selector

Child selector

Grouping selector

Attribute selector

Pseudo selector

 

39. What is meant by Universal selector in CSS?

 

It apply styles to all HTML tags in your document.The syntax of universal selector is

*
{
Property:value;

}

 

40. Mention the Tag selector syntax in CSS?

 

Tagname

{
Property:value;

}

 

41. What is meant by ID selector in CSS?

 

Id means identification. It should be unique and we can’t able to reuse the id name while using in the coding.

 

42. What is meant by class selector?

It is same as id selector.But we can reuse the class name for grouping purpose.

 

Classname

{

Property:value;

}

 

43. What is meant by descendent selector in CSS?

 

Descendant means descending. Style will apply to direct or indirect parent child relationship.

 

Parent-tag: child-tag

{

Property:value;

}

 

44. What is meant by pseudo selector in CSS?

 

It is used to gives the special features to element in the coding world.

 

45. What is meant by child selector in CSS?

 

It is same as descendant selector. But style will apply to direct parent child relationship.

 

Syntax :

 

Parent-tag > child tag

{

Property:value;

}

46. What is meant by grouping selector in CSS?

 

We can group multiple tags,class name, id etc…. And it is seperated by comma.

 

Tag1,tag2…

{

Property:value;

}

47. What is meant by Attribute selector in CSS?

 

Style will be apply based on tagname, attributes and value.

 

Syntax :

 

Tagname[attribute]

{

Property:value;

}

 

48. What is meant by CSS 3?

 

It is the latest and updated versions of CSS. It is mainly used for animation and responsive web page using media queries.

 

49. What is the disadvantages of CSS 3?

 

It runs only in updated browsers

We want to add keywords in prefix of your CSS property based on browsers

 

50. What are the properties of CSS 3?

 

Text

Animation

Column

Gradient

Transition

Transform

 

51. In CSS 3 text how many types are involved?

 

Stroke (It is border on the text)

Clip (It is the image on the text)

 

52. What is the use of the animation in CSS 3?

 

It is change the color,image, and css property value alternatively.Animation properties are mentioned here for your reference

 

Animation-name:

 

Animation-duration:

 

Animation-iteration-count:

 

53. What is the use of the column in CSS and mention it’s properties?

 

It is used to split content in multiple columns.

 

Column-count:

Column-gap

Column-rule

54. What are the types of gradient in CSS?

 

There are types of gradient in css.

Linear gradient

Radial gradient

 

55. What is the use of the transition in CSS?

 

It is used to control the speed of the content for which you want control while you are creating the web pages.

 

56. What is the use of transform in CSS?

 

Transform is used to move object from one location to another locations.

 

57. What is meant by media queries in CSS?

 

It is used to create a responsive web design (RWD). While users using the mobile to visit the website this property mostly used.

 

58. What are the methods are involved in transform?

 

Translate

Rotate

Scale

Skew