2020年12月_十贰_

原创 HTML&CSS实现导航栏滑动背景效果

大家可以先看一下背景滚动的效果这个效果需要注意的就是鼠标悬浮的时机hover，鼠标在悬浮到不同的选项上时，背景的那个色块距离左侧的边距会发生改变。在鼠标离开导航栏时，色块会返回到你定义的那个位置(这个位置在实际的开发中，肯定是当前页面的位置，这个位置你可以自行更改)。下面是代码部分：html部分：<div class="container"> <nav> <a href="#">home</a> <a href="#"&

2020-12-30 17:40:13 3708 4

原创 Vue获取dom元素节点并操作元素的样式（$el的用法以及uni-app中操作元素样式）

在vue中操作dom元素节点的样式有好几种方式这里我总结了两种第一种：1.获取到元素节点(这里通过this.$refs获取元素节点)this.$refs.xxxxx.$el2.操作元素的样式this.$refs.num1Underline.$el.style.transform = 'scaleX(1)';这种方法需要注意的是$el 用于获取vue挂载的实例的dom对象，如果不添加$el则获取不到style的属性值，会打印 TypeError: Cannot read property .

2020-12-29 11:36:25 9170 1

原创一个好看的input输入动画

大家可以先看一下输入框输入效果这个效果需要注意的就是输入框触发的时机问题，在输入框获取焦点的时候：Name文字会向上移动，输入框的下边距会出现。会用到input标签的focus和valid:focus定义：获得焦点的元素，一般用于表单(input、textarea);触发条件：当用户点击或触摸元素或通过键盘的 “tab” 键选择它时会被触发。:valid定义：伪类指定一个通过匹配正确的所要求的表单元素;在这里:valid主要的功能是在input输入框失去焦点是保持最后的状态。下面是代码

2020-12-27 11:22:11 11986 34

原创 uni-app设置页面全局背景色

**uni-app 设置页面全局背景色**page{ background: #000000; }看下编译器是如何介绍这个 page 的。编写代码的会有提示，大家可以留意下。

2020-12-22 13:42:44 2998 1

原创 Vscode 一键格式化代码插件

1.在Vscode应用商店安装下面这个插件。2.然后点击鼠标右键，点击格式化文档就可以将代码格式化。这样代码就可以格式化了。

2020-12-09 17:26:11 8227

原创前端原生javaScript，通过身份证号判断年龄、性别、出生日期。

方法有两个参数，第一个形参传身份证号，第二个形参传num。num=1 代表返回出生日期。num=2代表返回性别。num=3代表返回年龄。//通过身份证号计算年龄、性别、出生日期function idCard(userCard, num) {//获取出生日期 if (num == 1) { birth = userCard.substring(6, 10) + "-" + userCard.substring(10, 12) + "-" + userCard.subst

2020-12-09 10:45:35 3323

原创 css文字超出一行就显示省略号

1，css超出一行用点表示white-space:nowrap;overflow:hidden;text-overflow:ellipsis;2，css超出二行用点表示overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;

2020-12-08 10:35:47 2709

原创 element ui 表格超出部分显示省略号

在element ui 的 el-table-column上添加:show-overflow-tooltip='true'<el-table-column prop="address" align="center" header-align="center" label="地址" :show-overflow-tooltip='true'> </el-table-column>改变鼠标悬浮上去的字体颜色<style> .el-tooltip__popp

2020-12-08 10:33:31 836

qq_39224105的博客