Single Choice Question

  1. The CSS style to change the cursor to a hand pointer is?
    1. cursor: hand;
    2. cursor: pointer;
    3. cursor: hand-pointer;
    4. cursor: default;
  2. The CSS selector defining styles for a link when the user place the mouse pointer over it is
    1. a:hover
    2. a:active
    3. a:focus
    4. a:visited
  3. To remove the space between two grid in a table, we need use
    1. grid-gap
    2. border-space
    3. grid-spacing
    4. border-collapse
  4. The CSS selector to select the odd line of a table is
    1. tbody tr:nth-child(odd)
    2. tbody tr:nth-child(even)
    3. tbody tr:nth-child(odd-row)
    4. tbody tr:nth-child(even-row)
  5. To manipulate the coordinate system used by an element in order, we use
    1. transform
    2. translate
    3. animation
    4. float
  6. To increases the size of the element by 2 times, we use
    1. transform: scale(2)
    2. transform: skew(2)
    3. transform: translate(2)
    4. transform: rotate(2)
  7. Property specifying the number of seconds or milliseconds a transition animation should take to complete is
    1. transition-duration
    2. transition-time
    3. transition-delay
    4. transition-timing-function
  8. Property specifying when the animation will start is
    1. animation-delay
    2. animation-time
    3. animation-duration
    4. animation-timing-function
  9. To change the type style of a list, we use
    1. list-style-type
    2. list-style-image
    3. list-image-style
    4. list-type-style

True or False Question

  1. Each block level element starts on a new line, and subsequent elements start on another line. True
  2. Using absolute position is a good way to display the element on the page. False
  3. Static positioned element is fixed with respect to the browser's viewport and does not move when scrolled. False

Definition of Term

  1. Animation
  2. Transition
  3. Transform

Short Answer

  1. What are the states of a link?
  2. What are the difference between transform and transition?

Programming

  1. The following image is a part of a web page. Try to use HTML and CSS to make the image looks like the following image.
  2. The following image is a part of a web page. Try to use HTML and CSS to make the image looks like the following image.
  3. The following image is a part of a web page. Try to use HTML and CSS to make the image looks like the following image.
  4. The following image is a part of a web page. Try to use HTML and CSS to make the image looks like the following image.
  5. The following image is a part of a web page. Try to use HTML and CSS to make the image looks like the following image.
  6. The following image is a part of a web page. Try to use HTML and CSS to make the image looks like the following image.
  7. Try to use HTML and CSS to make the image looks like the following image, which shows a login form.
  8. The following image is a part of a web page. Try to use HTML and CSS to make the image looks like the following image.
  9. You need to create a personal profile page that showcases your basic information, interests, and contact details. Try to use HTML and CSS to make the image looks like the following image.
  10. You need to create a simple online store product list page that displays a list of products with their images, names, prices, and descriptions. Try to use HTML and CSS to make the image looks like the following image.
  11. You need to create a simple blog post page that displays a single blog article with its title, author, date, content, and comments section. Try to use HTML and CSS to make the image looks like the following image.
  12. You need to create a simple weather forecast page that displays the current weather conditions for a specific city, including the temperature, weather icon, and a brief description. Try to use HTML and CSS to make the image looks like the following image.
  13. You need to create a simple personal portfolio page that showcases your work, skills, and contact information. Try to use HTML and CSS to make the image looks like the following image.
  14. You need to create a simple online course details page that includes a header, a course overview, a list of modules, instructor information, and a footer. Try to use HTML and CSS to make the image looks like the following image.
  15. You need to create a simple company home page that includes a header, a hero section, a features section, a testimonials section, and a footer. Try to use HTML and CSS to make the image looks like the following image.
  16. You need to create a simple news website that displays a list of news articles with their titles, authors, dates, and brief descriptions. Try to use HTML and CSS to make the image looks like the following image.