编程
周百万.
生于华夏,吾辈当自强!
展开
-
jQuery购物车完整功能实现,全代码详解(有动态效果图)
jQuery购物车 实现购物车完整功能全代码详解(有gif动态效果图)原创 2022-07-25 00:23:07 · 8020 阅读 · 7 评论 -
手风琴效果
手风琴效果原创 2022-07-21 17:37:28 · 303 阅读 · 0 评论 -
图片突出显示案例html+css+jquery
图片突出显示案例html+css+jquery原创 2022-07-20 23:50:19 · 895 阅读 · 0 评论 -
会话存储sessionStorage与本地存储localStorage叙述与案例分析
会话存储sessionStorage与本地存储localStorage叙述与案例分析原创 2022-07-16 23:41:54 · 302 阅读 · 0 评论 -
java script实现 :hover 的盒子现实与隐藏效果
核心:运用javascript代码,实现鼠标经过ul标签显示,实现鼠标移走ul标签隐藏。用html与css实现案例的外观HTML代码(就是四个盒子里面包含a和ul,ul里面又包含li) <div class="nav"> <li> <a href="#">a</a> <ul> <li>1</li>原创 2022-05-21 14:53:55 · 619 阅读 · 0 评论 -
javascript 利用排他思想创作点击按钮显示颜色
代码不难主要是利用排他思想:排除其他的元素的干扰这是没利用排他思想,直接获取元素,注册事件,让他点击后获得背景颜色的改变但是无法使盒子点击一次只显示一个,所以下面使用for循环来给盒子进行排他思想的设置<body> <button>按钮1</button> <button>按钮2</button> <button>按钮3</button> <button&g..原创 2022-05-08 17:01:19 · 746 阅读 · 1 评论 -
修改版ATM小型项目
费话不多说,直接上代码!var money = 100; while (num != 4) { var num = prompt('请输入你想进行的操作:\n1、存钱 \n2、取钱\n3、显示金额\n4、退出'); switch (num) { case '1': var saveMoney = prompt('请输入你存钱的金额:');原创 2022-04-17 08:00:00 · 168 阅读 · 2 评论 -
break,continue,return的区别
break:结束当前的循环体(for,while);continue:跳出当前循环,继续以后的循环(for,while);return:不仅可以跳出循环,还可以返回return语句中的值,同时还能结束循环体,不再执行下面的代码(只能在函数中使用);1、break的使用首先:就如他的含义一样他是结束的意思。就是直接结束整个循环;在代码中写了一个for循环,里面遍历了一下1~10的整数并输出,但是如果 i 的值等于3,就break,可以在输出结果中明显看到,break后整个循环就已经..原创 2022-04-16 15:57:46 · 228 阅读 · 0 评论 -
简易ATM项目(switch case)
主要运用了,switch case 循环语句,用户输入那个数,就进行 var money = 100; var num = prompt('请输入你想进行的操作:\n1、存钱 \n2、取钱\n3、显示金额\n4、退出'); switch (num) { case '1': var saveMoney = prompt('请输入你存钱的金额:'); money += saveMo.原创 2022-04-11 23:15:52 · 545 阅读 · 1 评论 -
pink老师的for,while,switch循环课后练习题
作业1:一百以内的累加和,平均值 // 一百以内的累加和,平均值 var sum = 0; var average = 0; for (var i = 1; i <= 100; i++) { sum += i; } average = sum / 100; console.log(sum); console.log(average);作业2:一原创 2022-04-11 20:06:12 · 417 阅读 · 2 评论 -
Javascript 利用for循环制作多种星星模型
使用javascript制作星星模型的主要工具就是for循环语句!使用一个for循环语句可以生成一维的星星样式!使用两个for循环语句可以制作二维星星样式!(可直接往后面看)首先先看一维星星样式!实例1:打印五颗横向排列的星星。 // 打印五颗星星 var str = ''; for (var i = 1; i <= 5; i++) { str = str + '★'; }原创 2022-04-08 00:11:02 · 4574 阅读 · 3 评论 -
Javascript ++a 和 a++ 的联系与区别
前加 :++a后加:a++联系:当单独加的时候结果是一样的。区别:a++ 先返回原值 再加一 |||||| ++a 先加一 再返回原值但使用后加的概率大一点 前加和后加在单独使用的时候结果是相同的! var num = 1; //前加 num++; console.log(num); //后加 ++num; console.log(num)...原创 2022-04-04 22:05:44 · 1207 阅读 · 0 评论 -
解决 col-*-offset-n 不能正常移动的问题
在bootstrap中4.0以下版本!col-sm-offset-3:实质是 margin-left如果你之前给div 盒子设置 margin:0 ; 那么offset 属性将不会起作用。4.0以上版本!根据官方文档用 offset-sm-3 不用再写col- 前缀了。4.0以下版本实验:如果加 margin:0; 就不会产生任何反应! <style> * { padding: 0; ...原创 2022-03-30 23:05:57 · 542 阅读 · 1 评论 -
flex-direction设置主轴的方向
flex-direction:row:从左到右(默认属性)flex-direction:row-reverse;注意盒子中的数字!盒子第一个在右边开始排!flex-direction:column;flex-direction:column-reverse;注意盒子中的文字!盒子第一个在下边开始排!...原创 2022-03-20 22:00:05 · 339 阅读 · 0 评论 -
两面翻转的盒子(解决转后不显示问题)
如图所示:鼠标一碰到盒子,盒子就会翻转!重点来了,很多小伙伴会发现盒子转动后不显示后面的盒子:需要在".front" 标签上加backface-visibility: hidden;加上这行代码就可以啦!代码如下: <style> .box { position: relative; margin: 100px auto; width: 300px; heig..原创 2022-03-10 19:26:16 · 1166 阅读 · 2 评论 -
怎样用html写出三角形
1、先写一个盒子2、让宽度和高度为03、给出一个border值,border:10px solid transparent ;4、想要那个方向的三角形,就给出哪个方向的颜色如图所示:border-top-coloor:blue;上面的三角形就是蓝色!border-left-coloor:red;上面的三角形就是红色!......注意:如图所示正方形的边长为20px 但是所写的border 值为10px 根据此来做出想要的三角形即可!代码如下:<st原创 2022-03-01 12:36:36 · 5366 阅读 · 0 评论 -
外边距的合并问题
在代码的编辑中,常常会遇到下面的问题1、相邻块元素的垂直外边距合并原因:上面的盒子有下边距margin-bottom 下面的盒子有上边距 但是他不会取两外边距之和,而是最大的那个外边距!解决方法:尽量只给一个盒子添加margin值。2、嵌套块元素的垂直外边距塌陷原因:两个嵌套关系的盒子(父子级关系),大盒子有上外边距,小盒子也有上外边距,不会取两外边距之和,而是去两个外边距之中最大的那一个。解决方法:a:可以为父元素定义上边框b:可...原创 2022-02-26 20:30:01 · 359 阅读 · 0 评论 -
Float对于文字,对于块状元素是怎样浮动的!
float是浮动可以分为float:left ; float:right;浮动可以使自身浮动起来,原先的位置可以不再占有。块状元素可以顶替他的位置!通俗来讲,一群人排成一队做凳子,前面的人站起来走了(加了浮动),后面的人就可以坐下啦!(占领他原先的位置)先看文字!!!但是,浮动一开始被研发时的作用就是搭配文字使用,使文字环绕图片显示!这是不加浮动的时候! 可以看到浮动是让文字环绕在图片周围使用的!但他的本质是文字还是在图片下面,只不...原创 2021-08-17 21:36:18 · 222 阅读 · 0 评论 -
小米盒子布局练习(html)
简单的小米页面布局,希望能帮助正在自学的你!效果图如上所示!代码入下!<head> <meta charset="UTF-8"> <title>小米盒子加强版</title> <style> .box { width: 1160px; height: 515px; margin: 10px auto; } .left { float:left; width: 300px; he..原创 2021-08-03 15:54:55 · 965 阅读 · 0 评论