前端学习
关注
分享
扫一扫
文章平均质量分 77
酸橙派SVT
我们的凌晨比白天更火热。
展开
-
vue-resource的使用 之 this.$http.jsonp实现跨域请求（仿360搜索）
使用vue-resource提供的jsonp()方法实现跨域请求。此案例模仿实现360搜索引擎的查询效果。仿360搜索实现效果源码实现效果使用到的文件：vue.jsvue-resource.js(上面两个文件需要自己本机存在才能运行源码，注意导入的路径。如果本地没有，可以使用相关的https://…链接引入，官网都有。)360搜索列表.html源码360搜索列表.html<!DOCTYPE html><html> <head> <m.原创 2021-10-07 22:34:57 · 1493 阅读 · 0 评论 -
结合Bootstrap实现一点点奶茶加盟官网首页页面效果
学完bootstrap3后，找了一个简单的网站进行实战练习，只实现了网站首页的效果。用上bootstrap基本的栅格布局，轮播图和几个常用的样式类，适合小白练手。整个完整首页的实现效果是这样的：这里粘贴两个关键文件的代码：（完整项目资源放github，文末有地址。）1、index.html<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>一点点官网|一点点.原创 2021-09-27 15:31:53 · 1547 阅读 · 4 评论 -
Bootstrap学习笔记
这两天在学习Bootstrap,学过一遍复习后发现有几个组件知识点记得不是很清楚，就自己重新码了一遍加深印象。所以有了这篇笔记~涉及知识一、导航条+滚轮监听二、路径导航（面包屑）三、标签页的切换四、巨幕五、进度条六、缩略图七、工具提示八、轮播图九、利用折叠面板实现手风琴效果十、blockquote引用标签整体效果完整源码一、导航条+滚轮监听导航条<div class="navbar navbar-inverse navbar-fixed-top" id="mynav"> <.原创 2021-09-25 10:53:37 · 608 阅读 · 0 评论 -
JS二重循环画三角形
正直角三角形（1,2,3,4,5,…）实现效果：实现代码：<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <script type="text/javascript"> // 正直角三角形（1,2,3,4,5,...） var num = Number(prompt("三角形所占行数："));原创 2021-09-09 10:59:14 · 551 阅读 · 0 评论 -
CSS3:颜色渐变和重复性渐变
实现效果：实现代码：<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style> div{ width: 270px; height: 180px; float: left; margin: 5px 4px; } /* 线性渐变，目标方向向右，颜色从pink渐变至l原创 2021-09-06 10:20:43 · 318 阅读 · 0 评论 -
Flex布局模拟王者荣耀皮肤抽奖
Flex布局模拟王者荣耀皮肤抽奖实现效果项目目录结构index.html<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title>模拟王者荣耀皮肤抽奖</title> <link rel="stylesheet" href="css/index.css"> </head> <body> <div原创 2021-07-22 17:10:08 · 1044 阅读 · 0 评论 -
CSS画常见的基本图形
利用CSS画基本图形树叶<!-- 树叶 --> <div id="leave"></div><style type="text/css"> #leave{ width: 100px; height: 100px; background: linear-gradient(to top,lightgreen,green); border-radius: 85% 0px 85% 0px; }</style>铅笔原创 2021-07-21 19:03:38 · 209 阅读 · 0 评论 -
纯HTML实现小作品（3个）
纯HTML实现小作品（3个）1、用户注册信息表效果图：实现源码：<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>用户注册页面</title> </head> <body> <center> <h1>用户注册页面</h1> <form action="" m原创 2021-07-13 15:47:09 · 929 阅读 · 0 评论