HTML是網頁的基礎,而CSS美化網頁的外觀。在CSS中,我們可以通過屬性和值來定義HTML元素的樣式。有些CSS代碼可以讓網頁變得更加炫酷,下面給大家分享一些常用的CSS代碼。
/* 1. 文本模糊效果 */ .text { color: transparent; text-shadow: 0 0 5px rgba(0,0,0,0.5); } /* 2. 實現純CSS滾動條 */ ::-webkit-scrollbar { width: 15px; } ::-webkit-scrollbar-track { background-color: #f1f1f1; } ::-webkit-scrollbar-thumb { background-color: #888; border-radius: 10px; } /* 3. 鼠標經過文本顯示邊框 */ .hover-border { border: 2px solid transparent; } .hover-border:hover { border-color: #ff6600; } /* 4. 實現抖動動畫效果 */ @keyframes shake { 0% { transform: translate(1px, 1px) rotate(0deg); } 10% { transform: translate(-1px, -2px) rotate(-1deg); } 20% { transform: translate(-3px, 0px) rotate(1deg); } 30% { transform: translate(3px, 2px) rotate(0deg); } 40% { transform: translate(1px, -1px) rotate(1deg); } 50% { transform: translate(-1px, 2px) rotate(-1deg); } 60% { transform: translate(-3px, 1px) rotate(0deg); } 70% { transform: translate(3px, 1px) rotate(-1deg); } 80% { transform: translate(-1px, -1px) rotate(1deg); } 90% { transform: translate(1px, 2px) rotate(0deg); } 100% { transform: translate(1px, -2px) rotate(-1deg); } } .shake { animation: shake 1s infinite; }
以上這些CSS代碼只是冰山一角,同樣的代碼在不同的網頁上會產生不同的效果,因此我們需要根據具體情況去選擇和修改CSS代碼。希望這些代碼能對您的網頁美化有所啟發。