前端html css

css实现文字切换

.textc { --num: '今日大吉'; animation: text-change 3s linear forwards; } .textc::after{ content: var(--num); font-size: 20px; } @keyframes text-change { 3 ......
文字 css

【前端】前端部署发布浏览器缓存问题

方法一 代码清楚法 1:每次修改package.json版本号 2:在main.js中配置 const VUE_APP_VERSION = require('../package.json').version const vers = window.localStorage.getItem("app ......
前端 缓存 浏览器 问题

css学习总结

实现开门效果 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Do ......
css

认真学习前端第二天(多益校招笔试复盘)

1.margin塌陷:两者都是正数取最大值;一正一负取正值+负值;两者都是负数取最小(绝对值最大)2.lodash,vue-cli,element-ui,webpack,vite,rollup,babel 3.promise的打印题 4.熬不动了,没有规划好时间,今天只学了半个小时,做了一个半小时的 ......
前端 笔试

前端中字体的使用

前端中字体的使用 字体是前端的基础,本文介绍常见的几种字体以及如何在工程中引入自定义的字体。 字体的类型 常见的字体类型有 TTF/OTF, WOFF/WOFF2, SVG,EOT (这个是按照浏览器的支持率由高到底排序的) TTF(True Type Font) 由微软与苹果开发,广泛用于wind ......
前端 字体

前端学习:python基础-1

False、True、None 1、模块 一个文件为一个模块,跨文件访问需要导入语句的形式 eg: import <模块名> form <模块名> import <代码元素> form <模块名> import <代码元素> as <代码元素别名> 与前端差异: import <模块>/{ 模块中变 ......
前端 基础 python

HTML

HTML 初始HTML HTML Hyper Text Markup Language(超文本标记语言) 超文本包括:文字、图片、音频、视频、动画等 </head> <body> <h3>hello HTML</h3> <img src="../1.jpg"/> <hr/> <video src=" ......
HTML

CSS

CSS 1.什么是CSS 如何学习CSS CSS是什么 CSS怎么用(快速入门) CSS选择器(重点+难点) 美化网页(文字、阴影、超链接、列表、渐变....) 盒子模型 浮动 定位 网页动画(特效效果) 1.1什么是CSS Cascading Style Sheet层叠级联样式表 CSS:表现(美 ......
CSS

使用js开发一个快速打开前端项目的alfred插件

使用js开发一个快速打开前端项目的插件 目录 前言 使用的技术栈 步骤 问题发现 待优化 前言 一直以来开发都是先打开vscode,然后选择项目,在项目多的情况下会觉得挺繁琐;如果同时打开了许多vscode窗口,寻找目标窗口也比较麻烦,于是萌生了开发一个alfred的工作流插件的想法,目标是在alf ......
前端 插件 项目 alfred

前端笔记

JavaScript初始化加载的3种方式_js初始化加载方法_——潇洒走一回——的博客-CSDN博客 <script> //只能有一个 window.onload = function(){ alert("JS初始化加载"); } </script> <script> // 可以有多个但是容易被断开 ......
前端 笔记

html小结002

html基本标签 br hr 文字标签 strong/b 加粗 ins/u下划线 del/s删除线 em/i斜体 img图片标签 src="" 图片路径 相对/绝对 a超链接 1.跳转 2.#回到顶部 3.锚点 4.下载文件(不用)只能压缩文件格式 列表标签 ul li 无序列表 type属性="" ......
小结 html 002

看到过的css 属性!!!

记录一下看到过的,没见过的不知道就算了; inline-size: 60px block-size:30px padding-block:10px 这三个文字属性 和 writing-mode: 有关, writing-mode 设置文字是从左往右排列还是从上往下 关于 nth-child!!! M ......
属性 css

html与css小知识

html 入门学习 参考资料:https://www.cnblogs.com/gh110/p/15153664.html 参考视频:https://www.bilibili.com/video/BV1x4411V75C 扩展: qq 邮箱扩展(点击联系我)可以打开 qq 推广弄 iframe 可以作 ......
知识 html css

微前端启动子应用出现的eslint提示

前言 在管理较大的多人协同开发项目时,为了规范大家的代码书写习惯,我们往往都会用eslint来约束,但这也导致我们在拉项目时以及开发时都增加了不少麻烦,本文着重讲解微服务启动不同子项目时常规报错的解决方式。 步骤一:在package.json将 "lint": "vue-cli-service li ......
前端 eslint

css字体---跨站引入报跨域问题【解决方法】

最近遇到一个问题,考虑到网站的性能,需要将图标字体单独放到一个网站引入,减少资源占用,但是遇到一个问题,引入字体文件的时候,报跨域的错误。 具体解决方法:将图标字体转base64 转换网址:https://transfonter.org/ 按照以下三个步骤进行操作: 然后下周这个: 里面有个:sty ......
字体 方法 问题 css

前端RSA公钥解密

前端加解密使用的jsencrypt包,jsencrypt包中只有公钥加密,私钥解密的方法,但项目中要求前端公钥解密,通过重写jsencrypt包中的方法来实现 /** * 重写JSEncrypt解密方法以支持公钥解密 * */private pkcs1unpad2(d, n) { const b = ......
公钥 前端 RSA

Harmony自定义页面请求与前端页面调试

一、自定义页面请求响应 Web组件支持在应用拦截到页面请求后自定义响应请求能力。开发者通过onInterceptRequest()接口来实现自定义资源请求响应 。自定义请求能力可以用于开发者自定义Web页面响应、自定义文件资源响应等场景。 Web网页上发起资源加载请求,应用层收到资源请求消息。应用层 ......
页面 前端 Harmony

TTS背后的技术原理——前端和后端系统

就解锁了一个温柔又风趣的「女朋友」萨曼萨。不过,在现实生活中,和语音助手谈恋爱还是一件十分遥远的事情——刨去现阶段的语音助手们双商水平还有限,语音助手的语言表达能力还远远达不到我们理想状态。 为啥你的机器人女友说话不像萨曼萨?本文中,Rokid A-Lab 语音合成算法工程师郑杰文将从语音合成技术谈 ......
前端 原理 背后 系统 技术

web前端Tips:断点续传如何实现?

在Web前端中实现断点续传功能的一种常见方式是使用HTTP Range请求和文件分片上传。 以下是一个简单的断点续传实现的步骤: 前端将要上传的文件分成多个固定大小的片段(chunk),例如每个片段的大小为1MB。 当用户选择上传文件时,前端发送一个初始请求到服务器,询问服务器当前已上传的文件大小( ......
断点 前端 Tips web

CSS的选择器

CSS的选择器分为全局选择器、元素选择器、类选择器、ID选择器和合并选择器 1.全局选择器 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=devi ......
CSS

js 前端 时间日期 月份 日期不满10 前面加0

法一: //获取当前日期的yyyy-MM-dd格式var date = new Date();var year = date.getFullYear();var month = date.getMonth() + 1 < 10 ? "0" + (date.getMonth() + 1) : date ......
日期 前端 月份 时间 js

前端代码里面的空格和换行会影响系统的性能吗

在前端代码中,空格和换行通常不会对系统的性能产生显著影响。浏览器在加载和解析代码时会忽略空格和换行,并且对代码进行压缩和优化,以减少文件大小和提高执行效率。 然而,过多的空格和换行可能会增加代码的大小,导致传输时间稍微增加。这对于网络速度较慢的情况下可能会稍微影响加载时间。因此,在部署代码时,建议对 ......
行会 前端 空格 性能 代码

前端代码中注释代码太多会影响系统性能吗

在前端代码中,注释对系统性能的影响非常小,几乎可以忽略不计。注释只是给开发人员提供更好的代码理解和维护的工具,并不会被浏览器加载和解析。在代码执行时,浏览器会忽略注释部分,只执行实际的代码逻辑。因此,无论注释代码多少,对页面的加载和渲染几乎没有影响。 然而,在开发过程中,过多的注释可能会增加代码的长 ......
代码 前端 注释 性能 系统

webstorm生成html骨架的两种方式

方法1 写 doc 然后tab 方法2 写html:5 ,然后按下tab ......
骨架 webstorm 方式 html

JQ 和 CSS 基础点

Html中共有几类标签,区别 内敛标签(行内标签):不独占一行,内敛标签只能嵌套内敛标签 块级标签(行外标签):自己独占一行,可以嵌套内敛标签和某些块级标签 清除浮动的方法 clear: both overflow:hidden; position:absolute 阐述css定位有几种,区别 po ......
基础 CSS JQ

9-web前端 flex弹性布局

1、flex弹性布局 设置方式:给父元素设置 display: flex,子元素可以自动挤压或拉伸 组成部分: 弹性容器 弹性盒子 主轴:默认在水平方向 侧轴 / 交叉轴:默认在垂直方向 例如: 2、主轴对齐方式 属性名:justify-content 属性值 效果 flex-start 默认值,弹 ......
前端 弹性 布局 flex web

8-web前端 动画 案例

1、动画说明 目标:使用animation添加动画效果 思考:过渡可以实现什么效果? 答:实现2个状态间的变化过程 动画效果:实现多个状态间的变化过程,动画过程可控(重复播放、最终画面、是否暂停) 动画的本质是快速切换大量图片时在人脑中形成的具有连续性的画面 构成动画的最小单元: :帧或动画帧 2、 ......
前端 案例 动画 web

7-web前端 空间转换,3D效果

1、认识3D转换 近大远小 近实远虚 物体和面遮挡不可见 2、三维坐标系 x 轴:水平向右 -- 注意:x 轴右边是正值,左边是负值 y 轴:垂直向下 -- 注意:y 轴下面是正值,上面是负值 z 轴:垂直屏幕 -- 注意:往外边的是正值,往里面的是负值 3、3D转换 3D 转换知识要点 3D 位移 ......
前端 效果 空间 web

记录--纯前端如何实现录屏并保存视频到本地

这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助 作为一个资深的切图仔,我们难免会需要用到把自己写的页面的一些功能通过视频的方式分享给别人。还有一个场景,就是当我们面试的时候,我们需要把我们的屏幕分享给面试官看,那么这些都是怎么实 现的呢? 那么接下来我们就通过这篇文章来学习一下如何实现 ......
前端 视频

6-web前端的特效 平面转换transfrom

平面转换 transform 作用:为元素添加动态效果,一般与过渡配合使用 概念:改变盒子在平面内的形态(位移、旋转、缩放、倾斜) 平面转换又叫 2D 转换 1、平面转换 平移 目标:使用translate实现元素位移效果 语法 transform: translate(水平移动距离, 垂直移动距离 ......
前端 transfrom 特效 平面 web