前端css
css基础样式
CSS简介 CSS全称层叠样式表(Cascading Style Sheets) CSS也是一种标记语言,用于给HTML结构设置样式,例如文字大小、颜色元素宽高效果等等 核心思想:HTML搭建结构,CSS添加样式,实现结构与样式的分离 CSS行内样式 行内样式又称内联样式 直接在标签内通过style ......
前端学习-JavaScript学习-JavaScript高级程序设计-第2章笔记
在HTML中使用JavaScript元素 <script>元素 元素属性 MDN <script>:脚本元素 属性 使用状态 描述 charset 可选、少用 字符集 defer 可选、少用 表示脚本可以延迟至文档完全被解析后实行,部分浏览器不支持 language 废弃 编写代码使用的语言 src ......
VUE 前端读取excel表格内容
<el-upload class="upload-demo" :action="''" :show-file-list="false" :auto-upload="false" :before-upload="beforeUpload" :on-success="handleSuccess" :on ......
【万字长文】前端性能优化实践
从一个假死页面引发的思考: 作为前端开发,除了要攻克页面难点,也要有更深的自我目标,性能优化是自我提升中很重要的一环; 在前端开发中,会偶遇到页面假死的现象, 是因为当js有大量计算时,会造成 UI 阻塞,出现界面卡顿、掉帧等情况,严重时会出现页面卡死的情况; ......
轻量级前端架构之:小程序技术
无生态,不平台。
全球人口红利瓶颈,大流量App的建设到了需要深耕流量的阶段,单纯靠自研提供业务的软件支撑,并不能留住日益多元化选择的用户,生态是深耕用户,吸引更多忠诚用户的关键。 ......
2、后端开发中、返回给前端的是时间类数据,应如何设置?
场景: 返回给前端的数据是时间格式的数据,前端界面显示格式如"2000-08-17" 或者"2000-08-17 09:44:36" 使用注解@JsonFormat @JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss") private LocalDateTime ......
成品直播源码推荐,原生button按钮css去掉默认样式
成品直播源码推荐,原生button按钮css去掉默认样式 button{border: none;margin: 0;padding: 0;outline: none;border-radius: 0;line-height: normal;}button::after { border: none ......
前端学习-JavaScrip学习-cookie
在使用Microsoft edge的时候,运行以下代码会报兼容性错误,但是一直没解决 'content-type' header charset value should be 'utf-8'. 使用chrome不会存储cookie 也没有报错 使用火狐可以成功存储cookie <!DOCTYPE ......
推荐一个前端读取CSV文件的插件Papa Parse
Papa Parse点击跳转到官网,该插件可以将文件解析成2层数组。 下面是vue项目引用的方法 1.安装 npm install vue-papa-parse 2.引入,在main.js里 import Vue from 'vue' import VuePapaParse from 'vue-pa ......
磨练前端技能的 10 大网站
1. Javascript 30 JavaScript 30 是由流行的 Web 开发人员和教育家 Wes Bos 创建的网站,它提供免费的 30 天挑战,帮助人们提高他们的 JavaScript 技能。该挑战赛由 30 个短视频教程组成,每个教程都专注于 JavaScript 的不同方面。教程的范 ......
CSS 也能实现 if 判断?实现动态高度下的不同样式展现
最近在群里,有个小伙伴问了这么一道很有趣的问题: CSS 能否实现,容器再某个高度下是某种表现,一旦超出某个高度,则额外展示另外一些内容 为了简化实际效果,我们看这么一张示意效果图: 可以看到,当容器高度没有超过某一个值时,没有箭头图标。反之,箭头图标出现。 这个效果在很多场景都会出现,可以算是一个 ......
前端禁用复制
//禁用复制 disableTextSelection: function () { // 给特定的元素添加自定义属性 $("body").attr("oncontextmenu", "window.event.returnValue=false"); //禁用了鼠标右键点击时的上下文菜单。 $(" ......
使用scoped后,父组件的样式将不会渗透到子组件中。 不过一个子组件的根节点会同时受其父组件的scoped css和子组件的scoped css的影响。
下列关于scoped的描述错误的是( ) A scoped原理是在标签上添加data-v属性,然后使用属性选择器实现样式局部化 B 使用scoped,父组件的样式会渗透到子组件内部的元素 C 使用scoped不会造成全局污染 D ">"可以实现样式穿透 正确答案:B 使用scoped后,父组件的样式 ......
记录--让我们来深入了解一下前端“三清”是什么
这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助 前端“三清” 在前端开发中,我们经常听到关于“三清”的说法,即 window、document、Object。这三者分别代表了 BOM(浏览器对象模型)、DOM(文档对象模型)以及 JS 的顶层对象。在这个体系中,我们通过 JavaScr ......
前端大文件上传优化方案——分片上传
介绍前端上传大文件的常见问题和解决方案,分片上传 这样可以避免一次性上传大文件导致的网络超时、内存溢出、进度不可控等问题。 要实现大文件分片上传,通常需要以下几个步骤: 1.通过DOM获取文件对象,并且对文件进行MD5加密(文件内容+文件标题形式),采用SparkMD5进行文件加密; 2.进行分片设 ......
node+express服务给前端提供markdown数据,前端渲染md文件在页面上
本文介绍后端怎么把markdown文件发给前端,前端又怎么渲染在页面中。 先看效果图 md文件代码: 前端网页渲染: 先介绍node+express怎么提供接口: const express = require("express"); const router = express.Router(); ......
轻量前端框架能否与小程序结合应用?
前端框架一般指用于简化网页设计的框架,使用广泛的前端开发套件,比如,jquery,extjs,bootstrap等等,这些框架封装了一些功能,比如html文档操作,漂亮的各种控件(按钮,表单等等),使用前端框架可以帮助快速地搭建网站。 框架是提供一套完整的解决方案,按照规定好的代码结构来做编排,使用 ......
优秀的前端工具FinClip Studio 有哪些值得期待的价值点?
现今,移动应用程序已成为一项重要的技术,人们几乎在所有方面都使用移动应用程序,包括社交媒体、电子商务、娱乐、健康和生产力等领域。用户对移动应用程序的体验和功能需求越来越高,这意味着开发人员需要花费更多的时间和精力来确保应用程序的质量和用户体验。幸运的是,现在有许多可用的移动应用程序开发平台和资源,这 ......
什么是前端应用开发的 LCP(Largest Contentful Paint) 指标
在网页性能优化的领域里,LCP(Largest Contentful Paint,最大内容绘制)是一个非常重要的性能指标。它测量的是从页面开始加载到页面的 "主要内容 " 完全呈现在屏幕上所需的时间。换句话说,LCP 是测量用户何时看到页面的 "主要内容 " 的指标。 在理解 LCP 之前,我们需要 ......
前端建立WebSocket连接
Web Sockets是H5提供的在web应用程序中客户端与服务器端之间进行的非HTTP的通信机制。 当服务器想向客户端发送数据时,可以立即将数据推送到客户端的浏览器中,无需重新建立连接。只要客户端有一个被打开的socket(套接字)并且与服务器建立了连接,服务器就可以把数据推送到这个socket上 ......
webpack文档打包html,css,js文件
先用npm init -y,快速生成package.json文件,package-lock.json文件是用来固化依赖包的版本的,导入包后会自行生成,提交给他人项目时,只需要给这两个配置文件,然后输入npm i,即可自动下载依赖。 新建一个webpack.config.js配置文件,以下是配置文件的 ......
黑马pink css5
css有三大特性:层叠性,继承性,优先级。 层叠(覆盖)性:解决冲突 就近原则 恰当地使用继承可以简化代码,降低css的复杂性 行高的继承:font:12px/1.5 1.5表示当前文字大小的1.5倍 body行高1.5,这样写法的最大优势就是里面子元素可以根据自己文字大小自动调整行高 优先级 继承 ......
微信小程序canvas 设置旋转css 不生效
问题 项目中有使用canvas 生成条码(一维码)的功能,使用的插件wxbarcode来生成的,但是项目需求的条码是要竖向的,插件的生成的是横向的,不知道是否有参数去控制,当时图省事想着直接用css 旋转一下好了,在模拟器上看到的确实也没有问题,但是在真机上就出问题,没有旋转,还发生了偏移 解决 开 ......
黑马pink css4
snipaste 将截图固定在桌面上-快捷键F3 在截图上点击后按alt键可以得到其RGB 让文字垂直居中的技巧是:盒子的行高height等于文本的行高line-height css背景:背景颜色,背景图片,背景平铺,背景图片位置,背景图片固定 background-repeat:是否重复平铺 背景 ......
css3 弹性盒子
flex属性详解 juejin.cn溪阳 网页布局 最早的时候,网页排版通常是通过 table 元素实现的,在 table 的单元格里使用 align、valign 来实现水平和垂直方向的对齐 后来随着 html 语义化 和 CSS 的发展,浮动布局和定位布局也出现了,还有text-align: c ......
CSS实例-切换开关
在线展示: 矩形开关 圆形开关 代码: <!-- 矩形开关 --> <label class="switch"> <input type="checkbox"> <span class="slider"></span> </label> <!-- 圆形开关 --> <label class="swi ......
CSS3学习笔记-动画
CSS3中提供了许多有趣和实用的动画效果,可以使页面更加生动有趣,下面介绍一些常用的动画效果。 @keyframes规则 使用@keyframes规则可以创建一系列动画帧,并定义它们的状态和样式,在页面中应用该动画后,浏览器会自动处理中间帧的变化。 语法如下: @keyframes animatio ......
CSS3学习笔记-过渡
学习CSS3过渡(Transitions)是为了在元素状态之间创建平滑的动画效果。下面是一些关于CSS3过渡的学习笔记: 过渡基础语法: 使用transition属性来定义过渡效果。 通过指定过渡的属性、持续时间、延迟和过渡速度来设置过渡。 可以使用逗号分隔多个属性,为每个属性设置不同的过渡效果。 ......