前端开发2025年08月12日
setup中定义变量以及在style中的使用(有单位的需要calc 计算) setup() { const rotate = ref<number>(0); const color: string = "red"; const changeStatus = (): void => { rotat...
前端开发2025年08月12日
在 CSS 中设置字体名称，直接写中文是可以的。但是在文件编码（GB2312、UTF-8 等）不匹配时会产生乱码的错误。xp 系统不支持 类似微软雅黑的中文。 方案一： 你可以使用英文来替代。 比如 font-family:"Microsoft Yahei"。 方案二： 在 CSS 直接使用 Unicode 编码来写字体名称可以避免这些...
前端开发2025年08月12日
波纹特效: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>按钮动画 - 波纹效果</title> <style> .button { position: relative; background-co...
前端开发2025年08月11日
CSS样式分为三种，行内样式、内部样式、外部样式。 一、element.style.stylename 创建、获取、修改 行内样式 console.log(document.getElementById("testcss0").style.backgroundColor);//"" document.getElementById("testcss0").s...
前端开发2025年08月11日
用css3动画 @keyframes里设置transform:rotate(); 控制动画暂停和运动可以用属性:animation-play-state:paused(暂停)|running(运动);但是有个让人吐血的问题,不管我怎么调加什么兼容前缀,在微信和safari里设置paused无效,在QQ里是正常的 当@keyframes里不用transfor...
前端开发2025年08月11日
一直以为对ul li居中对齐已经掌握了。但最近做项目时发现之前li的float:left方法显然有一个问题，就是无法居中（水平），只能使用padding-left或margin-right的方法方法来固定其居中。 但这样可能在宽屏与窄屏的显示不一致。 使用这种方法主要是利用li的浮动固定宽度来实现，li的默认display为block，将其这个属性改为in...
前端开发2025年08月11日
一，什么是.clearfix 你只要到Google或者Baidu随便一搜"css清除浮动"，就会发现很多网站都讲到"盒子清除内部浮动时可以用到.clearfix"。 .clearfix:after { content: " "; display: block; clear: both; heigh...
前端开发2025年08月11日
1、外部文件引用方式；(推荐使用)2、使用@import引用外部CSS文件;3、内部文档头方式也叫内嵌法调用；4、直接插入式也叫行内样式。 它们主要的差别在于它们规定的风格使用的范围不同： 一、外部文件引用方式 外部文件引用方式即将CSS写成一个文件，在HTML文档头通过文件引用来进行风格控制。 也就是把写好的CSS属性的文件保存为文件扩展名为.CSS文件...
前端开发2025年08月10日
css中a标签内容超出最大字数隐藏处理 问题：a标签内容超出最大字数显示问题 1.超出是最后显示为“...” 2.鼠标放在上面显示完整内容 3.点击新窗口打开链接内容 解决方法： css部分： .list{font:Georgia, "Times New Roman", Times, serif;font-size:14px;width...
前端开发2025年08月10日
其实在stylus与sass中实现移动端1像素线各个手机设备的适配问题的原理是一样的， 首先我还是先介绍一下原理和所依赖的方法 原理：其实他们都是通过css3的媒体查询来实现的 步骤思路： 1、给目标元素进行相对定位 2、给目标元素添加伪元素 ::after/before 并进行绝对定位 3、判断DPI 1DPI 100% --------------使用...