css是什么?
css全名層疊樣式表勒奇,英文名Cascading Style Sheets甩十,如果看不懂沒關(guān)系,如果說html是人的人體骨干的話那么css就是穿在人身上的衣服坪郭,光看人體雖有內(nèi)容可光禿禿一覽無余个从,但是穿上了美麗動(dòng)人的衣服后就有婀娜多姿之彩,更能體現(xiàn)人體之美歪沃,而css就是充當(dāng)裝飾html作用的
總而言之嗦锐,css就充當(dāng)裝飾html作用的,直接進(jìn)入玄學(xué)世界吧
為什么這樣可以沪曙?為什么這樣又不行奕污?又抽風(fēng)了?WTF是什么鬼玩意是bug嗎液走?css日常吐槽
css版本
CSS 2.1是現(xiàn)今應(yīng)用最廣泛的css版本了碳默,自從2011年出來以后迄今為止已過9年了;但是CSS3不同以往缘眶。他是模塊升級(jí)的產(chǎn)物嘱根。顧名思義,CSS已經(jīng)被分為不同的模塊巷懈,各自升級(jí)该抒。如選擇器,媒體查詢顶燕,Color凑保。可以盡情谷歌CSS spec查詢功能割岛∮涫剩看文檔。
css周邊工具
LESS CSS:一種簡(jiǎn)化癣漆、功能更多的 CSS 語(yǔ)言
SASS:一種簡(jiǎn)化维咸、功能更多的 CSS 語(yǔ)言
PostCSS:一種 CSS 處理程序
學(xué)習(xí)資源
谷歌關(guān)鍵詞MDN
CSS Tricks + 關(guān)鍵詞 此網(wǎng)站有各種CSS的特效技巧!
阮一峰 張?chǎng)涡?等博客
codrops 里面有css實(shí)現(xiàn)的小控件
css揭秘--book
建議看英文書籍
css與html連接方法
- 內(nèi)聯(lián)樣式
- style標(biāo)簽法
- link外聯(lián)樣式
筆記部分(干貨滿滿)
- 文檔流
文檔流是什么惠爽?文檔流是文檔內(nèi)元素的流動(dòng)方向癌蓖,內(nèi)聯(lián)元素從左到右依次排開,塊級(jí)元素則是從上往下依次排開且單個(gè)元素另起一行 - div高度
div的高度是由其內(nèi)部文檔流元素的高度總和決定的 - 如何使用float來實(shí)現(xiàn)橫向布局
設(shè)置class:clearfix婚肆,在子元素上設(shè)置分別設(shè)置float然后在父元素上設(shè)置class:clearfix
clearfix代碼如下:
.clearfix::after {
content: '';
display: block;
clear: both;
}
- max-width和width的區(qū)別就是width是固定寬度是寫死的租副,不利于后續(xù)擴(kuò)展;而max-width則是最大寬度较性,這個(gè)最大寬度可以自適應(yīng)