bmy/ClassContent
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

first commit

Browse Source
This commit is contained in:
编码猿
2024-09-27 02:06:13 +08:00
commit 852d94fbb9
36760 changed files with 3274413 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

37
历届学生/font-end-nine/每天上课/2022-06-08/index.html Normal file
View File

@@ -0,0 +1,37 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>rem</title>
<script src="./rem.js"></script>
<style>
body {
margin: 0;
}
.box {
width: 3.75rem;
height: 3.75rem;
float: left;
}
.box_1 {
background: red;
font-size: .4rem;
}
.box_2 {
background: yellow;
}
</style>
</head>
<body>
<div class="box box_1">你好</div>
<div class="box box_2"></div>
</body>
</html>

12
历届学生/font-end-nine/每天上课/2022-06-08/rem.js Normal file
View File

@@ -0,0 +1,12 @@
; (function (doc, win, undefined) {
var docEl = doc.documentElement,
resizeEvt = 'orientationchange' in win ? 'orientationchange' : 'resize',
recalc = function () {
var clientWidth = docEl.clientWidth;
if (clientWidth === undefined) return;
docEl.style.fontSize = 100 * (clientWidth / 750) + 'px';
};
if (doc.addEventListener === undefined) return;
win.addEventListener(resizeEvt, recalc, false);
doc.addEventListener('DOMContentLoaded', recalc, false)
})(document, window);

12
历届学生/font-end-nine/每天上课/2022-06-08/媒体查询.html Normal file
View File

@@ -0,0 +1,12 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>媒体查询</title>
</head>
<body>
</body>
</html>

14
历届学生/font-end-nine/每天上课/2022-06-08/笔记.txt Normal file
View File

@@ -0,0 +1,14 @@
rem
弹性盒子 布局兼容
rem 尺寸兼容
真实的尺寸 = 你写的rem尺寸 * html上的font-size(16)
媒体查询
通过 css 去判断你的屏幕宽度，然后设置对应的兼容代码 响应式兼容
js