how to create Elliptical Shapes in html
<!DOCTYPE html><html>
<head>
<title>Elliptical Shapes</title>
<style type="text/css">
p {
border: 5px solid #ee3e80;
padding: 10px;
width: 100px;
height: 100px;
display: inline-block;
margin: 20px;}
p.one {
border-top-left-radius: 80px 50px;
-moz-border-radius-top-left: 80px 50px;
-webkit-border-radius-top-left: 80px 50px;}
p.two {
border-radius: 1em 4em 1em 4em / 2em 1em 2em 1em;
-moz-border-radius: 1em 4em 1em 4em / 2em 1em 2em 1em;
-webkit-border-radius: 1em 4em 1em 4em / 2em 1em 2em 1em;}
p.three {
padding: 0px;
border-radius: 100px;
-moz-border-radius: 100px;
-webkit-border-radius: 100px;}
</style>
</head>
<body>
<p class="one"></p>
<p class="two"></p>
<p class="three"></p>
</body>
</html>
output:
1 comments:
Image Map Shape Rect Circle Poly
html image examples
Post a Comment