Make balloon picture style with CSS3

This time to everyone with CSS3 to make balloon picture style, with CSS3 to make balloon picture style notice what, the following is the actual case, together to see.

Balloon:

Html:

<p class= "Ballon" ></p>

Css:

. balloon{         width:160px;         height:160px;         Background: #faf9f9;          /*CSS3 Fillet Properties */          border-radius:50% 50% 25% 50%;           /* Rotate clockwise 45 degrees *           /Transform:rotate (45deg);           /* box shadow x offset y offset feather radius color *           /Box-shadow: -8px-8px 80px-8px #873940 inset;} /*after  before pseudo-element */.balloon::after{           Position:absolute;            bottom:5px;            right:5px;            Content: "";             Display:block;             /*width:18px;             height:18px;*/             /*background: #873940; *            //*transform:rotate (45DEG); * *             border:8px solid transparent;             border-right-color: #873940;             Transform:rotate (45deg);             border-radius:50%;}

Believe that you have read the case of this article you have mastered the method, more exciting please pay attention to the PHP Chinese network other related articles!

Recommended reading:

Pseudo elements:: Before with:: After use

CSS3 pointer-events use of the detailed