How to draw Half Circle using Div tag (HTML,CSS)

   

How to draw Half Circle using Div tag (HTML,CSS)

It is very easy to draw half circle using css and html. you just need to copy and past given code below and save you file as halfCircle.html and run this file in your browser :-


<html>
      <head>
            <title>
                  Half Circle CSS
            </title>
            <style>
                  .half-circle {
                        width: 200px;
                        height: 100px;
                        background-color: lightgreen;
                        border-top-left-radius: 110px;
                        border-top-right-radius: 110px;
                        border: 10px solid gray;
                        border-bottom: 0;
                        }
            </style>
      </head>
      <body>
            <div class="half-circle"></div>
      </body>
</html>

Just save your file with .html extension and run in any browser.

 

Output: 

 

How to draw Half Circle using Div tag (HTML,CSS)


 

Find More articles in Education Category. For more related post please follow us at CCTFPN’s official Page at Facebook


How to draw Half Circle using Div tag (HTML,CSS)

0 comments