WebSoftPrograms: Pure Css3 Shapes - Shape # 1

Hello! From today I am starting to make different kinds of pure css3 shapes and share with you.You can also download from the given link below.

Preview Image

Directions :

Step 1: Add the following code to the <body> section of your Html page :

<div class="egg"></div>

Step 2: Add the following code to the <style> section of your Html page or Css :

.egg{
float: left;
margin: 10px;
display: block;
width: 252px;
height: 360px;
background-color: #fff;
box-shadow: 0 8px 24px 3px #999;
-webkit-box-shadow: 0 8px 24px 3px #999;
-moz-box-shadow: 0 8px 24px 3px #999;
-o-box-shadow: 0 8px 24px 3px #999;
-ms-box-shadow: 0 8px 24px 3px #999;
border:4px solid #000;
border-radius: 50% / 60% 60% 40% 40%;
-webkit-border-radius: 50% / 60% 60% 40% 40%;
-moz-border-radius: 50% / 60% 60% 40% 40%;
-o-border-radius: 50% / 60% 60% 40% 40%;
-ms-border-radius: 50% / 60% 60% 40% 40%;
 cursor: pointer;
}

DOWNLOAD PROJECT SOURCE

Pure Css3 Shapes - Shape # 1 - EGG

No comments:

Post a Comment