blog's People
blog's Issues
22222
iPhone屏幕尺寸和分辨率的相关知识 ( DPI vs PPI pt vs px)
rider 是基于 Stylus 与后处理器、无侵入风格的 CSS 样式工具库。
https://www.npmjs.com/package/rider
用于h5rem适配开发
初始化设置基本字体及其他基本样式
@require('~rider/lib/rider/index.styl')
// 基础配置信息
$-base-font-size = 16px
$-bg-color = #f5f5f5
$-main-color = #fc8700
$-grey-color-1 = #333
$-grey-color-2 = #666
$-grey-color-3 = #999
// 设置背景图片
mbg($src, $size = 100% 100%, $position = 0 0, $repeat = no-repeat)
if not file-exists($src)
error('$src 必须为本地已存在的图片路径:' + $src)
background-image: url($src)
background-size: $size
background-position: $position
background-repeat: $repeat
// 设计定了个UI规范,基础宽度 720,原因是 线上安卓设备居多
arem($value, $design=720)
rem(round($value * 375 / $design , $-unit-precision))
html初始化依据基础宽度设置基本字体大小(默认以iphone6尺寸为基准进行缩放)
<script type="text/javascript">
(function (doc, win) {
var docEl = doc.documentElement,
resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
recalc = function () {
var clientWidth = docEl.clientWidth > 750 ? 750 : docEl.clientWidth;
if (!clientWidth) return;
docEl.style.fontSize = 16 * (clientWidth / 375) + 'px';
};
recalc();
if (!doc.addEventListener) return;
win.addEventListener(resizeEvt, recalc, false);
doc.addEventListener('DOMContentLoaded', recalc, false);
})(document, window);
</script>
eslint & prettier
<微前端>
service worker
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.