CSS起源

• web的衰落：

• 在web早期（1990-1993）,html是一個很局限的語言。幾乎完全由用于描述段落，超鏈接，列表和標題的結構化元素組成。隨著萬維網的出現（用戶交互體驗的加強），對html的要求越來越大，人們迫切需要html增加新的元素，去完成一個特定的功能

• 迫于壓力，html開始出現<font>，<i> , <s>等標簽。但是html是一種描述結構的語言，也開始描述外在表現了。幾年之后這種隨便的做法暴露出嚴重的問題：1：由于html既寫結構又寫樣式，導致頁面缺乏結構性，降低了網頁的可訪問性。2：頁面維護越來越困難

• 大救星Css

• 當html中存斥著的表現標記問題，W3c并沒有忽視。在1995年，w3c開始發布一種正在進行的計劃（work-in-prrgress） 稱之為css

• 與html相比，Css支持更豐富的文檔外觀，Css可以為任何元素的文本和背景設置顏色；允許在任何元素外圍設置邊框；允許改變文本的大小，裝飾（如下劃線），間隔，甚至可以確定是否顯示文本。

---

體驗CSS

• 用HTML完成
• 哪個標簽有哪個屬性難以記憶
• 需求變更影響較大(例如像修改成功法則以下的文字顏色需要修改4個地方)

<h1 align="center"><font face="微軟雅黑" color="red">成功法則</font> </h1> <p align="center"><font face="微軟雅黑" color="blue" size="5">遲到毀一生</font> </p> <p align="center"><font face="微軟雅黑" color="blue" size="5">早退窮三代</font> </p> <p align="center"><font face="微軟雅黑" color="blue" size="5">按時上下班</font> </p> <p align="center"><font face="微軟雅黑" color="blue" size="5">必成高富帥</font> </p>

• 用HTML+CSS完成
• 不用記憶哪些屬性屬于哪個標簽
• 當需求變更時我們不需要修改大量的代碼就可以滿足需求
• 在前端開發中CSS只有一個作用, 就是用來修改樣式

<style type="text/css">h1{text-align: center;color: red;font-family: "微軟雅黑";}p{text-align: center;color: blue;font-size: 20px;} </style><h1>成功法則</h1> <p>遲到毀一生</p> <p>早退窮三代</p> <p>按時上下班</p> <p>必成高富帥</p>

---

CSS格式

• 格式:

<style type="text/css">標簽名稱{屬性名稱: 屬性對應的值;...} </style>

• 注意點:

• style標簽必須寫在head標簽的開始標簽和結束標簽之間(也就是必須和title標簽是兄弟關系)

• style標簽中的type屬性其實可以不用寫, 默認就是type="text/css"

• 設置樣式時必須按照固定的格式來設置. key: value;其中:不能省略, 分號大多數情況下也不能省略(當有多個屬性時, 最后一個可以省略)

• CSS怎么學?

• CSS的學習一共分為兩大部分, 一個是CSS的屬性, 另一個是CSS選擇器. 也就是說著兩部分學完CSS就沒有別的東西了

---

學習交流方式:
1.微信公眾賬號搜索: 李南江(配套視頻,代碼,資料各種福利獲取)
2.加入前端學習交流群:
302942894 / 289964053 / 11550038

總結

以上是生活随笔為你收集整理的08-CSS基础-体验CSS的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。