l15655495902的博客

原创 代理服务器

原创 路由动态传参！（面试题必杀）

路由传参

原创 嵌 套 路 由 ！

嵌套路由

原创 全局引入组件与局部引入组件

本文简单介绍了组件的两种引入方式

原创 保姆级手写vue-router路由配置步骤

简单明了的router配置步骤

原创 自定义指令、具名卡槽的使用与演示

当然，里面掺杂了一点v-model、.sync修饰符

原创 Vue父子组件通信

2.子组件通过$emit()向父组件传递数据或事件，如在子组件中自定义事件changeMessage,携带信息'bye’, 然后在父组件中通过v-on监听这个事件。1.父组件通过props向子组件传递数据（在子组件中用props接收）

原创 Vue脚手架

打开想要建脚手架的文件夹，把文件夹的地址改为cmd打开终端输入以下代码1、执行安装脚手架2、安装完成后，可以使用3、我们测试下，在桌面创建一个项目，先执行cd Desktop进入桌面，然后执行然后选择第二个，因为我们目前学习的是 vue2出现以下代码说明安装成功。

原创 computed计算属性与watch侦听器

事件.stop 阻止事件冒泡（由于事件冒泡的机制，我们给元素绑定点击事件的时候，也会触发父级的点击事件）@事件.prevent 阻止事件默认（例如：当点击提交按钮时阻止对表单的提交。相当于调用了event.preventDefault()方法）@事件.capture 触发事件捕获（添加事件侦听器时使用事件捕获模式）@事件.self 当事件在该元素本身触发回调@once 只执行一次（绑定了事件以后只能触发一次，第二次就不会触发）

原创 学vue必须熟练的语法与常用指令！！！

（1）作用：当需要将一个数组遍历或枚举一个对象循环显示时候，我常用的就是列表渲染指令v-for ，它需要结合着in 或者of来使用。（2）语法： v-bind:href="xxx" 或简写 :href="xxx" （例.导入图片）（2）语法：v-on:事件="操作" 或者简写 @事件="操作" （引入click事件）2.条件渲染指令（v-show、v-if 、v-else 、 v-else-if）（2）语法： v-id="表达式” （判断age为多少时显示的内容）

原创 背景的设置、渐变和雪碧图

（1）circle圆形，ellipse椭圆，1 将多个图片整合为一张图片里，浏览器只需要发送一次请求，可以同时加载多个图片，2 将多个图片整合为一张图片，减小了图片的总大小，提高请求的速度，增加了用户体验。参数1:表示方位，（可选值，不写默认是to bottom）渐变：通过渐变可以设置一些复杂的背景颜色，可以从实现一个颜色向其他颜色过渡的效果。默认情况下，圆心是根据元素的形状来计算的。border-box 默认值，背景颜色会出现在边框的下边。可以写多个颜色，默认情况下，颜色是均分占比的。

原创 css的浮动及高度塌陷

子元素会脱离文档流，就不能再撑开父元素的高度，从而导致父元素的高度丢失，导致页面布局的混乱。当开启元素的BFC以后，元素会变成一个独立的布局区域，不会在布局上影响到外面的元素。一般情况，我们的父元素是不设置高度的，让其被内容自动撑开，如果子元素设置浮动了，可以通过after伪类向父元素的最后添加一个空白的块元素，然后对其清除浮动，元素也会脱离文档流，虽然可以撑开父元素，但是会导致父元素的宽度丢失。可以直接在高度塌陷的父元素的最后，添加一个块元素（div），方案一：给父元素设置固定高度,但不推荐使用。

原创 浮动的特点

e：如果浮动的元素上一个兄弟元素没有浮动，浮动元素也不会跑上去。当浮动元素元素碰到了文字，浮动元素不会盖住文字，而文字会环绕在浮动元素。它原来在文档流中位置，就没有了，后面的元素就会跑上去，顶上。b:元素设置浮动，会尽可能的向页面的左上或者右上进行浮动。1:浮动过后的行内元素更像行内块元素,默认宽度为内容的宽度，可以设置宽高。1、浮动概念：是一种布局方式，可以让元素脱离文档流，一旦元素脱离文档流。a:一旦元素设置了浮动，元素就会脱离文档流，当元素设置浮动以后，会完全脱离文档流，元素的一些特点也会发生改变。

