在公共css文件中添加下面的代碼
~~~
html {
font-size: 16px;
}
@media screen and (min-width: 375px) {
html {
/* iPhone6的375px尺寸作為16px基準,414px正好18px大小, 600 20px */
font-size: calc(100% + 2 * (100vw - 375px) / 39);
font-size: calc(16px + 2 * (100vw - 375px) / 39);
}
}
@media screen and (min-width: 414px) {
html {
/* 414px-1000px每100像素寬字體增加1px(18px-22px) */
font-size: calc(112.5% + 4 * (100vw - 414px) / 586);
font-size: calc(18px + 4 * (100vw - 414px) / 586);
}
}
@media screen and (min-width: 600px) {
html {
/* 600px-1000px每100像素寬字體增加1px(20px-24px) */
font-size: calc(125% + 4 * (100vw - 600px) / 400);
font-size: calc(20px + 4 * (100vw - 600px) / 400);
}
}
@media screen and (min-width: 1000px) {
html {
/* 1000px往后是每100像素0.5px增加 */
font-size: calc(137.5% + 6 * (100vw - 1000px) / 1000);
font-size: calc(22px + 6 * (100vw - 1000px) / 1000);
}
body {
width: 1200px;
margin: 0 auto;
}
}
~~~
- mui框架
- toast提示框的使用
- 星級評分
- 上拉刷新和下拉加載里超鏈接失效的原因
- confirm確認框的使用
- 取消下拉刷新和上拉加載的border
- 解決使用加載的方式捕捉不到dom
- css樣式篇
- css3實現0.5像素的邊框
- css3樣式中的border-radius的圓角邊框
- css面試篇之紅色十字架
- css樣式~~用圖片模擬單選框radio的功能
- div設置絕對定位以后,文字實現居中
- 設置input里面字體顏色和大小
- js知識篇
- javascript篇~~九九乘法表
- js~跳轉提示頁面
- js~實現60秒倒計時
- 正則表達式之保留小數點后兩位小數
- 數組操作方法篇
- Array.prototype.filter()的用法
- 使用正則去除空格
- jQuery知識篇
- jQuery~~模仿radio圖片切換
- 下拉菜單的滑動效果
- jQuery點擊切換字體顏色
- jQuery實現圖片和字體圖標顏色的切換
- 左側菜單之當前點擊菜單展開,其他菜單收縮
- jQuery全選或全部不選
- 實現子菜單的收縮和展開
- 小程序
- 小程序~調用豆瓣api數據的問題
- 實現毫秒級倒計時
- 條件渲染-wx:if語句
- 實現兩個頁面共存
- wxss樣式問題
- 修改按鈕默認的border-radius
- 移動端
- 安卓底部按鈕浮上來的解決方法
- excel(xlsx) to json
- vue
- 事件
- 某個元素的點擊事件
- 阻止子事件的冒泡
- excel文件的導入功能(解析成json數據)
- iview框架
- render函數
- iview不支持鍵盤事件的解決方法
- 路由傳參
- 搜索框template的基本寫法
- watch監聽
- 路由發生變化,數據沒有更新?
- 動態組件
- 刷新組件
- 前端小功能
- 搜索框
- axios
- axios公共請求方法
- cookie的簡單使用
- 微信掃碼登錄功能
- pc端微信掃碼登錄-內嵌網頁版
- MongoDB
- 安裝與配置
- 布局
- js判斷打開是PC端還是移動端
- 自適應布局方案-視口布局
- js實現加密和解密的公共方法
- js實現正則表達式匹配的文字加上標簽
- python
- 解決pip升級不成功的原因
- Django
- runserver 失敗的原因