1. flex布局：又叫做彈性布局
? ? 任何一個容器都可以指定flex布局余佛，如display:flex 或 display:inline-flex
注意：設(shè)置了flex布局以后分飞，子元素的float，clear掌唾，vertical-align屬性將失效
容器的屬性：
? ?flex-direction flex-wrap flex-flow justify-content align-items align-content
2. margin塌陷問題
? ? 1）父子元素的margin塌陷
? ? ? ? 解決方法：（1）給父級設(shè)置邊框或內(nèi)邊距(不建議使用)
? ? ? ? ? ? ? ? ? ? ? ? ? （2）觸發(fā)bfc(塊級格式上下文),改變父級的渲染規(guī)則
????????????????????????????????????方法:
????????????????????????????????????改變父級的渲染規(guī)則有以下四種方法,給父級盒子添加
????????????????????????????????????(1)position:absolute/fixed
????????????????????????????????????(2)display:inline-block;
????????????????????????????????????(3)float:left/right
????????????????????????????????????(4)overflow:hidden
????????????????????????????????????這四種方法都能觸發(fā)bfc,但是使用的時候都會帶來不同的麻煩,具體使用中還需根據(jù)具體情況選擇沒有影響的來解決margin塌陷
????2）margin合并
? ? ? ? ?原理:兩個兄弟結(jié)構(gòu)的元素在垂直方向上的margin是合并的
? ??????margin合并問題也可以用bfc解決,
????????1.給box2加上一層父級元素并加上overflow:hidden;
????????2.給兩個都加一層父級再加bfc
? ??????但是這兩種方法都改變了HTML結(jié)構(gòu),在開發(fā)中是不能采用的
所以在實際應(yīng)用時,在margin合并這個問題上,我們一般不用bfc,而是通過只設(shè)置上面的元素的margin-bottom來解決距離的問題
3.?前端解決移動端適配的五種方法
? ??https://blog.csdn.net/weixin_37632943/article/details/95471535
? ??https://zhuanlan.zhihu.com/p/80692165
4.?移動端1px解決方案
? ??https://zhuanlan.zhihu.com/p/100752129
5.?Vue單頁面如何做seo頁面優(yōu)化
? ?1）服務(wù)端渲染
服務(wù)端渲染對于du剛接觸 vue 的新手來說，并不是那么友好舆吮，雖然zhi已有官方 SSR 中文文檔红淡。dao但是對于一個已經(jīng)開發(fā)完畢的 vue 項目去接 SSR 無論是從工作量還是技術(shù)角度來說，都是一種挑戰(zhàn)猪半。
? ?2）預(yù)渲染方式
在構(gòu)建時 (build time) 簡單地生成針對特定路由的靜態(tài) HTML 文件兔朦。優(yōu)點是設(shè)置預(yù)渲染更簡單，并可以將您的前端作為一個完全靜態(tài)的站點磨确。如果您使用 webpack沽甥，您可以使用 prerender-spa-plugin 輕松地添加預(yù)渲染。它已經(jīng)被 Vue 應(yīng)用程序廣泛測試乏奥。
6. webpack打包html里面img后src為“[object Module]”問題
????官方的說明是摆舟，vue-loader在編譯template模塊時會將它遇到的所有資源url轉(zhuǎn)換為webpack模塊請求，而vue使用的是commonjs規(guī)范邓了，file-loader使用的是es module規(guī)范恨诱，所以解決方法是file-loader處理文件時不使用esModule，也就是把esModule設(shè)置為false
