CSS(Cascading Style Sheets)是一門用于描述網頁樣式的語言,是HTML(Hypertext Markup Language)的重要補充。學好CSS對于網頁設計和開發是非常重要的。
CSS基礎:
/*樣式定義*/ selector { property: value; } /*例如:*/ p { color: red; } /*選擇器*/ #id { property: value; } .class { property: value; } /*例如:*/ #header { background-color: blue; } .intro { font-size: 24px; } /*屬性*/ color:文字顏色; background-color:背景顏色; font-size:字體大小; font-family:字體樣式; text-align:對齊方式等等。
CSS應用:
/*網頁布局*/ body { width: 100%; height: 100%; margin: 0; } header { width: 100%; height: 100px; background-color: blue; } nav { width: 20%; height: 500px; float: left; } main { width: 80%; height: 500px; float: left; } footer { width: 100%; height: 100px; background-color: gray; } /*響應式布局*/ @media (max-width: 600px) { nav { width: 100%; height: auto; float: none; } main { width: 100%; height: auto; float: none; } } /*動畫效果*/ div { width: 100px; height: 100px; background-color: blue; transition: width 2s; } div:hover { width: 200px; }
以上是CSS基礎和應用的簡單介紹,CSS的學習需要結合實際項目進行練習,多加實踐才能掌握CSS。
上一篇css基礎的樣式
下一篇mysql數據庫是否堵了