成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

前端入門實踐：CSS & 調(diào)試工具篇

Lavender / 1003人閱讀

摘要：篇塊級元素行內(nèi)元素文檔流將窗體自上而下分成一行行，并在每行中按從左至右的順序排放元素，即為文檔流。

CSS篇 1.塊級元素 VS 行內(nèi)元素

文檔流!

將窗體自上而下分成一行行， 并在每行中按從左至右的順序排放元素，即為文檔流。

塊級元素：自動換行；垂直排列；width/height/margin/padding都可控制；默認(rèn)寬度100%，除非設(shè)置width/margin

div , dl , fieldset , form , h1 , h2 , h3 , h4 , h5 , h6 , hr , menu , noframes , noscript , ol , p , pre , table , ul , li...

行內(nèi)元素：水平排列；width/height無效，只能通過line-height設(shè)置；margin/padding左右有效，上下無效

a , b , big , br , cite , code , dfn , em , font , i , img , input , kbd , label , q , s , samp , select , small , span , strike , strong , sub , sup...

display/float/position可以改變元素顯示類型， inline->block, block->inline

2.CSS盒模型

box-sizing

3. display

none

inline

block

inline-block

table

table-cell

flex

4.布局

position

static, relative, absolute, fixed

top, left, right, bottom

float
桌面瀏覽器，二三欄布局，需要清除浮動

flex
移動端的時代，彈性布局，瀏覽器前綴兼容

http://zh.learnlayout.com/

http://www.runoob.com/w3cnote...

5.兼容性查看

https://caniuse.com/

工具篇 1.chrome/ff開發(fā)者工具

html&css調(diào)試

console

斷點, debugger

網(wǎng)絡(luò)請求

...

2.Fiddler / Charles

mock數(shù)據(jù)

修改header

3.weinre

遠(yuǎn)程調(diào)試

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/116867.html

相關(guān)文章

  • 前端資源系列（4）-前端學(xué)習(xí)資源分享&前端面試資源匯總

    摘要：特意對前端學(xué)習(xí)資源做一個匯總，方便自己學(xué)習(xí)查閱參考，和好友們共同進(jìn)步。 特意對前端學(xué)習(xí)資源做一個匯總，方便自己學(xué)習(xí)查閱參考，和好友們共同進(jìn)步。 本以為自己收藏的站點多，可以很快搞定，沒想到一入?yún)R總深似海。還有很多不足&遺漏的地方，歡迎補充。有錯誤的地方，還請斧正... 托管: welcome to git，歡迎交流，感謝star 有好友反應(yīng)和斧正，會及時更新，平時業(yè)務(wù)工作時也會不定期更...

    princekin 評論0 收藏0

  • 個人分享--web前端學(xué)習(xí)資源分享

    摘要：前言月份開始出沒社區(qū)，現(xiàn)在差不多月了，按照工作的說法，就是差不多過了三個月的試用期，準(zhǔn)備轉(zhuǎn)正了一般來說，差不多到了轉(zhuǎn)正的時候，會進(jìn)行總結(jié)或者分享會議那么今天我就把看過的一些學(xué)習(xí)資源主要是博客，博文推薦分享給大家。 1.前言 6月份開始出沒社區(qū)，現(xiàn)在差不多9月了，按照工作的說法，就是差不多過了三個月的試用期，準(zhǔn)備轉(zhuǎn)正了！一般來說，差不多到了轉(zhuǎn)正的時候，會進(jìn)行總結(jié)或者分享會議！那么今天我就...

    sherlock221 評論0 收藏0

  • 前端資源分享-只為更好前端

    摘要：一團(tuán)隊組織網(wǎng)站說明騰訊團(tuán)隊騰訊前端團(tuán)隊，代表作品，致力于前端技術(shù)的研究騰訊社交用戶體驗設(shè)計，簡稱，騰訊設(shè)計團(tuán)隊網(wǎng)站騰訊用戶研究與體驗設(shè)計部百度前端研發(fā)部出品淘寶前端團(tuán)隊用技術(shù)為體驗提供無限可能凹凸實驗室京東用戶體驗設(shè)計部出品奇舞團(tuán)奇虎旗下前 一、團(tuán)隊組織 網(wǎng)站 說明 騰訊 AlloyTeam 團(tuán)隊 騰訊Web前端團(tuán)隊，代表作品WebQQ，致力于前端技術(shù)的研究 ISUX 騰...

    zxhaaa 評論0 收藏0

  • 前端資源分享-只為更好前端

    摘要：一團(tuán)隊組織網(wǎng)站說明騰訊團(tuán)隊騰訊前端團(tuán)隊，代表作品，致力于前端技術(shù)的研究騰訊社交用戶體驗設(shè)計，簡稱，騰訊設(shè)計團(tuán)隊網(wǎng)站騰訊用戶研究與體驗設(shè)計部百度前端研發(fā)部出品淘寶前端團(tuán)隊用技術(shù)為體驗提供無限可能凹凸實驗室京東用戶體驗設(shè)計部出品奇舞團(tuán)奇虎旗下前 一、團(tuán)隊組織 網(wǎng)站 說明 騰訊 AlloyTeam 團(tuán)隊 騰訊Web前端團(tuán)隊，代表作品WebQQ，致力于前端技術(shù)的研究 ISUX 騰...

    JouyPub 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<