CSS代碼是現代網站設計中必不可少的一部分,可以使網站界面更加美觀、清晰,同時還可以提高用戶體驗。下面是一些常見的CSS代碼案例:
/* 更改字體 */ body { font-family: Arial, sans-serif; } /* 更改背景顏色和圖片 */ body { background-color: #f2f2f2; background-image: url('bg.jpg'); } /* 更改鏈接樣式 */ a { color: #0077cc; text-decoration: none; } /* 更改按鈕樣式 */ .button { background-color: #0077cc; color: #fff; border: none; padding: 10px 20px; border-radius: 5px; } /* 創建響應式布局 */ @media screen and (max-width: 600px) { .container { flex-direction: column; } } /* 設置動畫效果 */ .button:hover { animation-name: pulse; animation-duration: 1s; animation-iteration-count: infinite; } @keyframes pulse { 0% { transform: scale(1); } 50% { transform: scale(1.2); } 100% { transform: scale(1); } }
以上是一些常見的CSS代碼案例,可以根據需求進行修改、組合,實現更好的網站設計效果。