前端
文章平均质量分 77
#free-fly
这个作者很懒,什么都没留下…
展开
-
运行vue项目遇到的问题
一、在进行npm install 安装时出现如下问题Cannot read properties of null (reading 'pickAlgorithm')解决办法:先删除node_modules文件夹,然后清除一下缓存:npm cache clear --force,再次尝试 npm install,如果仍出现此问题,则继续以下步骤使用yarn进行安装npm install -g yarnyarn config set registry https://registry.原创 2022-05-14 09:39:38 · 285 阅读 · 0 评论 -
vue+bootstrap星级评分
封装一个星级打分的组件<template> <div> <div v-for="index in maxValue" :key="index" class="iconfont icon-star star-item star-placeholder" > <div class="iconfont icon-star star-item star-active"原创 2022-05-05 18:55:34 · 877 阅读 · 0 评论 -
vue中使用圆形百分比图形
vue实现环形百分比进度条组件_caffreygo的博客-CSDN博客_vue环形百分比在vue中封装一个可以实现圆形百分比进度条的组件<radial-indicator percentNum="87" //表示的是百分比 speed="3" //动画加载速度 size="155" //整体的圆形大小 color="#8abf50" //进度条的颜色 @animationFinished="animationFinished" //动画转载 2022-05-04 20:32:13 · 2113 阅读 · 0 评论 -
ES6简介
ES6模块化在 ES6 模块化规范诞生之前,JavaScript 社区已经尝试并提出了 AMD、CMD、CommonJS 等模块化规范。但是,这些由社区提出的模块化标准,还是存在一定的差异性与局限性、并不是浏览器与服务器通用的模块化标准,例如:AMD 和 CMD 适用于浏览器端的 Javascript 模块化 CommonJS 适用于服务器端的 Javascript 模块化ES6模块化规范ES6 模块化规范是浏览器端与服务器端通用的模块化开发规范。规范中定义:⚫ 每个 js 文件都是一个原创 2022-04-11 16:06:53 · 124 阅读 · 0 评论 -
WebAPI
一、Web API简介1. Web APIs 和 JS 基础关联性1.1 JS 组成ECMAScript: JS 语法BOM: Web APIDOM: Web API2. API 和 Web API2.1 APIAPI:Application Programming Interface,应用程序接口。2.2 Web APIWeb API 是浏览器提供得一套操作浏览器功能和页面元素得 API(BOM 和 DOM)。二、DOM ...原创 2022-04-11 15:16:03 · 1033 阅读 · 0 评论 -
前端工程化与WebPack
前端工程化前端开发:模块化:js的模块化、css的模块化、其他资源的模块化组件化:复用现有UI结构、样式、行为规范化:目录结构划分、编码规范化、接口规范化、文档规范化、Git分支管理自动化:自动化构建、自动部署、自动化测试前端工程化:在企业级项目开发中,把前端开发所需的工具、技术、流程、经验等进行规范化、标准化。最终实现前端的四个现代化优势:让前端开发能够“自成体系”,覆盖前端项目从创建到部署的方方面面 最大程度提升了开发效率。降低了技术选型、前后端联调等带来的协调沟通成本原创 2022-04-11 15:29:04 · 649 阅读 · 0 评论 -
docker-compose简介及配置
Compose是一个用于定义和运行多容器 Docker 的工具。借助 Compose,您可以使用 YAML 文件来配置应用程序的服务。compose 的诸多优点:在单个主机上建立多个隔离环境,Compose 使用项目名称将环境彼此隔离。您可以在多个不同的上下文中使用此项目名称。默认项目名称是项目目录的基本名称。您可以使用-p 命令行选项或 COMPOSE_PROJECT_NAME 环境变量设置自定义项目名称 。默认项目目录是 Compose 文件的基本目录。可以使用--project-direct.原创 2022-03-24 14:53:23 · 2969 阅读 · 0 评论 -
JavaScript开始
使用var声明的变量,其作用域为该语句所在的函数内,且存在变量提升现象;使用let声明的变量,其作用域为该语句所在的代码块内,不存在变量提升;使用const声明的是常量,在后面出现的代码中不能再修改该常量的值。1. JavaScript历史布兰登艾奇(Brendan Eich, 1961年~)。 神奇的大哥在1995年利用10天完成JavaScript设计。 网景公司最初命名为LiveScript ,后来在与Sun合作之后将其改名为JavaScript.2. JavaScript是什么原创 2022-03-24 14:50:46 · 323 阅读 · 0 评论 -
网站制作注意点
网站favicon图标制作制作favicon图标把图标切片成png图片 把png图片转换为ico图标,借助网站比特虫:制作ico图标 | 在线ico图标转换工具 方便制作favicon.ico - 比特虫 - Bitbug.net 在html页面的<head></head>元素之间引入代码<link rel="shortcut icon" href=" /favicon.ico" />网站TDK三大标签SEO优化SEO(search engine opti原创 2022-03-22 15:22:34 · 68 阅读 · 0 评论 -
HTML5、CSS3
(七)HTML5与CSS3新增特性1. HTML5新特性1.1 HTML5新增语义化标签<header>:头部标签 <nav>:导航标签 <article>:内容标签 <section>:定义文档某个区域 <asider>:侧边栏标签 <footer>:尾部标签1.2 HTML5新增多媒体标签1. 视频 <vedio>所有浏览器支持 mp4 格式。<video src...原创 2022-03-22 15:20:25 · 204 阅读 · 0 评论 -
CSS相关内容(六)
(六)CSS 高级1.1 精灵图一个网页中往往会应用很多小的背景图像作为修饰,当网页中的图像过多时,服务器就会频繁地接收和发送请求图片,造成服务器请求压力过大,这将大大降低页面的加载速度。因此,为了有效地减少服务器接收和发送请求的次数,提高页面的加载速度,出现了 CSS 精灵技术(也称 CSS Sprites. CSS 雪碧)。1.2 精灵图(sprites)的使用精灵图主要针对于背景图片使用,把多个小背景图片整合到一张大图片中去。 移动背景图片位置可以用background—positi原创 2022-03-22 15:15:52 · 232 阅读 · 0 评论 -
CSS相关内容(五)
(五)定位1. 为什么需要定位一些固定盒子的效果,标准流或浮动都无法快速实现,此时需要定位来实现:2. 定位组成定位:将盒子定在某一个位置,所以定位也是在摆放盒子,按照定位的方式移动盒子。定位=定位模式+边偏移。定位模式用于指定一个元素在文档中的定位方式。边偏移决定该元素的最终位置。2.1 定位模式决定元素的定位方式,通过 CSS 的 position 来设置,其值可以分为四个值: 值 语义 static原创 2022-03-22 15:14:54 · 81 阅读 · 0 评论 -
CSS相关内容(四)
(四)CSS 浮动1. 浮动(float)1.1 传统网页布局方式网页布局的本质——用 CSS 来摆放盒子,把盒子放到相应位置。CSS 提供了三种传统布局方式:普通流(标准流) 浮动定位1.2 标准流(普通流/文档流)所谓的标准流,就是标签按照规定好的默认方式排列。块级元素会独占一行,从上到下顺序排列 常用元素:div、hr、p、h1-h6、ul、ol、dl、form、table 行内元素会按照顺序,从左到右顺序排列,碰到父元素边缘则自动换行。 常用元素:...原创 2022-03-22 15:14:06 · 41 阅读 · 0 评论 -
CSS相关知识(三)
(三)盒子模型1. 盒子模型1.1 看透网页本质本质:利用 CSS 摆盒子网页布局过程:准备网页元素,网页元素基本都是盒子 box 利用 CSS 设置好盒子样式,然后摆放到相应位置。 往盒子里放东西。1.2 盒子模型(Box Model)组成CSS 盒子模型本质上是一个盒子,封装周围的 HTML 元素,包括:边框、外边距、内边距和实际内容。1.3 边框(border)border 可以设置元素边框。边框有三个组成:border-width、border...原创 2022-03-22 15:13:10 · 66 阅读 · 0 评论 -
CSS相关知识(二)
(二)CSS 复合选择器与特性1. Emmet 语法快速生成 HTML 结构代码生成标签直接输入标签名按tab键如果想要生成多个相同标签,加上*如果有父子级关系的标签,可以用 >如果有兄弟关系的标签,用+如果生成带有类名或这id名字的,直接写.demo或#two tab即可如果生成的div类名是有顺序的,可以用自增符号$如果想要在生成的标签内部写内容可以用{}表示(2)快速生成 CSS 样式代码2. 复合选择器由基础选择器组合而成。后代选择器...原创 2022-03-22 15:11:10 · 1914 阅读 · 0 评论 -
CSS相关知识(一)
(一)CSS 简介与基础选择器1. CSS 简介1.1 HTML 的局限性HTML 是网友的骨架,只关注内容的语义。例如<h1>表示大标题,<p>表示段落。早期的时候,HTML 只能做一些简单的样式,网页非常丑,而且使 HTML 代码臃肿。1.2 CSS-网页的美容师CSS是层叠样式表(Cascading Style Sheets)的简称,是一种标记语言。CSS 主要用于设置 HTML 页面中的文本内容(字体、大小、对齐方式)、图片的外形(宽高、边框样..原创 2022-03-22 15:09:11 · 68 阅读 · 0 评论 -
HTML相关知识(二)
(二)HTML 标签(上)1. HTML 语法规范1.1 基本语法规范HTML 标签是由尖括号包围的关键词,例如<html>。 HTML 标签通常是成对出现的,例如<html>和<html/>,称为双标签。第一个是开始标签,第二个是结束标签。 有些特殊标签必须是单个标签(极少情况),例如<br/>,我们称之为单标签。1.2 标签关系标签关系可以分为两类:包含关系和并列关系2. HTML 基本结构标签每个网页都会有一个基本的结构标签原创 2022-03-22 15:07:22 · 202 阅读 · 0 评论 -
HTML相关知识(一)
(一)HTML简介1. 网页1.1 什么是网页网页是根据因特网上一定的规则,使用html等制作的用于展示特定内容的网页集合。网页是构成网站的基本元素。网页是图片、链接、文字、声音、视频等源深路组成,其实就是一个html文件。1.2 什么是HTMLHTML指的是超文本标记语言(Hyper Text Markup Language),它是用来描述网页的一种语言。HTML不是一种编程语言,而是一种标记语言(markup language)。 标记语言是一套标记标签(markup t原创 2022-03-22 15:03:08 · 144 阅读 · 0 评论