CSS3學習(九) 更高級的CSS用法

面向對象的CSS思想
1.作用:
①代碼複用,減小代碼體積
②提高渲染效率
③建立起組件庫思想、柵格佈局、減少選擇器,提升思考的格局

2.注意:
①結構與皮膚分離
②容器與內容分離
③抽象出可重用元素,建立組件庫
④避免ID選擇器,重用度爲0,除非用在Js中

官方網站:http://www.oocss.org
常用css庫:normalnize.css/resize.css/Neat.css(推薦)

Less(css的預處理動態語言,基於javascript)
作用:可以在css中使用變量、函數、繼承等動態語言的特性
學習:http://less.bootcss.com/features/

Sass(css的預處理語言,基於Ruby)
學習:http://www.w3cplus.com/sassguide/
框架:compass

雙飛翼 和 聖盃 佈局:
收穫:
①學會使用負邊距:

    `margin-left:-100%;`
//如果上一行有一個浮動的塊狀元素,負邊距會使本行元素也頂到上一行對應位置;

②li標籤默認是豎直方向放置的,如果需要變橫向,只需加入display屬性值爲inline即可;

發佈了41 篇原創文章 · 獲贊 4 · 訪問量 2萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章