在前端開發(fā)中,CSS是掌握基本技能之一。CSS樣式表可以讓網(wǎng)頁(yè)看起來(lái)更美觀和專業(yè),并且提升用戶體驗(yàn)。然而,有些CSS公共樣式會(huì)被多次使用,所以在開發(fā)網(wǎng)站時(shí),我們需要了解這些常用的CSS公共樣式。下面是一些常用的CSS公共樣式。
1. 常用字體樣式:
body{ font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; font-size: 16px; font-weight: normal; line-height: 1.5; }
2. 超鏈接樣式:
a{ color: #0077cc; text-decoration: none; } a:hover{ color: #0055aa; text-decoration: underline; }
3. 文字顏色:
.color-red{ color: red; } .color-blue{ color: blue; } .color-green{ color: green; }
4. 按鈕樣式:
.btn{ background-color: #0077cc; color: #ffffff; padding: 10px 20px; border: none; border-radius: 5px; } .btn:hover{ background-color: #0055aa; }
5. 表格樣式:
.table{ border-collapse: collapse; width: 100%; } .table td, .table th{ border: 1px solid #ddd; padding: 8px; text-align: left; } .table th{ background-color: #f2f2f2; color: #444; }
6. 圖片樣式:
.img-wrap{ display: inline-block; margin: 10px; text-align: center; } .img-wrap img{ max-width: 100%; } .img-wrap p{ margin: 0; }以上是一些常用的CSS公共樣式。通過(guò)這些樣式可以為網(wǎng)站提供一致的視覺(jué)效果,并且減少了樣式代碼的重復(fù)。當(dāng)然,在開發(fā)時(shí),我們也可以根據(jù)需要自定義樣式。