原创 盒子模型布局

2:这7个值中width，margin-left，margin-right，这三个值可以设置auto。如果有设置auto，则浏览器会自动调整auto的值，以使等式成立。如果父子元素的垂直外边距相邻了，则子元素的外边距会传递给父元素,从而影响页面的布局。border-radius 后跟多个值，4个，3个，2个，1个。第二个值：垂直偏移量 正->下 负->上。5:如果将两个外边距设为auto，宽度固定，则两侧外边距会设置为相同的值。默认情况下，父元素的高度是被内容撑开的，如果设置了，设置多少就是多少。

原创 盒子模型基础内容

所对应的元素的特点自然也就没有，块元素也不会独占一行了，行内元素也可以设置宽高了，网页是一个多层的结构,设置样式样式，也是一层一层的设置，最终我们看到的最上面的一层。把各种元素布局到页面，就像想买个桌子，放到家里，要知道桌子的大小，形状，然后才能放到家里。盒子模型：就是将页面所有的元素都统一设置为一个个盒子，一个个矩形，在布局时，就不用考虑。边框属于盒子边缘，边框里面属于盒子内部，出了边框都是盒子的外部。（1）margin-top 正值，盒子是向下移动，负值，盒子是向上移动。边框 （border）

原创 css字体样式

父元素或者祖先元素的字体大小，直到继承根标签（html）的字体大小,如果根标签没有设置字体大小，也是个相对单位，它是相对于根标签（html）标签的字体大小变化而变化,如果根标签没有设置字体大小，也是个相对单位，它相对于自身字体大小的变化而变化，如果自身没有设置字体大小，就会继承其。其实就是一个个发光的小点，肉眼是看不到的，这也是我们现阶段最常用的单位。分别以红色，绿色，蓝色三种颜色为基本色，根据不同的浓度值来勾兑出不同的颜色。获取颜色：来到截屏的模式，将鼠标箭头对准你要的颜色，然后进行提取即可，

原创 表格、表单的属性

并且将所有的tr都放到tbody中，所以注意tr并不是table的子元素，而是tbody的子元素。指向的是一个服务器的地址，当我们提交表单时将会表单相关的数据提交到action属性对应的地址。- value属性必须设置，这样被选中的表单项的value属性值将会最终提交给服务器。表格在日常生活中使用的非常的多，比如excel就是专门用来创建表格的工具，2、在table标签中使用tr来表示表格中的一行，有几行就有几个tr。这时就需要将表格分为三个部分，表头，表格的主体，表格底部。

原创 css样式及基本选择器

网页实际上是一个多层的结构，通过css可以分别为网页的每一层来设置样式而最终我们能看到的只有最上边的一层。[属性名^=属性值]{} 选择属性值以指定值开头的元素。在html文件外新建一个.css文件，在css文件通过选择器选中对应的结构，设置相关的样式。[属性名=属性值]{} 选择含有指定属性和属性值的元素。[属性名$=属性值]{} 选择属性值以指定值结尾的元素。[属性名*=属性值]{} 选择属性值含有某值的元素。color:red;html和css是两种不同的语言，所以有不同的书写位置，也有不同的语法。

原创 html基本属性简概

1.什么是实体：在浏览器中，有一些特殊的符号，浏览器提前征用，程序员不可以直接去使用，浏览器是不识别的，如果非要用，程序员需要用另外的一些字符去替代，我们管这些另外的字符就叫做实体。作用：也可以帮助seo部门做推广，语义作用的重要性仅次于title标签，而且h1-h6语义是逐步降低的，h1语义最重，一般情况下，一个页面只有一个h1，常用h1-h3。常用块元素：h1~h6，p，div，header，main，footer，nav...3.一般情况下，我们强调时，这两个标签都用，不做特别的细分。

原创 盒子水平布局

