first commit

历届学生/front-end-team-10/项目练习/学生项目/薛涛/笔记.txt

@@ -0,0 +1,114 @@
+ box-shadow 盒子阴影模糊度
+ z-index  调整元素z轴的浮动层级 取值无范围，数值越大，越靠前
+           如果都没设置z-index，或者 z-index 都一样，那么按照顺序来堆叠，越靠后，堆的越高
+ 
+ margin:0 auto 块标签内部中还有一个块标签文本居中
+ ！important 重要的 提升css属性的优先级运行
+
+     伪类选择器：
+       ：hover 当鼠标悬浮时 
+       ：before 在每个元素之前插入内容
+         ：after 在每个元素之后插入内容  
+       ：nth-child 传入表达式选择
+       ：first-child 选择第一个
+       ；last-child 选择第最后一个
+
+    组合写法：
+    选择器1 选择器2: 选择 标签1 中 的 标签2 无视层级 简写：嵌套关系
+    选择器1 > 选择器2: 选择 父标签为1 中 的 2标签  简写：嵌套关系 
+    选择器1,选择器2: 同时选中 标签1和2
+    选择器1+选择器2: 选中同级 紧跟在 标签1 后面 的标签2
+
+    css 属性名：
+     字体：font-size 设置字体大小    font-width 设置字体加粗（bold最粗）  
+     颜色：color 设置颜色
+
+   标签内部文本居中：
+                   text-align ：center 水平方向居中 文字在父元素的宽度内部居中  
+                   line-height  水平方向居中垂直居中  数值和父元素的高度一样
+                                注意：只针对单行文字   父元素内部子元素的居中方式
+
+                   margin:0 auto 块标签内部中还有一个块标签文本居中
+  
+                                
+           vertical-align 垂直居中
+
+
+     设置背景图background：background-repeat 重复(no-repeat 不重复)    background-position 设置背景图定位    
+                          background-size cover 图片大小宽高不合适的时候使用
+
+             letter-spacing 字符之间的间距（x轴）
+     display:可以隐藏显示元素，将块 和 行 进行转换
+            inline -block 转换为 行 内 块标签   同时具有行标签 放在一行的特性，还具有块标签可以设置宽高的特性
+            none 隐藏元素
+
+ 盒子模型：
+   内边距(padding)  外边距(margin) 边框(border) 内容(center)   
+       padding 和 margin 写法一样
+
+         padding 会让元素变大
+         宽=左右边距 高=上下边距
+
+         solid 实线边框
+           
+       margin: 10px;  /** 同时对 上右下左 四个方向设置一样的数值**/
+       margin: 10px 20px; /** 同时对 上下 左右 设置数值 **/
+       margin: 10px 20px 30px; /** 对 上 左右  下  设置数值 **/
+       margin: 10px 20px 30px 40px; /** 上  右  下 左 **/
+ 
+ 盒子模型的计算规则：
+    标准盒子模型：
+
+     元素真实宽高 = 你写的宽高（content宽高） + padding & border
+
+     在你写的宽高 基础上向外拓张
+
+   怪异盒子模型 box-sizing: border-box;   ：
+
+     content 宽高 = 你写的宽高（元素真实宽高） - padding & border
+
+     在你写的宽高 基础上向内缩减
+   
+
+  浮动：
+       注意：
+    浮动会让元素从原本的位置删除（文档流中删除），下面的元素会钻下去
+
+    如何解决：
+
+      1：clear: both;  加在受影响的那个元素上
+      2：手动加高度 
+      3：overflow: hidden;   
+
+  float: left  right
+     
+     border-radius 设置圆角(100%变成圆)
+   
+
+定位 position；
+    相对定位：relative     绝对定位：absolute   固定定位：fixed
+
+     z-index  调整元素z轴的浮动层级 取值无范围，数值越大，越靠前
+           如果都没设置z-index，或者 z-index 都一样，那么按照顺序来堆叠，越靠后，堆的越高  
+
+          
+   垂直方向居中：top: 50%;
+               transform: translateY(-50%);
+
+
+  json 就是数组和对象的各种组合
+    // JSON.stringify 把对象或者数组转 string
+    // JSON.parse 把string 格式的对象，数组，转为对象数组
+
+
+    
+     
+Vue
+
+    为什么组件内部的data必须是一个方法？？
+    答：因为组件会多次被使用，如果不是方法的话那么组件内部的变量 会被上一次使用污染
+        如果定义一个方法 每次调用的都是全新的值 不会产生变量之间的相互污染
+     
+
+
+