The HTML/CSS and Vue.js online test assesses candidates' knowledge of HTML, CSS, and Vue as well as their ability to leverage commonly used programming patterns.

It's an ideal test for pre-employment screening. A good front-end developer should be able to utilize all these technologies to create a modern, dynamic, and interactive user interface.

This online test requires candidates to solve common HTML/CSS challenges as well as Vue coding problems.

Recommended Job Roles
JavaScript Developer
UI/UX Developer
Vue.js Developer
Web Front-End Developer
Sample Candidate Report

Sample Free Questions

Avatar

7min
  -  
Easy  
  -  
CODE

HTML/CSS CSS selectors Styling Public

Every user on your website has an image avatar that is displayed when they post a comment. You want to style these images differently from other images on your site. Add a CSS class named avatar that fulfils the following requirements:

  1. The avatar's border is rounded, so that it appears as a circle.
  2. The avatar's width and height are both 150px.
  3. The avatar has a solid border, has a width of 2px, and be colored gray.

For example, the avatar in the template should look like:

Cat avatar

Semantics

7min
  -  
Easy  
  -  
CODE

HTML/CSS HTML5 Public

Update the website's HTML, without using JavaScript or CSS, to make use of semantic elements so that:

  • The classless outer div element is replaced with a more appropriate element.
  • The divs with the image and caption classes are replaced with self-contained content elements.
  • The divs with the lorem-ipsum and description classes are replaced with elements, so that by default only the contents of the description element are shown. When the contents of the description element are clicked, the visibility of the rest of the lorem-ipsum element is toggled.

Toggle Message

7min
  -  
Easy 
  -  
CODE

Vue.js Directives Event handling Public New

Page contains an anchor element and a paragraph below it. The paragraph's visibility should be toggled by clicking on an anchor element with the following logic:

  • At start, paragraph should not be visible
  • After a click, paragraph should be visible
  • After another click, paragraph should not be visible again

Implement the following logic by adding missing attributes to anchor and paragraph elements.

Use Free Questions On a Trial Plan

Premium Questions

The premium question library contains our unique, hand-crafted questions. We offer a refund if you find any of them answered online.

Questions
Link, Editor, Blog, Label Color, Logo, Article Style, Share Button, Ad, Keywords, Links, Bookmark, Christmas Tree, iframe, Shirts, Warehouse, Baby Names, Loading, Format Table, Breakfast Menu, Cities, Screen Reader, Timesheet, Data Entry, Email Tables, Division, Custom Link, TestDome Logo, Ice Cream Flavors, Widgets, Upload, Addition, Cards Widget, Calculator, Countdown
Skills
HTML/CSS HTML attributes HTML5 Semantic tags CSS selectors Positioning Styling Language Animation Selectors Accessibility Tables CSS layout Forms CSS basics Vue.js Computed properties Directives HTML CSS advanced Components Event handling Binding
Score Distribution
Loading...
Pricing For Premium Questions