前端css
css steps实现文本一个字一个字显示
大致思路： 使用相对定位的div覆盖文本内容，并用animation控制宽度，位置。 换行步骤在外层div上控制高度即可。 css的steps与animation一起使用可以控制文字单个显示，类似于文本输入，不过显示频率是线性。 添加一些css变量控制步骤宽度、高度和时间等，便于vue中也通过组件的 ......
前端Vue项目修改
【SpringBoot+Vue】全网最简单但实用的前后端分离项目实战笔记 - 前端_大菜007的博客-CSDN博客 用HBuilder X打开项目，修改 vue.config.js 文件 修改端口号、关闭语法检查、注释 mock ......
如何隐藏一个元素？&&css中出现了两个一样的类定义，如何避免冲突？
1.如何隐藏一个元素？ 1.使用display属性：设置元素的display属性为none，这样元素在页面上不会占用任何空间，同时也不会对其他元素造成影响 2.使用visibility属性：设置元素的visbility属性为hidden，这样元素在页面上不可见，但仍然占用空间 3.使用opacity ......
css变量声明使用
今天跟朋友聊天被推荐的一个css变量使用,感觉挺方便的,适用于各种页面,类似于scss less ~好处是减少样式代码的重复性，增加样式代码的扩展性和灵活性 简单使用: <style> :root { --color:#000; --width:200px; } body { color : var ......
前端临时储存cookies、sessionStorage、localStorage
cookies、sessionStorage、localStorage的区别是什么？(浏览器)1、cookie（1）本身用于客户端和服务端通信（2）但是它有本地存储的功能，于是就被“借用”（3）document.cookie = …获取和修改即可（4）cookie用于存储的缺点①存储量太小，只有4k ......
ASP.NET Post, FromBody 接参总是null 空值. Web api 前端传递是有值的，怎么回事？
遇到一个常见错误，前端Post传递data: { array: [1,2,3] }，但是API接收的一直是null API 方法 postApi ([FromBody] int[] array, [FromUri] int num) Debug过程 F12检查数据传递结构，没有问题 尝试排除法，只保 ......
CSS 实现垂直居中的5种方法
方法1：使用绝对定位和负外边距对块级元素进行垂直居中 优点：兼容不错。缺点：必须提前知道被居中块级元素的尺寸 .father { width: 300px; height: 300px; background-color: red; position: relative; margin-bottom ......
css组合选择符和less中&作用
1.后代选择器（空格分隔） 2.子元素选择器（>分隔） 3.相邻兄弟选择器（+分隔） 4.普通兄弟选择器（~分隔） 1.后代选择器 ： 用于选取某元素的后代元素 以下实例选取所有 <div> 元素中的<p> 元素 <style> div p { background-color:yellow; } ......
CSS实现菜单选项向外圆角效果
最终效果 实现方法 1. ::before、::after伪元素裁剪拼接 完整代码： 示例中图标引用了iconfont，地址 点击这里 html代码 <body> <ul> <li class="active"><i class="iconfont"></i></li> <li><i ......
全栈之前端 | 5.HTML表格列表标签元素学习篇
[ 点击 👉 关注「 全栈工程师修炼指南」公众号 ] 设为「⭐️ 星标」带你从基础入门 到 全栈实践 再到 放弃学习！ 涉及 网络安全运维、应用开发、物联网IOT、学习路径 、个人感悟 等知识分享。 希望各位看友多多支持【关注、点赞、评论、收藏、投币】，助力每一个梦想。 【WeiyiGeek Bl ......
全栈之前端 | 4.HTML样式布局区块标签元素学习篇
[ 点击 👉 关注「 全栈工程师修炼指南」公众号 ] 设为「⭐️ 星标」带你从基础入门 到 全栈实践 再到 放弃学习！ 涉及 网络安全运维、应用开发、物联网IOT、学习路径 、个人感悟 等知识分享。 希望各位看友多多支持【关注、点赞、评论、收藏、投币】，助力每一个梦想。 【WeiyiGeek Bl ......
全栈之前端| 6.HTML输入提交表单标签元素学习篇
[ 点击 👉 关注「 全栈工程师修炼指南」公众号 ] 设为「⭐️ 星标」带你从基础入门 到 全栈实践 再到 放弃学习！ 涉及 网络安全运维、应用开发、物联网IOT、学习路径 、个人感悟 等知识分享。 希望各位看友多多支持【关注、点赞、评论、收藏、投币】，助力每一个梦想。 【WeiyiGeek Bl ......
全栈之前端 | 3.HTML格式化输出标签元素学习篇
[ 点击 👉 关注「 全栈工程师修炼指南」公众号 ] 设为「⭐️ 星标」带你从基础入门 到 全栈实践 再到 放弃学习！ 涉及 网络安全运维、应用开发、物联网IOT、学习路径 、个人感悟 等知识分享。 希望各位看友多多支持【关注、点赞、评论、收藏、投币】，助力每一个梦想。 【WeiyiGeek Bl ......
Element Plus错误警告 | Popper: Detected CSS transitions on at least one of the following CSS properties: "transform", "top", "right", "bottom", "left".
这个错误的解决方案如下： 1. 禁用 "computeStyles" 修饰符的 adaptive 选项：这将允许平滑过渡，但可能会降低性能。 禁用 "computeStyles" 修饰符的 adaptive 选项，可以在创建 Popper 实例时指定 modifiers 参数，并将 computeS ......
CSS 属性 选择器
具有特定属性的HTML元素样式 具有特定属性的HTML元素样式不仅仅是class和id。 注意：IE7和IE8需声明!DOCTYPE才支持属性选择器！IE6和更低的版本不支持属性选择器。 属性选择器 下面的例子是把包含标题（title）的所有元素变为蓝色： 实例 [title] { color:bl ......
css 设置tr的边框
有时候有设置tr边框的需求，写下如下css tr{ border-bottom: 1px solid red; } 发现不起作用，后来在w3c上查了查，原来只有table，th和td有独立的边框，tr并无边框。 但我想实现每一行都存在下边框，其他边框不存在，该怎么办呢？ 有两种实现方法： 方法1： ......
css 清楚浮动的4种办法
1、浮动：浮动的框可以向左或向右移动，直到它的外边缘碰到包含框或另一个浮动框的边框为止。 由于浮动框不在文档的普通流中，所以文档的普通流中的块框表现得就像浮动框不存在一样 2、我们使用position：fixed，absolute和float都会造成浮动效果。 3、clear 属性的值可以是 lef ......
前端webpack开发阶段解决跨域问题
通过配置代理解决 1 '/API': { 2 target:'https://xiaoapi.cn/API', // 你请求的第三方接口 3 logLevel: "debug",//开启debug模式后，可在终端查看代理的真实请求地址 4 // ws: true, //代理websockets 5 ......
css 实现三栏布局（圣杯布局）的5种方法
效果图： 1、浮动：设置float: left;，配合负margin来实现 .left { float: left; width: 100px; height: 200px; background-color: red; } .right { float: right; width: 100px; ......
css 实现单行、多行溢出 省略号显示
1、单行溢出显示省略号： { white-space:nowrap; overflow:hidden; text-overflow:ellipsis;} 2、多行溢出省略号： ①、（缺点：此方法因为使用了webkit属性，故只能chrome等浏览器有效） { -webkit-line-clamp: ......
2、CSS 颜色定义
CSS颜色定义方法：（RGBA \ HSLA \ opacity \ transparent为css3 新特性） 1、直接使用颜色名/16进制值 2、使用RGBA: RGB代表光的三原色，Red、Green和Blue,CSS3中可以增加一个值a（alpha），表示颜色的透明度:取值范围0-1之间，0 ......
新的 CSS 伪类函数 :is() 和 :where()
新的 CSS 伪类函数 :is() 和 :where() Posted on 2022-08-15 14:39 书中枫叶 阅读(48) 评论(0) 编辑 收藏 举报 :is() 和 :where() 标题中的 <b> 标签进行颜色调整： h1 > b, h2 > b, h3 > b, h4 > b, ......
一个前端大佬的十年回顾 | 漫画前端的前世今生
作者：京东科技 胡骏 引言 岁月如梭，十载流年 前端技术，蓬勃向前 HTML，CSS，JavaScript 演绎出璀璨夺目的技术画卷 回到十年前，前端技术就像一名戴着厚重眼镜的书呆子，总是小心翼翼，被各种各样的浏览器兼容性问题欺负（就像在小学被欺负一样）。 但随着时间的推移，这个书呆子开始锻炼，变得 ......
自己做的一个css文字逐字显示效果
原理很简单，就是通过opacity+animation控制显示，每个文字通过animation-delay延迟显示达到逐字显示的效果 两个函数，一个拆分字符串，一个初始化动画 function sliceStrWithSpan(str) { var strArr = str.slice(''); v ......
解决微前端子应用下拉时位置偏移的问题
在main.js文件中引入 start 增加主子应用的样式隔离 import { start } from 'qiankun' // 增加子应用样式隔离属性 start({ singular: false, sandbox: false, prefetch: false, strictStyleIs ......
前端 - 解决el-table 无限拉伸问题
解决el-table 无限拉伸问题 设置表格的max-height <el-table border :data="tableData" max-height="500px"> 上一步设置成功后，在浏览器缩放条件下仍然存在无限拉伸的问题，这时需要做自适应 ::v-deep .el-table{ wi ......
前端之路 | 1.HTML基础必备知识学习篇
[ 点击 👉 关注「 全栈工程师修炼指南」公众号 ] 设为「⭐️ 星标」带你从基础入门 到 全栈实践 再到 放弃学习！ 涉及 网络安全运维、应用开发、物联网IOT、学习路径 、个人感悟 等知识分享。 希望各位看友多多支持【关注、点赞、评论、收藏、投币】，助力每一个梦想。 【WeiyiGeek Bl ......
全栈之前端 | 2.HTML根部头部主体标签元素学习篇
[ 点击 👉 关注「 全栈工程师修炼指南」公众号 ] 设为「⭐️ 星标」带你从基础入门 到 全栈实践 再到 放弃学习！ 涉及 网络安全运维、应用开发、物联网IOT、学习路径 、个人感悟 等知识分享。 希望各位看友多多支持【关注、点赞、评论、收藏、投币】，助力每一个梦想。 【WeiyiGeek Bl ......