CSS3圆形
＃css3-circle {
宽度：150px;
身高：150px;
边界拉迪乌斯：50％；
背景色：＃232323;}
CSS3椭圆形
＃css3- elipse {
宽度：200px;
身高：100px;
边界拉迪乌斯：50％；
背景色：＃232323;}
CSS3三角形
＃css3-triangle {
宽度：0;
身高：0;
边界左：100px实心透明；
边界权利：100px实心透明；
边界底：150px实心＃232323;}
CSS3平行四边形
＃css3-并行图{
宽度：200px;
身高：100px;
背景：＃232323;
-webkit-transform：Skew（-45deg）; - Moz-Transform：Skew（-45deg）; - O-Transform：Skew（-45deg）;
变换：偏斜（-45DEG）;
}
CSS3梯形
＃css3-trapezoid {
宽度：100px;
身高：0;
边界底：100px实心＃232323;
边界左：50px实心透明；
边界权利：50px实心透明；
}
CSS3六角星
＃CSS3-SIX-Star {
宽度：0;
身高：0;
位置：相对；
边界底：100px实心＃232323;
边界左：50px实心透明；
边界权利：50px实心透明；
}＃css3-six-star：之后{
内容： ;
宽度：0;
身高：0;
位置：绝对；
左：-50px;
顶部：35px;
边界顶：100px实心＃232323;
边界左：50px实心透明；
边界权利：50px实心透明；
}
CSS3五角星
＃css3-five-star {
宽度：0px;
身高：0px;
保证金：50px 0;
位置：相对；
显示：块;
颜色：＃232323;
边界权利：100px实心透明；
边界底：70px实心＃232323;
边界左：100px实心透明; -moz-Transform：旋转（35DEG）; - WebKit-Transform：旋转（35DEG）; - MS-TRANSFORM：旋转：旋转（35DEG）; - O-Transform：o-Transform：rotate（35维（35维）;
}＃css3-five-star：{
边界底：80px实心＃232323 ;;
边界左：30px实心透明；
边界权利：30px实心透明；
位置：绝对；
身高：0;
宽度：0;
顶部：-45px;
左：-63px;
显示：块;
内容：''; -webkit-transform：旋转（-35deg）; - moz-transform：旋转（-35deg）; - ms-transform：rotate：rotate（-35deg）; - o-transform：rotate：rotate（-35deg）;
}＃css3-five-star：之后{
位置：绝对；
显示：块;
颜色：＃232323;
顶部：3px;
左：-105px;
宽度：0px;
身高：0px;
边界权利：100px实心透明；
边界底：70px实心＃232323;
边界左：100px实心透明; -webkit-transform：旋转（-70deg）; - moz-transform：旋转（-70deg）; - ms-transform：rotate：rotate（-70deg）; - o-o-transform：rotate：rotate（-70deg） ）；
内容： '';
}
CSS3五边形
＃css3-pentagon {
位置：相对；
宽度：54px;
边缘宽度：50px 18px 0;
边界风格：固体；
边界色：＃232323透明;}＃css3-pentagon：{
内容： ;
位置：绝对；
身高：0;
宽度：0;
顶部：-85px;
左：-18px;
边缘宽度：0 45px 35px;
边界风格：固体；
边界色：透明透明＃232323;}
CSS3六边形
＃css3-hexagon {
宽度：100px;
身高：55px;
背景：＃232323;
位置：相对；
}＃css3-hexagon：{
内容： ;
位置：绝对；
顶部：-25px;
左：0;
宽度：0;
身高：0;
边界左：50px实心透明；
边界权利：50px实心透明；
边界底：25px实心＃232323; }＃css3-hexagon：{之后{
内容： ;
位置：绝对；
底部：-25px;
左：0;
宽度：0;
身高：0;
边界左：50px实心透明；
边界权利：50px实心透明；
边界顶：25px实心＃232323; }
CSS3心形
＃css3-heart {
位置：相对；
宽度：100px;
身高：90px;
}＃css3-heart：之前，＃css3-heart：{之后{
位置：绝对；
内容： ;
左：50px;
顶部：0;
宽度：50px;
身高：80px;
背景：＃232323;
-moz-border-radius：50px 50px 0 0;
Border-Radius：50px 50px 0 0; -webkit-transform：旋转（-45DEG）; - moz-transform：旋转（-45DEG）; - ms-transform：rotate：rotate（-45deg）; - o-o-transform：rotate：rotate：rotate（- 45DEG）;
变换：旋转（-45DEG）; - WebKit-Transform-Origin：0 100％; -Moz-Moz-Transform-Origin：0 100％; - MS-Transform-Origin：0 100％; - O-Transform-Origin：0 100 100 ％;
转化原始：0 100％；
}＃css3-heart：{之后{
左：0; -webkit-transform：旋转（45DEG）; - moz-transform：旋转（45DEG）; - ms-transform：旋转（45DEG）; - o-o-transform：旋转：旋转（45DEG）;
变换：旋转（45DEG）; - Webkit-transform-Origin：100％100％; -Moz-Moz-Transform-Origin：100％100％; - MS-Transform-Origin：100％100％100％; - O-O-Transform-Origin： 100％100％；
转化原始：100％100％；
}
CSS3八卦
＃css3-gossip {
宽度：96px;
身高：48px;
背景：＃f1f1f1;
边界色：＃232323;
边界风格：固体；
边缘宽度：2PX 2PX 50PX 2PX;
边界拉迪乌斯：100％；
位置：相对；
}＃css3-gossip：{
内容： ;
位置：绝对；
顶部：50％；
左：0;
背景：＃f1f1f1;
边界：18px实心＃232323;
边界拉迪乌斯：100％；
宽度：12px;
身高：12px;
}＃css3-gossip：{之后{
内容： ;
位置：绝对；
顶部：50％；
左：50％；
背景：＃232323;
边界：18px实心＃f1f1f1;
边界拉迪乌斯：100％；
宽度：12px;
身高：12px;
}