I want to write ap graphics inside a circle. The circle is not full but like 30 %. I have wrote AP graphics inside a responsive quarter circle. The code I wrote is.
<html>
<head>
<title>
AP Graphis
</title>
<style>
.quarter{
position: relative;
width: 20vw;
height: 20vw;
border-top-right-radius:0;
border-top-left-radius:0;
border-bottom-right-radius:100%;
border-bottom-left-radius:0;
background: orange;
}
</style>
</head>
<body>
<h1 class="quarter" style="color: white;"><br> <u>AP GRAPHICS</u></h1>
</body>
</html>But I could not make it like the image below. Also I dont know how to mix the a and p from AP. I also dont know the font of text. I am new to css and dont know a stuff about it.
