让多个元素在一行显示的方法与技巧
一.使用display:inline;我们可以用display:inline把元素转换为行内元素 但是转为行内元素了他的长度宽度就是它本身内容的长度宽度了 设置属性不起作用 <style> /* 方法一*/ .box1, .box2 { display: inline; width: 200px; height: 2000px;
overflow多个作用
overflow:hidden多个作用1.解决margin-top上外边距塌陷的问题未解决前给父元素添加overflow：hidden； <style> * { padding: 0px; margin: 0px; } .box { width: 300px; height: 300px; bac
多个水平垂直居中的方法总结
文章目录一.行内元素水平居中二.行内元素垂直居中三.块级元素水平居中四.实现水平垂直居中一.行内元素水平居中方法1.text-align:center；代码演示 <style> .parent { background-color: red; text-align: center; height: 40px; } </style></head>
APl DOM文档对象模型
文章目录一.DOM简介一.DOM简介1.什么是DOM文档对象模型(简称DOM) 是W3C组织推荐的处理可扩展标记语言的标准编程接口 W3C已经定义来一系列DOM接口，通过这些DOM接口可以改变网页的内容、结构样式。2.DOM 树文档：一个页面就是一个文档，DOM 中使用 document 表示元素：页面中的所有标签都是元素，DOM 中使用 element 表示...
学习笔记——Vue中兄弟组件之间传值
在vue中，我们在使用不同组件时，可能在同一个页面使用的两个组件具有耦合性，组件之间可能会需要相互传值。以下就是三种兄弟组件之间传值的方法。1.通过父组件传递：// 这里我让Older组件向younger组件传值// 父组件<template> <div> <Older :msg-older="msgFather" @change="change"></Older> <Younger :msg-younger="msgFat.
学习笔记——Vue中的插槽技术
在vue中，我们调用子组件的时候，可能会对子组件的某一部分代码进行修改，使得子组件能更好的满足我们的需求。有了插槽技术，我们就可以在父组件调用时，让子组件中的结构更好的适应当前组件。插槽技术：1.默认插槽(匿名插槽）：该插槽比较笨重，适合简单练连续的插入。template模板中的内容会被插入slot占位符中，如果有多个占位符，都会插入一遍template中的内容。// 父组件<div>这是父组件 <Younger :list="list">...
学习笔记——JS中字符串的常用方法和属性
String是javascript中的一个重要的复杂数据类型。我们在学习的过程中会经常用到，这里我总结了学习过程中常用的一些方法和属性。1.字符串的常用属性：// constructor：展示字符串的构造函数。var str = "hello,world";console.log(str.constructor); // f String() { native code }// length： 字符串的长度。var str = "hello,world";console.log(s.
学习笔记——CSS中的一些公有样式
在CSS中，我们可能会多次重复用到一些样式，我们会将这些样式放在单独的文件夹中，使用时引用即可。这样就大大的提高了代码的复用性，减少了重复代码的出现。1.复位样式：/* 复位 */* { margin: 0; padding: 0;}/* 去除小黑点 */ul { list-style: none;}/* 去除下划线 */a { text-decoration: none;}2.共有样式：// 页面最上面的导航栏.tonglan .
学习笔记——JS中的this指针指向问题
在javascript中，this指针指向问题是一个重要的知识点。在不同情况下，this指针指向的方向也会有所不同。1.函数名直接加小括号调用函数，则this指向全局对象windowvar a = 100;function getA() { var a = 10; console.log(this.a); };getA();2.标签事件绑定的函数被调用时，this指向触发事件的标签// HTML:<button class="button">确.
学习笔记——ES6中Promise对象详解
在ES6中有一个重要的对象Promise，可以被new使用。代表了未来将要发生的事，用来描述异步操作的结果。其函数内部往往会包括异步耗时的代码。1.Promise的基本配置：{ 挂起 成功 失败 status: 'pending | fulfilled | rejected', // status最多只能变化一次 // 状态的改变只有两种可能：pending -> fulfilled, pending -> reje.
学习笔记——轮播图的实现
轮播图是前端开发的一个重要的技术。以下使实现轮播图的三种方法：1.使用纯CSS实现：使用CSS的动画效果实现，能实现无缝轮播图，但无法实现轮播图的点击切换。HTML：<div class="banner w"> <ul class="banner-slider"> <li><a href=""><img src="images/banner-004.jpg" alt=""></a><.
学习笔记——原型对象与原型链
在javascript中的所有变量与U对象，我们都可以认为是直接或间接的new某个函数来创建的。构造函数：被new的函数，称为对象的构造函数。原型对象：构造函数上有一个prototype属性，称为对象的原型对象。所有通过new出来的实例（对象）都会共享原型对象上的方法和属性。例如：var arr = new Array(); // Array()是构造函数, arr是实例（对象）Array.prototype.a = 1; // Array.prototype是原型对象..
学习笔记——react基础功能学习
react框架是当前较为流行的一种框架，它主要用于较为大型的项目。react框架与vue框架类似。以下主要学习了以下vue的指令在react中如何实现。1.react的下载：在命令窗口，下载react脚手架包：yarn global add create-react-app2.创建项目：在命令窗口，输入以下内容创建react项目：create-react-app 项目名3.了解项目：使用webStorm,VS Code或者HBulider 打开你的项目...
学习笔记——react路由配置
react中的路由配置是react项目中一个重要的功能。通过配置好的路由，我们可以实现不同组件的切换，进而实现单页面应用程序。1.书写组件：配置路由之前，我们首先要书写一些需要的页面级组件。我们可以在项目的src目录下新建一个pages文件夹，在文件夹中，再为每个组件新建个文件夹，文件夹中新建index.jsx文件，组件文件夹的名字使用Pascal命名法（首字母大写）,jsx对象全部用index命名。且jsx对象中组件名称与组件文件夹名相同。如下图所示：2.组件导出：然后，...
学习笔记——react公共组件与组件跳转
在react中，除了页面级组件以外，我们有时还需要一些公共的组件，这些组件会被一个或多个页面级组件使用。例如导航组件和控制数量加减的组件。1.组件定义：已知，定义组件有两种方法：一种是类组件，我在学习笔记——react的基础功能中写过。另一中是函数组件。无状态组件：在组件中没有constructor中的this.state的组件，用来呈现数据，没有复杂的业务逻辑和数据获取。无状态组件最好写成函数组件。任何函数，只要这个函数显示的return一个jsx对象，则它就是一个组件，函数组件中..
学习笔记——react的ajax封装使用及设置代理
react实现动态获取数据的重要功能。在react中发送ajax一般使用fetch。并且由于跨域问题，需要设置代理。1.fetch包的安装：在项目文件夹中的命令窗口输入以下代码：yarn add isomorphic-fetch2.封装ajax：在项目的src文件夹下新建一个名为utils的文件夹，在utils中新建http.js文件。并用export default导出封装好的函数，在需要的页面导入使用就会很方便。import fetch from 'isomor..
今日推荐
周排行