![](https://img-blog.csdnimg.cn/20201014180756918.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
demo
文章平均质量分 51
id_dimu
这个作者很懒,什么都没留下…
展开
-
css:伪元素的使用
对于没有实际意义的内容不要添加格式,应该用样式控制,比如这个了的分隔样式。最先我使用的是在页面中添加一个div,然后在div中添加两个圆和一个横线。但是这是最最简陋的方法了。改进版本:整体有三个模块,通过控制其中两个模块的伪类来实现两个圆,然后通过定位来控制圆的位置,那个横线是一个border与两边的距离通过margin来设置。这里我的伪类是定为到div上面的:内容并不重要,看红框中,这里主要是想记录的是::before和::after这两个伪类,在以前我都没有在意过这些东西,今天是在指导下才明.原创 2020-05-12 17:23:32 · 483 阅读 · 0 评论 -
数组的反向
数组反向方法是:Array.prototype.reverse(); 普通的写法是:var arr = []; //定义并初始化一个数组arr.reverse(); //使用数组的方法反向接下来是自己实现的反向方法var arr = [1,2,3];var len = arr.length;var i,temp;for(i=0;i<len/2;i++)...原创 2019-06-18 15:27:36 · 1296 阅读 · 0 评论 -
关于overflow为hidden后border不会被子级覆盖的问题
预期:从第一张图到第二张图,但是结果为第三张图。html代码:<div class="box"> <div class="ball"></div></div>css代码.box{ width:100px; height:100px; po...原创 2019-06-17 22:02:21 · 1847 阅读 · 0 评论 -
圣杯与双飞翼
圣杯与双飞翼都是实现左右定宽,中间自适应的三列布局,如下图 圣杯 双飞翼 代码: * { margin: 0; padding: 0; } .top,.bottom{ width: 100%; l...原创 2019-05-10 11:05:42 · 301 阅读 · 0 评论 -
js判断素数
问题:判断一个数是否为素数,若是返回 num+“ 是 素数”,若不是返回所有的除数(除了1和本身)test(number){ let arr = []; for(let i=2;i<=Math.floor(number / 2);i++){ if(number % i === 0){ arr.push(i); ...原创 2019-05-07 15:54:46 · 656 阅读 · 0 评论 -
关于element的input输入框 ---- 带输入提示
<el-autocomplete v-model="data" placeholder="请输入内容" :fecth-suggestions="querySearch" @select="mySelect"></el-autocomplete>querySearch(queryString,cb){...原创 2019-04-22 10:19:20 · 14849 阅读 · 2 评论 -
同心圆环
<div class="circle"></div>.circle{ width:200px; height:200px; border-radius:100px; box-sizing:border-box; bo...原创 2019-04-15 17:06:19 · 954 阅读 · 0 评论 -
html 左定宽.右自适应.左边文字根据右边高度居中(水平和垂直)
需求:如下图。左边文字居中显示,高度自适应右边。解决: <div class="box"> <div class="left"> <p class="left-p">左边文字</p> </div> <div class="right"></div></div...原创 2019-04-01 18:56:27 · 731 阅读 · 0 评论 -
css设定背景大图
1. 背景图片background-image:url("");2. 背景图片的大小/*两种可实现方式(任选其一)*/backgound-size:100%;backgound-size:cover;3. 背景图片显示位置background-position:center;4. 背景图片的固定background-attachment:fixed;...原创 2019-04-04 10:44:44 · 206 阅读 · 0 评论 -
原生js匀速轮播
要求:使用html+css+js实现轮播效果。实现效果包括:打开页面自动轮播,鼠标置于轮播框内轮播暂停并显示上翻和下翻箭头。点击箭头可上翻或下翻,鼠标置于导航下标处会自动轮播到该页。效果图:原理: 整个轮播图看成一个box,在box里面有水平放置着几张图片(注:图片放在ul的li标签内)。将要显示的元素放在box内,超出box的元素隐藏。轮播的过程就是将并排的图片移动的过程,如下图...原创 2018-07-31 18:02:43 · 2208 阅读 · 2 评论 -
js抽奖活动简单实现
需求:鼠标点击开始或者键盘回车事件发生,文本开始改变。点击结束或键盘回车事件再次发生时结束。样式图如下: html代码实现:页面中只有一个内容区块,其中包含一个文本和两个按钮。(注意:无论案例大小,始终试着将结构和样式相分离。)<div class="content"> <p class="text" id="text"> 笔记本电脑 &l...原创 2018-07-25 15:13:36 · 2365 阅读 · 0 评论