11. Underline a heading using text decoration.

Required Input:

A webpage with a <h1> tag.

Expected Output:

The heading text appears underlined.

Code In Css

<!DOCTYPE html> <html> <head> <style> /* Add CSS here to style the heading */ </style> </head> <body> <h1>Your Heading</h1> </body> </html>

Document

To view the HTML changes, please type the code within the editor

Need help ?

Click on Hint to solve the question.

12. Create a gradient background with two colors of your choice.

Required Input:

A webpage with a body element.

Expected Output:

The webpage has a gradient background blending two colors.

Code In Css

<!DOCTYPE html> <html> <head> <style> /* Add CSS here to create the gradient background */ </style> </head> <body> </body> </html>

Document

To view the HTML changes, please type the code within the editor

Need help ?

Click on Hint to solve the question.

13. Make an image rounded by setting a border-radius of 50%.

Required Input:

A webpage with an <img> tag.

Expected Output:

The image appears in a circular shape.

Code In Css

<!DOCTYPE html> <html> <head> <style> /* Add CSS here to make the image rounded */ </style> </head> <body> <img src="example.jpg" alt="Example Image"> </body> </html>

Document

To view the HTML changes, please type the code within the editor

Need help ?

Click on Hint to solve the question.

14. Add a shadow to a box with 5px offset in all directions.

Required Input:

A webpage with a <div> tag.

Expected Output:

The div has a shadow with a 5px offset.

Code In Css

<!DOCTYPE html> <html> <head> <style> /* Add CSS here to style the div */ </style> </head> <body> <div>Content inside the div</div> </body> </html>

Document

To view the HTML changes, please type the code within the editor

Need help ?

Click on Hint to solve the question.

15. Style a link with hover effect to change its color to red.

Required Input:

A webpage with an <a> tag.

Expected Output:

When the link is hovered, it changes its color to red.

Code In Css

<!DOCTYPE html> <html> <head> <style> /* Add CSS here to style the link */ </style> </head> <body> <a href="#">Hover over me</a> </body> </html>

Document

To view the HTML changes, please type the code within the editor

Need help ?

Click on Hint to solve the question.

16. Set a specific font family (like Arial or Times New Roman) for the body.

Required Input:

A webpage with some text content inside the <body>.

Expected Output:

All text on the page is displayed in the specified font family.

Code In Css

<!DOCTYPE html> <html> <head> <style> /* Add CSS here to set the font family */ </style> </head> <body> <p>Your content here</p> </body> </html>

Document

To view the HTML changes, please type the code within the editor

Need help ?

Click on Hint to solve the question.

17. Align an image to the right side of a div.

Required Input:

A webpage with a <div> containing an <img>.

Expected Output:

The image is aligned to the right within the div.

Code In Css

<!DOCTYPE html> <html> <head> <style> /* Add CSS here to align the image */ </style> </head> <body> <div> <img src="example.jpg" alt="Example Image"> </div> </body> </html>

Document

To view the HTML changes, please type the code within the editor

Need help ?

Click on Hint to solve the question.

18. Create a navigation bar with horizontal links styled using CSS.

Required Input:

A webpage with a list of links inside a <nav>.

Expected Output:

The links are displayed horizontally and styled.

Code In Css

<!DOCTYPE html> <html> <head> <style> /* Add CSS here to style the navigation bar */ </style> </head> <body> <nav> <a href="#">Home</a> <a href="#">About</a> <a href="#">Contact</a> </nav> </body> </html>

Document

To view the HTML changes, please type the code within the editor

Need help ?

Click on Hint to solve the question.

19. Set the opacity of a div to 50%.

Required Input:

A webpage with a <div> tag.

Expected Output:

The div appears semi-transparent.

Code In Css

<!DOCTYPE html> <html> <head> <style> /* Add CSS here to set opacity */ </style> </head> <body> <div>Content inside the div</div> </body> </html>

Document

To view the HTML changes, please type the code within the editor

Need help ?

Click on Hint to solve the question.

20. Style a block of text with a line height of 1.5.

Required Input:

A webpage with a paragraph of text.

Expected Output:

The text is spaced out with a line height of 1.5.

Code In Css

<!DOCTYPE html> <html> <head> <style> /* Add CSS here to style the line height */ </style> </head> <body> <p>Your block of text goes here.</p> </body> </html>

Document

To view the HTML changes, please type the code within the editor

Need help ?

Click on Hint to solve the question.

ad vertical

2 of 3