前端学习笔记
文章平均质量分 70
大牧师
这个作者很懒,什么都没留下…
展开
-
利用vue-element-admin中的pdf功能导出博客(倔金)文章
利用vue-element-admin中的导出pdf功能导出博客文章(以pdf的格式),例如倔金、csdn的博客文章等等,保留文章原有的格式。原创 2022-11-24 06:37:51 · 464 阅读 · 1 评论 -
uniapp基础介绍
uni-app基础介绍原创 2022-11-22 06:52:22 · 3256 阅读 · 0 评论 -
npm安装有@符号的依赖包提示:源文本中存在无法识别的标记
安装有@符号的安装包时,需要把有@安装包用单引号或双引号括起来,eg:原创 2021-07-10 17:24:21 · 1085 阅读 · 0 评论 -
不定高垂直居中的三种方法
不定高垂直居中(核心代码)1.display:table-cell + vertical-align:middle父元素(.parent)设置display:table-cell 变成单元格,再设置vertical-align:middle (改属性可以作用于inline inline-block table何table-cell 元素)该布局的优缺点:优点:兼容性比较好(虽然tabl...原创 2019-01-05 16:09:22 · 2405 阅读 · 0 评论 -
web移动端rem的适配
**需求: 随着移动端设备的变化,内容也跟着变化。**先来说说rem单位,以rem为单位,其大小是根据根元素(html标签)的字体大小来判断的, 如 html的font-size:100px; 子元素div 的width:2em; 等同于width:200px;(100 * 2),这就来思路了: 先以一个固定适配的htm...原创 2019-05-20 17:06:07 · 1562 阅读 · 4 评论 -
css,js文件内联还是外部文件引入?
先说说内联与外部文件引入的优缺点:内联: 优点:减少http的请求 缺点:代码不可复用,和后期代码维护不利外联: 优点:代码可复用和有利代码后期维护。 缺点:增加http的请求。建议:对首次需要加载的文件使用内联,eg:首页对非首页加载可以使用外联。...原创 2019-05-21 01:53:10 · 375 阅读 · 0 评论 -
终端检测(检测用户浏览你网页时用电脑还是手机)
终端检测:检测你浏览该网页时用电脑还是手机实则是利用window中的navigator中的userAgent属性来检测我们来打印看看:结果我们来试试移动端换个ipad试试换个android试试这样思路就出来了:我们可以利用正则判断是否含有字符串:Android iphone ipad ipod 来判断用户用的是什么设备(电脑还是手机)。 看下面完整代码这是个简单的检测...原创 2019-05-24 16:39:58 · 1374 阅读 · 0 评论 -
browsersync工具的简单使用
browsersync工具可以自动刷新浏览器,就不用自己F5刷新了,还可以多设备进行调试。1.当然先安装(node.js的安装)(推荐使用cnpm 快)npm i -g browser-sync2.后再命令行进入的项目的文件夹 输入命令:browser-sync start --server --files="*" 下面介绍一个简单的用命令行进入文件夹: &nb...原创 2019-05-24 17:59:16 · 1117 阅读 · 0 评论 -
左边定宽,右边自适应布局的五种方法
需求:左右布局,左边定100px,右边自适应,中间20px间隙下面为核心代码1. float + margin效果如下:这布局结构简单易写,缺点是支持 ie7及以上的浏览器,ie6下会出现3px的问题,解决此问题请看第2中布局 。2.float + margin + (fix)效果如下:此布局支持所有的浏览器,缺点是html结构多了点。3. float + overf...原创 2019-06-10 23:38:38 · 2188 阅读 · 0 评论 -
页面水平居中布局
个人的学习笔记一.水平居中布局(核心代码,四种方式)1.display:flex + justify-content:center || margin:0 auto.parent宽是不固定的类名为.child的div是display:block 默认与父元素同宽,父元素设置了display:flex后,子元素(.child)就变成了flex-item默认的宽是会根据内容的宽,父级元素再...原创 2019-01-05 12:00:15 · 466 阅读 · 0 评论 -
垂直水平居中的3种方法
垂直水平居中这篇文章结合了 垂直居中和水平居中来进行设置 垂直水平居中,单独垂直居中和水平居中可以看我之前的文章1.display:inline-block text-align:center (水平居中) + display:table-cell vertical-align:middle(垂直居中)2.absolute + transform3.display:flex + ...原创 2019-01-05 16:47:35 · 360 阅读 · 0 评论 -
黑马学习vue.js第六天
Vue.js - day6注意:有时候使用npm i node-sass -D装不上,这时候,就必须使用 cnpm i node-sass -D在普通页面中使用render函数渲染组件在webpack中配置.vue组件页面的解析运行cnpm i vue -S将vue安装为运行依赖;运行cnpm i vue-loader vue-template-compiler -D将解析转换...原创 2019-02-15 18:44:36 · 117 阅读 · 1 评论 -
手机上调试 webpack如何设置与操作
1.先要电脑和手机同在一个局域网(如同连一个wifi)2.后在电脑上打开cmd 输入 ipconfig 指令按确定,会出现如下情况:3.找到你的“无线局域网适配器…” 中的IPv4 的地址的(我的是:192.168.0.121)4.后在package.json 文件中的 ‘dev’ 中 添加 –host 你的IPv4地址 我的如下(前面是我的webpack配置):5.后在电脑上重新打开...原创 2019-02-22 10:42:12 · 1181 阅读 · 0 评论 -
vue 子组件向父组件传值
个人笔记 看不懂勿喷核心代码子组中写:this.$emit(‘自定函数名’, 子组要传数据)父组中写:引子组标签中上写: @自定函数名 = ‘父组自定函数名’父组自定函数名(子组传数据形参){this.父属 = 子组传数据形参}...原创 2019-02-27 17:57:20 · 246 阅读 · 1 评论 -
vue零散总结
1. 标签上写v-for ,该标签也会被遍历出来。2. 承载vue 实例的script 标签上的src 属性没值 会报错3.v-enter 是进来之前的动画,v-leave-to 是出去之后的动画。eg: 轮播图的切换, 第一张图出去的动画是由 v-leave-to 来决定的,第二张图进来的 动画是由 v-enter 来决定的4.touch事件其中的一种方法(e为...原创 2019-02-28 10:55:05 · 131 阅读 · 0 评论 -
黑马学习vue.js第一天笔记
Vue.js - Day1课程介绍前5天: 都在学习Vue基本的语法和概念;打包工具 Webpack , Gulp后5天: 以项目驱动教学;什么是Vue.jsVue.js 是目前最火的一个前端框架,React是最流行的一个前端框架(React除了开发网站,还可以开发手机App, Vue语法也是可以用于进行手机App开发的,需要借助于Weex)Vue.js 是前端的主流框...原创 2019-02-21 09:16:31 · 118 阅读 · 1 评论 -
黑马vue.js 学习第二天笔记
Vue.js - Day2品牌管理案例添加新品牌删除品牌根据条件筛选品牌1.x 版本中的filterBy指令,在2.x中已经被废除:filterBy - 指令<tr v-for="item in list | filterBy searchName in 'name'"> <td>{{item.id}}</td&a原创 2019-02-21 09:23:33 · 89 阅读 · 1 评论 -
黑马vue.js学习第三天笔记
Vue.js - Day3定义Vue组件什么是组件: 组件的出现,就是为了拆分Vue实例的代码量的,能够让我们以不同的组件,来划分不同的功能模块,将来我们需要什么样的功能,就可以去调用对应的组件即可;组件化和模块化的不同:模块化: 是从代码逻辑的角度进行划分的;方便代码分层开发,保证每个功能模块的职能单一;组件化: 是从UI界面的角度进行划分的;前端的组件化,方便UI组件的重用;全...原创 2019-02-21 09:40:13 · 100 阅读 · 1 评论 -
黑马vue.js学习第四天笔记
Vue.js - Day4父组件向子组件传值组件实例定义方式,注意:一定要使用props属性来定义父组件传递过来的数据<script> // 创建 Vue 实例,得到 ViewModel var vm = new Vue({ el: '#app', data: { msg: '这是父组件中的消息' }, ...原创 2019-02-21 09:41:41 · 101 阅读 · 1 评论 -
原生ajax封装与jq的ajax的使用
下面是GET 请求方式:原创 2019-03-06 11:31:57 · 298 阅读 · 0 评论 -
黑马学习vue.js 第五天笔记
Vue.js - Day5 - Webpack在网页中会引用哪些常见的静态资源?JS.js .jsx .coffee .ts(TypeScript 类 C# 语言)CSS.css .less .sass .scssImages.jpg .png .gif .bmp .svg字体文件(Fonts).svg .ttf ...原创 2019-02-15 18:41:13 · 97 阅读 · 1 评论