随笔分类 - htmlcss
摘要:效果如下,文字随着背景明暗变化 <svg viewBox="0 0 660 300"> <defs> <filter id="comform"> <feImage :href="image1" x="0" y="0" width="100%" height="100%" preserveAspect
阅读全文
摘要:学习新的浏览器api:showOpenFilePicker,showDirectoryPicker,getDirectoryHandle,getFileHandle,removeEntry 之前文件上传使用的是: <input type="file"> 今天看到直接使用浏览器api即可实现文件读取,
阅读全文
摘要:1.图片主要格式PNG-8、PNG-24、JPEG、GIF、比较新的格式:WEBP、AVIF、JPEG XL 2.设备独立像素:设备独立像素 = CSS 像素 = 逻辑像素 物理像素:又称为设备像素。显示屏是由一个个物理像素点组成的,1334 x 750 表示手机分别在垂直和水平上所具有的像素点数。
阅读全文
摘要:实现效果: 1.所有规格可以联动 2.库存不足置灰不可选 3.再次点击可以取消选择 <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="I
阅读全文
摘要:1.backdrop-filter背景模糊,背景过滤属性,是个非继承属性MDN上是这么说的:可以让你为一个元素后面区域添加图形效果(如模糊或颜色偏移)。因为它适用于元素背后的所有元素,为了看到效果,必须使元素或其背景至少部分透明。 backdrop-filter: blur(6rpx); 兼容性 2
阅读全文
摘要:1.微信小程序中碰到 height:40rpx;line-height:40rpx;并不能上下居中 要实现如上效果,代码往简单写最开始想到用height跟line-height结合text-align实现居中效果: height: 40rpx; line-height:40rpx; width: 8
阅读全文
摘要:1.页面渲染 a.解析HTML文件代码,生成DOM树,生成css树包括display:none的标签和js动态添加的元素或者样式 b.DOM树和css树结合生成渲染树(Render Tree) c.根据生成的渲染树的进行布局(Layout),计算渲染树节点在设备视口(viewport)的位置和大小,
阅读全文
摘要:一. " "键盘中的按键space键,在HTML、字符串中都会被压缩成一个 二. w3cschool描述为 HTML中的常用字符实体是不间断空格( ).在HTML中直接按space敲出多个空格只会保留一个, 用于与添加多个空格,也能用它的实体编号 .(类似的
阅读全文
摘要:1.溢出 当一个盒子的内容(子元素、孙子元素等后裔)超过盒子本身的大小的时候,就会出现溢出。 2.overflow 通常用overflow(overflow-x,overflow-y)来处理内容溢出。 overflow: hidden; 超出盒子的内容被隐藏。 overflow:auto;当内容超出
阅读全文
摘要:1.通过设定边框来实现 <div class="demo"></div> .demo { width: 0; height: 0; border: 50px solid transparent; border-top: 50px solid black; margin: 0 auto; /* bor
阅读全文