本文將向大家介紹如何利用CSS3的新樣式屬性制作一個HTML5的Logo。我們先來看看最終的效果:
不要懷疑,上面的logo完全由HTML+CSS實現。我們將logo劃分為盾形、數字5和輻射背景三大部分,下面將分別實現每個部分。
盾形
盾形在外形上是左右對稱的,因此我們可先完成左半邊,右半邊可復制過來再修改一些參數。左半邊準備用三個div實現,其中有兩個div需要傾斜一定的角度來實現盾形的左邊和底邊,這里使用transform的skew來完成。代碼如下(注意,這里只使用了webkit前綴的樣式,僅在Chrome、Safari等Webkit內核瀏覽器支持):
新聞熱點
疑難解答