first commit

2024-09-27 02:06:13 +08:00
commit 852d94fbb9
36760 changed files with 3274413 additions and 0 deletions
--- a/历届学生/18课程/class18_2/课程/2020-12-14/flex.html
+++ b/历届学生/18课程/class18_2/课程/2020-12-14/flex.html
@@ -0,0 +1,39 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+    <style>
+        body,ul,li{
+            margin: 0;
+            padding: 0;
+            list-style: none;
+        }
+        ul {
+            display: flex;
+            justify-content: space-around;
+            height: 45px;
+            align-items: center;
+        }
+    </style>
+</head>
+<body>
+
+    <div class="main">
+        <ul>
+            <li>首页1</li>
+            <li>咨询2</li>
+            <li>军事3</li>
+            <li>首页4</li>
+            <li>咨询5</li>
+            <li>军事6</li>
+            <li>军事7</li>
+            <li>军事8</li>
+            <li>军事9</li>
+        </ul>
+    </div>
+    
+    
+</body>
+</html>
--- a/历届学生/18课程/class18_2/课程/2020-12-14/笔记.txt
+++ b/历届学生/18课程/class18_2/课程/2020-12-14/笔记.txt
@@ -0,0 +1,54 @@
+flex + rem
+
+flex : 布局的自动适配
+
+13个属性
+
+第一个
+
+display: flex 开启弹性盒子
+
+
+应用在父元素 6
+
+justify-content 设置水平方向对齐
+align-items   设置垂直方法对齐
+flex-direction 设置元素的对齐方式（垂直对齐还是水平对齐）
+flex-wrap 设置元素是否换行
+
+不常用
+flex-flow: <flex-direction> || <flex-wrap>;
+align-content  设置多根轴线的对齐方式
+
+
+应用在子元素 6
+order   设置元素的排列位置，数值越小越靠前
+flex-grow 根据设置的比例自动占剩余空间
+flex-shrink 元素开启弹性盒子后，默认数值为1，将压缩元素，我们希望不压缩的时候可以通过这个属性来设置：0
+场景：横向滑动
+flex-basis  设置元素宽度，优先级比width高
+flex: none | [ <'flex-grow'> <'flex-shrink'>? || <'flex-basis'> ]
+align-self  运行某个元素设置不同的对齐方式（垂直方向）
+
+rem ：尺寸的自动适配
+
+设置一个基准值，你写的  尺寸 * 基准值 == 实际的宽高 
+
+10px  --> 10rem
+
+默认16px
+
+盒子模型 预留
+
+自动换行
+
+css3 完成
+
+rem 完成
+
+给你们UI图，教你们切图 完成
+
+带你们写一个psd，剩下的给你们自己写  完成
+
+pc 页面
+