前端
stack君
这个作者很懒,什么都没留下…
展开
-
竖排文字垂直居中css样式
文字垂直居中css样式原创 2023-02-02 15:28:08 · 1483 阅读 · 0 评论 -
用svg画一个微信订阅号的图标
用svg画一个微信订阅号的图标原创 2022-11-03 13:14:28 · 378 阅读 · 0 评论 -
Vue学习笔记——插值表达式、v-text和v-html
前言:插值表达式的格式:{{表达式}}该表达式支持js内置语法,可以调用js的内置函数(必须有返回值)。表达式必须要有返回结果,比如:1+1。像var a = 1+1这样的就不行。可以直接使用Vue实例中定义的数据模型或者函数。1.使用js内置函数示例:<html> <div id = "app"> {{999+999}} </div></html>2.使用数据模型的值示例:定义Vue实例的数据模型:const app转载 2022-02-25 09:32:20 · 577 阅读 · 0 评论 -
获取url参数,修改url某个参数的值
1. 根据url中type值的不同,切换简版和完整版隐私政策2. 点击从简版切换到完整版,同时url发生变化原创 2022-02-25 09:19:05 · 609 阅读 · 0 评论 -
vue中定时器一般用法,定时器函数传参以及清除定时器
setInterval() 方法可按照指定的周期(以毫秒计)来调用函数或计算表达式。setInterval() 方法会不停地调用函数,直到 clearInterval() 被调用或窗口被关闭。由 setInterval() 返回的 ID 值可用作 clearInterval() 方法的参数。原创 2022-02-16 10:06:41 · 4349 阅读 · 0 评论 -
ES6——promise案例
实现页面中有个板块,需要多张图片加载完之后才能进行显示:const loadImg = (src) => { return new Promise ((resolve,reject) => { const img = new Image(); img.src = src; img.onload = () => { resolve(img); }; i原创 2021-07-30 14:10:10 · 117 阅读 · 0 评论 -
移动端常用单位单选题
题目:观察下列代码,这个时候p标签的宽高在iphone6下面是多少px?A. 375667B. 178334C. 178667D. 75133.4答案:A解析:计算公式:设备像素缩放比 = 手机逻辑像素/CSS逻辑像素(1)手机逻辑像素:打开浏览器中的移动设备模拟器顶部显示的数字尺寸,因为本题要求是在iphone6下,所以设备像素是375 * 667。(2)CSS逻辑像素:就是px(像素)已知缩放比例是:0.5 带入公式:设备像素缩放比 =手机逻辑像素/CSS逻辑像素——>宽度为原创 2021-03-22 20:25:34 · 111 阅读 · 0 评论 -
box-sizing
<style> .box{ width:150px; height:150px }</style><body> <img src="img/1.jpg" class="box"></body>box-sizing有两个属性值:content-box和border-box。根据上例,如果给box的box-sizing设置content-box,则图片内容宽高为150*150 px(如果为图片加padding和border是向原创 2021-03-18 10:21:01 · 97 阅读 · 0 评论 -
正则验证 编程题
题目:现有获取到的用户输入var userInput = ‘正则’; 利用我们刚学过的知识来创建正则表达式,匹配字符串’正则表达式’中的’正则’两个字符。效果图如下:思路:1.用构造方法定义正则表达式,并且将要匹配的字符(userInput)传进去2.用test和exec方法分别进行测试,注意每个输出结果都用“/”隔开。解答:<!DOCTYPE html><html><head> <meta charset="utf-8"> &l原创 2021-01-12 21:26:05 · 90 阅读 · 0 评论 -
用JavaScript写控制css的函数 编程题
题目:写一个操作css的函数,要求第一个参数传DOM元素(elem),第二个参数传属性名,第三个参数传属性值。如果只有两个参数,则返回属性的值;如果有三个参数则设置属性值。思路:定义一个函数css , 用于操作css;利用arguments.length判断实参的个数,做相应的事情;如果只有两个参数;如果有三个参数则设置属性值;给id为test的p元素,通过css函数设置样式:第一个:传入一个元素,background-color和orange;第二个:传入一个元素,一个c原创 2021-01-12 11:14:55 · 122 阅读 · 0 评论 -
用JavaScript写比较数字大小的函数 编程题
题目:编写一个比较数字大小的函数(min,即实现求最小值的函数),它可以接收任意参数的函数,完成比较[2, 4, 1, -1, 56, 3, -7]中数字的大小,并将最小值结果输出在页面上。思路:1. 将比较大小(min)函数改写成可接收任意参数的函数;利用arguments.length来确定参数个数, 利用arguments[i]获得相应的参数值;每次比较都将最小值保存到一个变量中,最后将其返回;用apply方法将参数一次性的传递进去,并输出;解答:...原创 2021-01-12 11:07:56 · 1630 阅读 · 0 评论 -
具有选择功能菜单的编程题
题目:在简易计算器制作过程中,我们学习了如何获取到表单控件的值,并判断进行相应的运算。接下来让我们实现一个具有选择功能的菜单效果吧。效果可以参考下列的gif图:点我查看GIF动图思路:1、 在脚本中监听下拉列表的选项改变,并获取选项值2、 使用switch语句判断分支3、将最终结果写入到页面中的相应位置解答:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8">原创 2021-01-12 11:01:13 · 428 阅读 · 0 评论 -
关于参数的个数的编程题
题目:编写一个比较数字大小的函数(min,即实现求最小值的函数),它可以接收任意参数的函数,完成比较[2, 4, 1, -1, 56, 3, -7]中数字的大小,并将最小值结果输出在页面上。思路:比较大小(min)函数改写成可接收任意参数的函数;利用arguments.length来确定参数个数, 利用arguments[i]获得相应的参数值;每次比较都将最小值保存到一个变量中,最后将其返回;用apply方法将参数一次性的传递进去,并输出。解答:<!DOCTYPE原创 2021-01-10 09:58:46 · 217 阅读 · 0 评论 -
参数argument的使用编程题
题目:写一个操作css的函数,要求第一个参数传DOM元素(elem),第二个参数传属性名,第三个参数传属性值。如果只有两个参数,则返回属性的值;如果有三个参数,则设置属性值。思路:定义一个函数css , 用于操作css;利用arguments.length判断实参的个数,做相应的事情:如果只有两个参数则返回属性的值;如果有三个参数则设置属性值;给id为test的p元素,通过css函数设置样式。第一个:传入一个元素,background-color和orange第二个:传入一个元原创 2021-01-10 09:51:31 · 250 阅读 · 0 评论 -
用css写提示滚屏箭头动画效果
在许多滚屏的网页中都有提示滚屏箭头动画效果,这种效果往往在网页底部显示,提示我们下滑屏幕,现在我们就用css代码来实现这种效果。1、首先创建一个div,并且输入“>”(代码:>),再用css控制其大小、字体,并翻转90°让其向下(transform属性),控制位置为网页底部居中。效果:2、创建向下移动动画关键帧,取名arrow,用定位使箭头每次向下移动2px。3、最后设置动画为无限循环,并且开始动画前延迟0.5s。在这里我使用的是animation复合属性。语法如下:本例用原创 2021-01-09 10:39:18 · 2304 阅读 · 1 评论 -
用css3写太极旋转图
用css写出旋转的太极图效果,主要有两个要点:画出静态效果图和创建动画使它动起来。一、静态效果图用一个div配合伪元素即可完成。1、创建一个div,用css控制其大小、边框、位置等,做成一个静态的圆形,一半为红色一半为白色。效果:2、用div的伪元素绘制两个圆环,并通过绝对定位放置适合位置,使其成为一个太极图案。效果:二、创建动画动画主要用到的是animation相关属性。1、创建动画定义动画名称为“rotate”,周期为5秒,循环播放。2、绑定选择器关键帧,设置逆时针旋转3原创 2021-01-09 10:12:17 · 303 阅读 · 0 评论