获得完整访问权限
新与我们合作推广 ->
获得完整访问权限
JavaScriptReactAngularVueSvelteCSSHTMLTypeScript

CSS 面试问题

70+ 个涵盖布局、动画、响应式设计、选择器优先级以及创建引人入胜界面的重要 CSS 面试问题。
由前面试官解答
测试用例
在浏览器中编码

题目列表

CSS 面试指南探索我们的入门指南，在开始练习之前先全面了解 CSS 面试准备。
0/3 指南
指南
  • AccordionBuild an accordion component that a displays a list of vertically stacked sections with each containing a title and content snippet
    可用的框架
  • Holy GrailBuild the famous holy grail layout consisting of a header, 3 columns, and a footer
    可用的框架
  • Progress BarsBuild a list of progress bars that fill up gradually when they are added to the page
    可用的框架
  • TabsBuild a tabs component that displays a list of tab elements and one associated panel of content at a time
    可用的框架
  • ClassnamesImplement a function that conditionally joins CSS class names together
    语言
  • Dice RollerBuild a dice roller app that simulates the results of rolling 6-sided dice
    可用的框架
  • getElementsByStyleImplement a function to get all DOM elements that are rendered using the specified style
    语言
  • Like ButtonBuild a Like button that changes appearance based on the states
    可用的框架
  • Modal DialogBuild a reusable modal dialog component that can be opened and closed
    可用的框架
  • Star RatingBuild a star rating component that shows a row of star icons for users to select the number of filled stars corresponding to the rating
    可用的框架
  • Traffic LightBuild a traffic light where the lights switch from green to yellow to red after predetermined intervals and loop indefinitely
    可用的框架
  • Digital ClockBuild a 7-segment digital clock that shows the current time
    可用的框架
  • getElementsByClassNameImplement a function to get all DOM elements that contain the specified classes
    语言
  • Tic-tac-toeBuild a tic-tac-toe game that is playable by two players
    可用的框架
  • Image CarouselBuild an image carousel that displays a sequence of images
    可用的框架
  • Job BoardBuild a job board that displays the latest job postings from Hacker News
    可用的框架
  • StopwatchBuild a stopwatch widget that can measure how much time has passed
    可用的框架
  • Transfer ListBuild a component that allows transferring of items between two lists
    可用的框架
  • jQuery.css高级Implement a jQuery-like function that sets the style of a DOM element
    语言
  • Progress Bar高级Build a progress bar component that shows the percentage completion of an operation
    可用的框架
  • Tweet高级Build a component that resembles a Tweet from Twitter
    可用的框架
  • Analog Clock高级Build an analog clock where the hands update and move like a real clock
    可用的框架
  • Grid Lights高级Build a grid of lights where the lights deactivate in the reverse order they were activated
    可用的框架
  • jQuery Class Manipulation高级Implement a set of jQuery-like functions that manipulates classes on a DOM element
    语言
  • Modal Dialog II高级Build a semi-accessible modal dialog component that has the right ARIA roles, states, and properties
    可用的框架
  • Progress Bars II高级Build a list of progress bars that fill up gradually in sequence, one at a time
    可用的框架
  • Tabs II高级Build a semi-accessible tabs component that has the right ARIA roles, states, and properties
    可用的框架
  • Progress Bars III高级Build a list of progress bars that fill up gradually concurrently, up to a limit of 3
    可用的框架
  • Birth Year Histogram高级Build a widget that fetches birth year data from an API and plot it on a histogram
    可用的框架
  • Connect Four高级Build a game for two players who take turns to drop colored discs from the top into a vertically suspended board/grid
    可用的框架
  • Image Carousel II高级Build an image carousel that smoothly transitions between images
    可用的框架
  • Pixel Art高级Build a pixel art drawing tool where users can paint pixels with selected colors
    可用的框架
  • Users Database高级Build a UI to filter, create, update, and delete users
    可用的框架
  • Whack-A-Mole高级Build a popular arcade game where players attempt to hit moles as they pop up from holes in a board
    可用的框架
  • Memory Game高级Build a memory game where the player needs to match pairs of cards
    可用的框架
  • Auth Code Input高级Build an auth code input component that allows users to enter a 6-digit authorization code
    可用的框架
  • Classnames II高级Implement a function that conditionally joins CSS class names together and also handles de-duplication and function values
    语言
  • Progress Bars IV高级Build a list of progress bars that fill up gradually concurrently, up to a limit of 3 and allows for pausing and resuming
    可用的框架
  • Image Carousel III高级Build an image carousel that smoothly transitions between images that has a minimal DOM footprint
    可用的框架
  • Selectable Cells高级Build an interface where users can drag to select multiple cells within a grid
    可用的框架
  • Tic-tac-toe II高级Build an N x N tic-tac-toe game that requires M consecutive marks to win
    可用的框架
  • Transfer List II高级Build a component that allows transferring of items between two lists, bulk selection/unselection of items, and adding of new items
    可用的框架
  • Wordle高级Build Wordle, the word-guessing game that took the world by storm
    可用的框架

CSS Interview Questions and Answers

Are you tired of poor-quality CSS interview question lists that offer nothing but vague questions and answers? Discover the ultimate resource for CSS interview preparation with our high-quality list of over 74 CSS interview questions and answers.

Curated and answered by ex-FAANG interviewers, our collection of must-know CSS interview questions ensures you're prepared for any kind of interview you may face. Each question also comes with example solutions and comprehensive, automated test cases so that you always know how to improve within seconds.

Our list contains two large categories of questions - the CSS coding interview questions and CSS quiz interview questions.

CSS Coding Interview Questions

Master essential CSS techniques and interview patterns by practicing with our list of well-curated CSS coding interview questions. From implementing responsive layouts, creating animations, and handling cross-browser compatibility, to writing maintainable and scalable CSS, we offer numerous practice questions with example answers (solved with code).

Additionally, we provide an in-browser coding workspace, allowing you to style directly in the browser with no setup required. Run your styles against our automated test cases and know if they're accurate within seconds. Moreover, you can further improve your styles and adapt best practices from the well-explained solutions we provide, written by credible and revered former big tech senior/staff engineers.

CSS Quiz Interview Questions

CSS interview trivia questions generally test your CSS know-how and fundamentals. We have the top CSS quiz questions that are commonly asked in such interviews, including important topics like specificity, the box model, flex box, grid, and responsive design. Again, we provide good answers to these questions written by ex-interviewers.