CSS將背景圖像寬度設置為100%，適應性很強。

padding-top=(高度/寬度)* 100%；即圖片的高度與寬度之比，所以背景圖片的寬度可以是100%，高度可以自適應。

為了達到更好的效果，配合蓋和中心。

如何實現自適應寬度？

css自適應寬度有2種方式：

1.是通過百分比來控制寬度；

2.可以通過塊狀元素自動占滿父級的寬度的特性來實現PS：當然還有一些方法，比如css3的flex-box布局，用flex布局的話，非常的方便可以實現多種自適應布局，但是，只適用于移動端，PC端上面只有高版本的瀏覽器才兼容，低版本的瀏覽器是不兼容的。

如何讓應用自適應電腦分辨率？

如何讓PC端不同屏幕大小分辨率自適應

前提：因為項目需求是在已有的項目里面增加自適應，不影響其他頁面的已有的布局，以下方法僅供參考。

1、安裝postcss-px2rem 、px2rem-loader、lib-flexible

2、在根目錄src中新建util目錄下新建rem.js等比適配文件

找到node_modules里的lib-flexible包,拷貝一份放在utils里面取名為flexible.js，修改lib-flexible的源碼,(更改refreshRem函數)修改為下面的代碼就可以了，當然if判斷是根據自己需求的調整。

目的：因為lib-flexible的源碼是針對移動端的設計方案，我們要實現PC的自適應所以屏幕尺寸也要更換。

3、在 main.js中引入我們剛修改過的flexible.js文件(因為我們更改了源碼 ，所有我們需要引入我們改過的文件)

4、在vue.config.js中配置插件

注意：

1、改完配置記得重新編譯項目

2、如果個別地方不想轉化px。可以簡單的使用大寫的PX或 Px。

css+p布局，左右兩個p怎么能自動適應高度？

可以通過js實現兩個p自適應同等高度，如下： 先設置p+css 基本布局：

左邊

右邊

js 實現 p 自適應高度 代碼如下：

總結

以上是生活随笔為你收集整理的css怎么让高度自适应（css高度自适应怎么实现）的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。