华安 - 博客园

CSS特效：clip-path边框

摘要： clip-path clip-path clip-path：裁剪，新的裁剪，与clip相同，只不过clip是老裁剪，并且要absolute和fixed定位元素才能使用，并且智能裁剪正方形，这里就不多做赘述，我们直接看clip-path就行 clip-path对元素的定位没有要求，而且也能裁剪更多的元阅读全文

posted @ 2025-03-05 17:25 华安阅读(442) 评论(0) 推荐(0)

background-clip: text实现文字渐变

摘要：效果图： 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <style type="text/css"> 5 .bg { 6 height: 100px; 7 width: 300px; 8 line-height: 50px; 9 color: transparent; 阅读全文

posted @ 2025-03-03 09:23 华安阅读(22) 评论(0) 推荐(0)

图片阻止父元素的点击事件，导致无法触发跳转

摘要：问题：盒子里面包含图片，盒子有跳转事件，但是在百度浏览器中点击一直展示图片，不跳转。原因：在某些情况下，图片可能会阻止父元素的点击事件，导致无法触发跳转。这可能是因为图片元素的点击事件冒泡到了父元素，而父元素的点击事件被图片元素捕获并处理了。 1 <div class="con"> 2 <img 阅读全文

posted @ 2025-02-28 18:13 华安阅读(41) 评论(0) 推荐(0)

鼠标滑轮实现图片缩放

摘要： <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>图片放大缩小</tit 阅读全文

posted @ 2025-02-27 21:11 华安阅读(27) 评论(0) 推荐(0)

css样式中的百分比都是相对于谁的？

摘要： idth、height（正常定位） width 和 height 的百分比是分别根据父级元素块的宽度和高度来计算的。相对定位的 top、left 1 position: relative; 2 top: 100%; 3 left: 100%; top 和 left 的百分比是分别根据父级元素块的高阅读全文

posted @ 2025-02-27 19:31 华安阅读(104) 评论(0) 推荐(0)

JS实现通过双指捏合，对div进行放大缩小

摘要：在Web开发中，使用JavaScript和CSS可以实现一个双指捏合（Pinch to Zoom）的功能，使得用户可以通过触摸屏幕来放大或缩小一个div元素。这通常涉及到监听触摸事件，并计算手指间的距离变化，然后根据这个变化来调整div的尺寸。下面是一个基本的实现步骤和示例代码： HTML 首先，阅读全文

posted @ 2025-02-27 19:24 华安阅读(410) 评论(0) 推荐(0)

了解CSS圆角：border-radius

摘要： border-radius是CSS中用于设置元素边框圆角的属性，可实现椭圆和各种圆角效果。它可以有1到4个值，分别对应不同角落的圆角半径，值可以用em、px等单位，也可以用/分隔设置x、y轴不同的半径。简写形式允许省略相同值，通过/可以单独指定x和y轴的半径。什么是border-radius bo 阅读全文

posted @ 2025-02-26 08:45 华安阅读(789) 评论(0) 推荐(0)

css剪裁clip-path——基本图形剪裁

摘要：语法：https://developer.mozilla.org/zh-CN/docs/Web/CSS/basic-shape/inset `clip-path`属性，包括`inset()`用于矩形剪裁，支持百分比和圆角；`circle()`和`ellipse()`用于创建圆形和椭圆剪裁，支持半径百阅读全文

posted @ 2025-02-26 08:33 华安阅读(1013) 评论(0) 推荐(0)

xlsx.js中 table数据导出成EXCEL的格式设置

摘要： 1、如果想将Table中的数据全部导出成文本，只需要按照如下代码设置： XLSX.utils.table_to_book(tableObj, {raw:true}); 2、如果想单独设置每个TD的导出数据格式，请按照如下代码设置： XLSX.utils.table_to_book(tableObj, 阅读全文

posted @ 2025-02-10 08:55 华安阅读(225) 评论(0) 推荐(0)

getComputedStyle与currentStyle

摘要：大家好，又见面了，我是你们的朋友全栈君。本文参考https://developer.mozilla.org/en-US/docs/Web/API/Window.getComputedStyle 1.简介 getComputedStyle是window下的一个全局函数，可以获取元素真正使用的样式。阅读全文

posted @ 2024-12-29 21:29 华安阅读(134) 评论(0) 推荐(0)

huaan011