資訊專欄INFORMATION COLUMN
摘要：相對(duì)定位絕對(duì)定位樣式繼承浮動(dòng)等等吧首先說(shuō)一下基礎(chǔ)類型選擇器。其次就是在開發(fā)的過(guò)程中，經(jīng)常會(huì)忽略個(gè)的占位，導(dǎo)致?lián)Q行顯示。
即使很忙很忙，也請(qǐng)你放下手中的事，抽出一點(diǎn)時(shí)間，來(lái)總結(jié)一下過(guò)往的點(diǎn)點(diǎn)滴滴。
這篇文章是我近兩天看了“網(wǎng)易云課堂”的心得，記錄下來(lái)留作以后可以回顧。我在GitHub上也有上傳代碼：源碼地址
我本身是一個(gè)PHPer，所以稍微復(fù)雜一點(diǎn)的Html和Js就暈乎乎的，大致的解題思路我其實(shí)非常清楚，但一遇到Css我就迷糊。相對(duì)定位、絕對(duì)定位、樣式繼承、浮動(dòng)等等吧
首先說(shuō)一下基礎(chǔ)類型選擇器。
包括標(biāo)簽選擇、ID選擇、class選擇，在開發(fā)中，我們也會(huì)遇到一個(gè)標(biāo)簽應(yīng)用多種樣式的情況，比如：這里其實(shí)就是類選擇器，多個(gè)類之間使用空格隔開。在比如在Css文件中會(huì)經(jīng)常看到這樣的代碼：body,ul,ol{margin:0px; padding:0px},多個(gè)標(biāo)簽選擇器見(jiàn)使用逗號(hào)隔開，表示每個(gè)標(biāo)簽都應(yīng)用這樣的樣式；又或者.circle ul表示class=“circle”下的ul標(biāo)簽應(yīng)用的樣式，這中帶有層級(jí)關(guān)系的樣式，也使用空格進(jìn)行分割。
其次就是在開發(fā)的過(guò)程中，經(jīng)常會(huì)忽略margin個(gè)padding的占位，導(dǎo)致div換行顯示。實(shí)際一個(gè)div的大小其實(shí)為:margin + padding + width;
在其次就是一些小的細(xì)節(jié)：比如外邊距的合并，在一個(gè)元素出現(xiàn)在另一個(gè)元素的上邊時(shí)，第一個(gè)元素的下外邊距與第二個(gè)元素的上外邊距會(huì)發(fā)生合并；在float操作之后，一般都會(huì)追加一個(gè) 最后總結(jié)一下居中的使用：一、要求字體的line-height等于div的height，這樣可以做到垂直劇中；二、使用margin:0px auto也可以做到div水平居中 文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。 轉(zhuǎn)載請(qǐng)注明本文地址：http://m.specialneedsforspecialkids.com/yun/92362.html來(lái)消除浮動(dòng)的影響；
稍微整理了一下自己平時(shí)看到的前端學(xué)習(xí)資源，分享給大家。 html MDN：Mozilla開發(fā)者網(wǎng)絡(luò) SEO：前端開發(fā)中的SEO css 張?chǎng)涡瘢簭場(chǎng)涡竦牟┛?css精靈圖：css精靈圖實(shí)踐 柵格系統(tǒng)：詳解CSS中的柵格系統(tǒng) 媒體查詢：css媒體查詢用法 rem布局：手機(jī)端頁(yè)面自適應(yīng)布局 移動(dòng)前端開發(fā)之viewport的深入理解:深入理解viewport 淘寶前端布局：手機(jī)淘寶移動(dòng)端布局 fl...
showImg(https://segmentfault.com/img/remote/1460000018716142?w=200&h=200); showImg(https://segmentfault.com/img/remote/1460000018716143);showImg(https://segmentfault.com/img/remote/1460000010953710);...
摘要：前言前端技術(shù)日新月異，隨著大前端的趨勢(shì)，想要成為一名合格的前端工程師，需要學(xué)習(xí)掌握的東西更是寬泛。閑話少說(shuō)，這次給大家整理分享一些前端進(jìn)階的優(yōu)質(zhì)學(xué)習(xí)資源，希望對(duì)大家有所幫助個(gè)人博客地址 前言 前端技術(shù)日新月異，隨著 大前端 的趨勢(shì)，想要成為一名合格的前端工程師，需要學(xué)習(xí)掌握的東西更是寬泛。所以我們?cè)趯で筮M(jìn)階的過(guò)程中，既要不斷夯實(shí)前端基礎(chǔ)，也要快速響應(yīng)技術(shù)的更新迭代。閑話少說(shuō)，這次給大家...
摘要：在這里，我根據(jù)瀏覽器的工作原理整理了一套自己的知識(shí)體系，方便自己學(xué)習(xí)，有很多不足的地方，希望大家多多交流。圖片可以點(diǎn)擊查看原圖進(jìn)行觀看 做前端的同學(xué)都知道，前端技術(shù)目前需要學(xué)習(xí)的知識(shí)太多了，各種框架，技術(shù)層出不窮，但只要我們自己有自己的一套知識(shí)體系，打好基礎(chǔ)，再學(xué)習(xí)新東西就會(huì)很容易。在這里，我根據(jù)瀏覽器的工作原理整理了一套自己的知識(shí)體系，方便自己學(xué)習(xí)，有很多不足的地方，希望大家多多交流...
摘要：在這里，我根據(jù)瀏覽器的工作原理整理了一套自己的知識(shí)體系，方便自己學(xué)習(xí)，有很多不足的地方，希望大家多多交流。圖片可以點(diǎn)擊查看原圖進(jìn)行觀看 做前端的同學(xué)都知道，前端技術(shù)目前需要學(xué)習(xí)的知識(shí)太多了，各種框架，技術(shù)層出不窮，但只要我們自己有自己的一套知識(shí)體系，打好基礎(chǔ)，再學(xué)習(xí)新東西就會(huì)很容易。在這里，我根據(jù)瀏覽器的工作原理整理了一套自己的知識(shí)體系，方便自己學(xué)習(xí)，有很多不足的地方，希望大家多多交流...
摘要：在這里，我根據(jù)瀏覽器的工作原理整理了一套自己的知識(shí)體系，方便自己學(xué)習(xí)，有很多不足的地方，希望大家多多交流。圖片可以點(diǎn)擊查看原圖進(jìn)行觀看 做前端的同學(xué)都知道，前端技術(shù)目前需要學(xué)習(xí)的知識(shí)太多了，各種框架，技術(shù)層出不窮，但只要我們自己有自己的一套知識(shí)體系，打好基礎(chǔ)，再學(xué)習(xí)新東西就會(huì)很容易。在這里，我根據(jù)瀏覽器的工作原理整理了一套自己的知識(shí)體系，方便自己學(xué)習(xí)，有很多不足的地方，希望大家多多交流...
閱讀 1992·2021-11-24 09:39
閱讀 986·2021-11-11 16:55
閱讀 1441·2021-10-09 09:43
閱讀 1427·2021-10-08 10:17
閱讀 1661·2021-08-25 09:41
閱讀 431·2019-08-30 13:02
閱讀 634·2019-08-29 15:14
閱讀 1011·2019-08-29 13:53
