index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>CSS Tricks</title>
<link rel="icon" href="static/favicon.ico" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta
name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"
/>
<meta
name="description"
content="You-need-to-know-css,CSS tricks web developers need to know"
/>
<meta
name="Keywords"
content="css,css tricks,translucent-borders,multiple-borders,inner-rounding,background-position,stripes-background,ellipse,parallelogram,bevel-corners,pie-chart,polygon,single-projection,irregular-projection,frosted-glass,zebra-stripes,text-effects,circular-text,mouse-cursor,extend-hit-area,custom-checkbox,custom-radio,input-align,shadow-weaken-background,blurry-weaken-background,image-slider,fluid-fixed,sticky-footer,centering-known,holy-grail-layout,double-wing-layout,elastic,blink,typing,shake,smooth,circular-smooth,text-underline,poptip,scrollbar,边框与背景,半透明边框,多重边框,边框内圆角,背景定位,条纹背景,常见形状,圆与椭圆,parallel四边形,切角效果,简易饼图,提示气泡,其他多边形,视觉效果,常见投影,不规则投影,毛玻璃效果,斑马条纹,文字特效,环形文字,图片对比控件,用户体验,选择合适的鼠标光标,扩大可点击区域,自定义复选框,自定义单选框,输入框完美居中,圣杯布局,双飞翼布局,类订单布局,通过阴影弱化背景,通过模糊弱化背景,自定义文字下划线,自定义scroll滚动条,结构布局,全背景等宽内容居中,绝对底部,水平垂直居中,有趣的布局,动画过渡,弹性过度,闪烁效果,打字效果,抖动效果,无缝平滑效果,延轨迹平滑效果"
/>
<link rel="stylesheet" href="./assets/vue.css" />
<link rel="stylesheet" href="./assets/vuep.css" />
<link rel="stylesheet" href="./assets/gitalk.css" />
<link rel="stylesheet" href="./assets/index.css" />
</head>
<body>
<div id="app"></div>
<script src="./libs/babel.min.js"></script>
<script src="./libs/index.js?v=201804130341"></script>
<!-- <script src="./libs/docsify.min.js"></script> -->
<script src="//cdn.jsdelivr.net/npm/docsify@4.6.6/lib/docsify.min.js"></script>
<!-- <script src="./libs/gitalk.min.js"></script> -->
<script src="//cdn.jsdelivr.net/npm/gitalk@1/dist/gitalk.min.js"></script>
<script src="./libs/vue.min.js"></script>
<script src="./libs/vuep.min.js"></script>
<script src="./libs/search.min.js"></script>
<script src="./libs/ga.js"></script>
<script src="./libs/emoji.js"></script>
<script src="./libs/prism-markdown.min.js"></script>
<script src="./libs/prism-scss.min.js"></script>
<script src="./libs/docsify-pagination.min.js"></script>
<script>
// navigator.serviceWorker && navigator.serviceWorker.register('sw.js');
// navigator.serviceWorker && navigator.serviceWorker.ready.then(registration => {
// registration.unregister();
// });
// Hotjar Tracking Code for https://lhammer.cn/You-need-to-know-css/#/
(function (h, o, t, j, a, r) {
h.hj =
h.hj ||
function () {
(h.hj.q = h.hj.q || []).push(arguments);
};
h._hjSettings = { hjid: 773508, hjsv: 6 };
a = o.getElementsByTagName("head")[0];
r = o.createElement("script");
r.async = 1;
r.src = t + h._hjSettings.hjid + j + h._hjSettings.hjsv;
a.appendChild(r);
})(window, document, "https://static.hotjar.com/c/hotjar-", ".js?sv=");
</script>
</body>
</html>