Programming Examples

Css code to design a circle using div with following specifications


create a circle using CSS

Write a HTML and CSS Code to Design a Circle with Following Specifications:

Width - 200px Height - 200px Background - Red Border - 2px Double Line and Black Color Change the background color as Yellow when mouse is move over to the Circle.

Solution

<!DOCTYPE HTML>
<html>
	<head>
		<style type="text/css">
			.circle{
				width:200px;
				height:200px;
				border-radius:50%;
				background:red;
				border:2px double black;				
			}
			.circle:hover{
				background:yellow;
			}
		</style>
	</head>
	<body>
		<div class="circle"></div>
	</body>
</html>
Output


CCC Online Test 2021 CCC Practice Test Hindi Python Programming Tutorials Best Computer Training Institute in Prayagraj (Allahabad) Best Java Training Institute in Prayagraj (Allahabad) Best Python Training Institute in Prayagraj (Allahabad) O Level Online Test in Hindi Bank SSC Railway TET UPTET Question Bank career counselling in allahabad Sarkari Naukari Notification Best Website and Software Company in Allahabad Sarkari Exam Quiz