在Web開發中，CSS是不可或缺的一部分。它可以讓網頁變得美觀、易于導航和用戶友好。在這里，我們列舉了25個強大的CSS代碼，可以幫助你增強你的網頁設計技能。

1. 針對所有元素添加樣式：
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
2. 在網頁頂部固定導航欄：
nav {
position: fixed;
top: 0;
width: 100%;
z-index: 999;
}
3. 創建自定義滾動條：
::-webkit-scrollbar {
width: 10px;
}
::-webkit-scrollbar-track {
background-color: #f1f1f1;
}
::-webkit-scrollbar-thumb {
background-color: #888;
}
4. 讓圖片自適應大小：
img {
max-width: 100%;
height: auto;
}
5. 改變文本選中樣式：
::selection {
background-color: #00bfff;
color: #fff;
}
6. 清除鏈接下劃線：
a {
text-decoration: none;
}
7. 變換鼠標形狀：
button:hover, a:hover {
cursor: pointer;
}
8. 文字陰影：
h1 {
text-shadow: 2px 2px #000;
}
9. 改變文本大小寫：
text-transform: uppercase;
10. 隱藏元素：
display: none;
11. 塊級居中：
margin: 0 auto;
12. 創建長陰影：
box-shadow: 5px 5px 5px #ccc;
13. 讓文字垂直居中：
display: flex;
align-items: center;
14. 創建旋轉效果：
transform: rotate(45deg);
15. 開啟背景圖像平鋪：
background-repeat: repeat;
16. 交替行背景色：
tr:nth-child(even) {
background-color: #f2f2f2;
}
17. 切換元素顯示：
display: none;
display: block;
18. 把元素移到屏幕右側：
position: absolute;
right: 0;
19. 居中元素：
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
20. 在元素下方添加陰影：
box-shadow: 0 2px 2px #ccc;
21. 讓元素跳動：
animation: jump 1s infinite;
@keyframes jump {
0% {
transform: translateY(0);
}
50% {
transform: translateY(-20px);
}
100% {
transform: translateY(0);
}
}
22. 讓元素淡入淡出：
.fade-in {
animation: fadeIn ease 5s;
}
@keyframes fadeIn {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
23. 添加旋轉動畫：
.spin {
animation: spin 2s linear infinite;
}
@keyframes spin {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
24. 設置元素最小高度：
min-height: 200px;
25. 控制文本溢出樣式：
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;