width与margin-left/width和margin-right同时设置auto值时，对于部分有width吸收，margin-left/margin-right没有值。总结：当设置了auto就将多余的部分给它，注意能设置auto值的属性：width，margin-left，margin-right。margin-left和margin-right同时设置为auto时，多余部分平分给左右外边距=》块元素的水平居中。当小于父元素的width时，多余的部分给margin-right吸收。

原创 盒子模型.边框

一.盒子模型的组成部分二.盒子模型的理解： 组成部分及各自含义三.边框，圆形.三角形做法四.显示与隐藏

原创 文字样式.下划线设置

设置文字默认一行显示（white-space）文本溢出的样式text-overflow。font：文字简写的时候记得一定要写文字字体、文字大小，并且这二个属性值在后面二个,除了字体颜色,：设置单词与单词之间的距离。:设置字体之间的距离。a{text-decoration：nome}设置文本是否上中下划线。ul>li*4=>在ul里面生成四个子代li。9. 设置文字与图片对齐方式：vertical-align。li*4>a=>在li里面生成一个子代a。text-align ：设置文本的对齐方式。

原创 伪类选择器与字体样式

4. font-family:设置文字字体，用户电脑上有该字体，才会有效，所以一般在后面都要添加一个网页字体五大类中的一种。alpha:设置元素不透明度 取值0~1,0代表全透明，1代表不透明。rgb(red,green,blue)=>取值是0~255。100~300一般都是代表极细。0 0 1 0 =有多少个class选择器。并集：选择器选中的是不同标签，不需要比较优先级，多个用,隔开。0 0 0 0=*、继承、兄弟选择器等。0 0 0 1 =，有多少个标签选择器。0 1 0 0 =有多少个id选择器。

原创 css的选择器

在选择器1中反着选中第num个元素，并且该元素与选择器2中的元素相同。在元素1中反着选中所有的同级别的元素2，再找第一个出现的元素2。在选择器1中选中第num个元素，并且该元素与选择器2中的元素相同。：在元素1中选中所有的同级别的元素2，再找第一个出现的元素2。3. 元素1+元素2：选中元素1后面第一个相邻的兄弟元素。:在元素1中选择第一个元素，并且该元素与元素2相同。在选择器中选择最后一个元素，并且该元素与选择器2相同。元素1~元素2：选中元素1后所有的兄弟元素。： 选择标签1中的子代标签2。

原创 css基础

写法：网页引入外部样式表，外部创建一个css文件，在html中连接这个css文件一般写在css前面。方法二：在style标签内同@import导入css文件（导入式）方法一：在head标签内通过link标签引入(链接式）内部引入：在head标签内部通过style标签值设置。写法：在网页元素上通过style=""属性。写法：在网页创建镶入的的样式表，写在里面。减少网页代码量，增加网页的浏览速度。内联：标签内部通过style来设置。二.css文件：文件名css。选择器：选中要设置样式的标签。

原创 html.4

target：设置跳转页面的显示位置， _blank(新的窗口)，self(本来的窗口，也是默认值)autocomplete：设置是否自动填充，on(自动填充)，off(取消自动填充)，注意要写name并且赋值。get：是将表单数据在action的url里面传输，数据会在跳转页面的地址栏的？date：日期，可以通过value设置默认日期，格式value="2000-01-01"file：长传文件，默认只能长传一个，可以通过multiple设置一次可以选多个。method：设置表单数据提交的方式，

原创 html基础

设置边框与边框之间的距离，与cellspacing是一样的效果。base64：将图片使用base64编码，图片转换成字符，通过字符形式来引入，需要和网页一起加载的图片才会使用base64。webp：谷歌推出专门用来表示网页的一种格式，具备其他格式的所有优点，文件格式小，但是兼容性不好。PNG：支持颜色多，支持复杂透明，但不支持动图，用来显示颜色复杂的透明图片，多用于网页。JPEG：支持的颜色表较多，图片可以压缩，但是不支持透明，保存照片等颜色丰富的图片。属性： frameborder：设置内联框架的边框。