用css3實作了個ThinkPHP網站logo
效果圖如下：
<br>
<br>
<br>
<br>
<meta>
<br>
tp_logo標題><br>
<br>
<br>
<br>
.border{邊框：1pxsolid#000；寬度：200px；邊距：0auto}<br>
#logo,#left,#right,#bottom{寬度: 200 像素;高度: 200 像素;}<br>
#標誌{<br>
背景色：#84C255；<br>
以左上方邊框半徑：30px；<br>
‧右下邊框半徑：30px； <br>
溢出：隱藏；<br>
職務：對位； <br>
}<br>
#左{ <br>
轉換：旋轉（45度）；<br>
左：-140px；<br>
背景色：#6FB737；<br>
位置：絕對；<br>
}<br>
#對了{<br>
轉換：旋轉（45度）；<br>
右：-140px；<br>
背景色：#6FB737；<br>
位置：絕對；<br>
}<br>
#底部{<br>
轉換：旋轉（45度）；<br>
以上方：140 像素；<br>
背景色：#5E9C2F；<br>
位置：絕對；<br>
}<br>
.波{<br>
的字體系列：arial；<br>
轉換：縮放（0.9，0.38）旋轉（-64度）skewX（-50deg）skewY（10deg）；<br>
字體大小：400px；<br>
顏色：#FFF；<br>
位置：絕對；<br>
text-shadow: -0.5px -0.5px 0.25px #171617;display: none;<br>
}<br>
.line{<br>
position: relative;<br>
border-left: 38px solid white;<br>
width: 40px;<br>
height: 70px;<br>
border-bottom-left-radius: 78px 60px;<br>
}<br>
.right{transform:rotate(-120deg);}<br>
.left{transform:rotate(60deg);}<br>
#line1_right{<br>
top:20px;<br>
left: -28px;<br>
}<br>
#line1_left{<br>
top:19px;<br>
left: -68px;<br>
}<br>
#line2_right{<br>
top:-70px;<br>
left: 10px;<br>
}<br>
#line2_left{<br>
top:-71px;<br>
left: -30px;<br>
} <br>
#line3_right{<br>
top:-160px;<br>
left: 48px;<br>
}<br>
#line3_left{<br>
top:-161px;<br>
left: 10px;<br>
} <br>
</style><br>
</head><br>
<body><br>
<center class="border"><br>
<div id="logo"><br>
<div id="left"></div><br>
<div id="right"></div><br>
<div id="bottom"></div><br>
<div class="line right" id="line1_right"></div><br>
<div class="line left" id="line1_left"></div>
<br>
<div></div>
<br>
<div class="line left" id="line2_left"></div>
<br>
<div class="line right" id="line3_right"></div>
<br>
<div class="line left" id="line3_left"></div>
<br>
<br>
中心><br>
身體><br>
