水晶塊是一種流行的CSS樣式,它使用透明和漸變效果來創建出一個閃閃發光的效果。通過使用div和CSS屬性,您可以輕松地創建自己的水晶塊。
/* CSS代碼 */ .crystal { width: 100px; height: 100px; background: linear-gradient(45deg, rgba(255,255,255,0.8) 0%, rgba(255,255,255,0) 50%), radial-gradient(circle at top left, rgba(255,255,255,0.8), rgba(255,255,255,0) 50%); box-shadow: 0 0 20px rgba(255,255,255,0.5); border-radius: 50%; }
如您所見,我們使用了2個漸變:一個是線性漸變,一個是徑向漸變。線性漸變從左上角開始,50%處透明度為0,渲染的是一個45度的色塊。徑向漸變從左上角開始渲染,透明度也是從0到0.8。box-shadow和border-radius的對應值可以調整水晶塊的樣式和形狀。這些樣式屬性是根據您的需求進行調整的。
如果您想要在您的網站上實現這個樣式,只需要在HTML中添加一個div,并將class設為crystal。這樣,您就可以為站點添加一些璀璨的水晶塊效果啦!
上一篇css滑圓
下一篇mysql 驗證數字