![](https://img-blog.csdnimg.cn/20201014180756922.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
HTML
前端小li
一壶茶,一包烟,一个Bug改一天。
展开
-
html实现简单的目标树
目标树原创 2022-06-24 11:02:10 · 209 阅读 · 0 评论 -
JS获取DOM节点的几种方式
js获取dom节点原创 2022-06-06 10:26:11 · 934 阅读 · 0 评论 -
css圆弧动画
<!doctype html><html><head><meta charset="utf-8"> <style>.body{ background-color: aqua; height: 700px; width: 1000px; } @keyframes bimg1 { 0% {top: 400px;} 50% {top:0px;transform:scale(1);opaci原创 2022-05-26 11:47:36 · 553 阅读 · 0 评论 -
input框focus,让外层的div产生样式变化:div的focus伪类
:focus-within当点击里面的input框的时候input得到焦点,外层div就会有相当于拥有了input:focus的伪类选择一样, <div class="status-item" v-for="(item,index) of statuslist" :key="index"> <div class="status-picker-color-input-wrapper" > <div class="m原创 2022-03-07 14:35:29 · 1889 阅读 · 0 评论 -
vue自定义指令 弹窗拖拽
import Vue from "vue";//v-dialogDrag:弹窗拖拽Vue.directive('dialogDrag',{ bind(el,binding,vnode,oldVnode){ const dialogHeaderEl = el.querySelector('.el-dialog__header') const dragDom = el.querySelector('.el-dialog') dialogHeaderEl.原创 2022-03-01 10:28:01 · 362 阅读 · 0 评论 -
vue自定义指令 输入框自动聚焦
在main.js中引用封装的js文件import Vue from 'vue'//v-focus:输入框聚焦Vue.directive('focus',{ inserted:function(el){ el.querySelector('input').focus() }})原创 2022-02-28 14:43:42 · 850 阅读 · 0 评论 -
queryselectorAll与getElementByClassName
因为classname拿到的不是nodelist他是HTMLcollection 他没有forEach方法原创 2022-02-28 14:36:36 · 223 阅读 · 0 评论 -
element中切换时间日期选择器时下拉框偏移到左上角的问题
第一次点击都是正常的,但是第二次直接偏移到左上角。解决方案:在el-date-picker里面加上 key=“XXXX”即可原创 2022-01-21 10:39:54 · 1937 阅读 · 1 评论 -
css文字颜色渐变
给文字添加渐变//上下渐变 p { font-size: 48px; background: -webkit-linear-gradient(#eee, #333); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } //左右渐变 p{ width: 200px;//一定要给个宽度不然字少体现不出来 font-size: 48px; backgr原创 2021-12-22 11:12:45 · 483 阅读 · 1 评论 -
CSS3实现旋转相册
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> *{margin:0;padding: 0;} li{list-style:none;} html,body{height:100%;} .box{ height:100%; width:原创 2021-12-17 15:30:13 · 699 阅读 · 2 评论 -
HTML导出pdf的方式
导出网页为PDF的方法原创 2021-12-07 10:42:53 · 999 阅读 · 1 评论 -
JavaScript -深拷贝函数封装
深拷贝与浅拷贝区别浅拷贝:只复制指向某个对象的指针,而不复制对象本身,新旧对象共享一块内存; 改变一个对象,另一个会随之改变;深拷贝:复制并创建一个一模一样的对象,不共享内存,修改新对象,旧对象保持不变。浅拷贝实现var arr = [1, 2, 3, 4];var arr2 = arr;arr2[0] = "okokok"; console.log(arr); // ["okokok", 2, 3, 4]console.log(arr2); // ["okokok", 2, 3, 4]原创 2021-11-26 10:16:54 · 764 阅读 · 0 评论 -
h5 Canvas实现签名写字
Canvas元素是HTML5比较受欢迎的功能,这个元素负责在页面中设定一个区域,然后就可以通过JavaScript动态在这个区域绘制图形。canvas 宽高不能使用样式设置,这个画布的宽高,必须使用html标签来设置<canvas width="800" height="600"></canvas>canvas{ background-color: oldlace; }获取canvas var canvas=document.query原创 2021-10-25 11:03:58 · 927 阅读 · 1 评论 -
WebSocket实现的简易在线聊天室
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Doc原创 2021-10-15 09:57:55 · 211 阅读 · 0 评论 -
JS写的简易点名器
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Doc原创 2021-10-12 15:35:35 · 123 阅读 · 1 评论 -
自定义icon图标和背景色
<template> <div class="icon box"> <el-popover width="200" pacemente="right" tige=cdicxi @hide="hide"> <!-- 选择图标图案和背景色 --> <div> <div> <el-color-p原创 2021-09-30 10:26:41 · 1947 阅读 · 1 评论 -
HTML5新语义化标签
标签介绍header — 页眉main — 主体nav — 导航article — 独立的内容section — 一个区域,跟div的功能和语义是一样的aside — 辅助信息的内容footer — 页脚figure — 描述图像或视频figuretion — 描述图像或视频的标题部分hgroup — 标题组合普通的标签缺点1.不利于SEO搜索引擎对页面内容的抓取2.文档结构定义不明确于是HTML5出现,解决上述问题,专门添加页眉、页脚原创 2021-09-23 11:28:18 · 224 阅读 · 1 评论