
web前端
文章平均质量分 68
MayMayJn
这个作者很懒,什么都没留下…
展开
-
传智下的一个表单的demo
这个是根据传智HTML5的视频写的表单的demo: 学生档案 body{ margin: 0px; padding: 0px; background-color: #F7F7F7; height: 1300px; } form{ max-width: 640px; width: 100%; margin: 50px auto原创 2016-11-28 21:29:42 · 908 阅读 · 0 评论 -
Express+mongoose搭建简易的web数据接口
搭建node.js服务和express框架开始:npm install express --saveexpress serverdone启动:npm installnode bin/www或者npm start更换jade模板引擎为html安装ejs npm install ejs --saveapp.js引入ejs : var ejs = require('ejs')配置vie原创 2018-02-01 12:02:18 · 612 阅读 · 0 评论 -
vue全家桶+node+mongodb商城项目小结
配置文件index.jswebpack.base.conf.jsvue.js基础语法mustache语法:{{msg}}html赋值:v-html=""绑定属性:v-bind:id=""使用表达式:{{ ok?'Yes:No' }}文本赋值:v-text=""指令:v-if=""条件判断过滤器:{{ message | capitalize }}和v-bind:id="rawId原创 2017-12-04 11:09:56 · 2853 阅读 · 0 评论 -
Vue小结
new 一个vue对象时可以设置他的属性,其中重要的三个是data,method和watchdata代表vue的数据method代表vue对象的方法watch设置了对象监听的方法vue里面的设置通过HTML指令进行关联其中: * v-text 渲染数据 * v-if 控制显示 * v-for 循环渲染 * v-on 绑定事件index.html 项目入口<!DOCTYPE html>原创 2017-10-27 10:38:20 · 385 阅读 · 0 评论 -
PHP分页+Elasticsearch查询
PHP分页+Elasticsearch查询分页,本质上就是根据给定的页码和偏移量从服务器端请求数据。原理很easy,实践起来却有诸多问题,这里总结一下目前使用的分页demo,通过es请求数据,前端自己构建页码。html的页码显示,有4个参数,$page-具体页码,$pagenum-页数总数,$s-起始页,$e-结束页,点击页码通过触发pageChange()函数进行分页 跳转至指定页码的功能,通过原创 2017-05-22 22:10:49 · 4517 阅读 · 0 评论 -
datatable的自定义配置-输出结果&排序&跳转指定页码
自定义输出结果我的需求:我们都知道datatable查询数据后都是按照列一列一列的返回的,但是有时候我们虽然用到了datatable的表,却不需要按列展示数据,我所要实现的是在查询数据的时候按列从数据库中查询多个列的数据,但是展示在页面上的时候把很多列的数据显示在一列中,像下面图片这样:我需要做的就是按列从数据库中查询标题、作者、URL、正文等内容,再自己组装成上面的样式。 下面是代码,我修改了s原创 2017-03-03 11:29:44 · 3663 阅读 · 0 评论 -
bootstrap框架学习笔记一(模板,排版-段落-列表-表格部分)
基本的bootstrap模板<!DOCTYPE html><html lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=devic原创 2016-12-20 20:48:10 · 1179 阅读 · 0 评论 -
bootstrap框架学习笔记五(其他部件)
没有摘要原创 2016-12-26 12:13:14 · 579 阅读 · 0 评论 -
bootstrap框架学习笔记四(按钮、导航、导航条)
菜单、按钮及导航下拉菜单 在使用前调用压缩好的“bootstrap.min.js”文件。 因为Bootstrap的组件交互效果都是依赖于jQuery库写的插件,所以在使用bootstrap.min.js之前一定要先加载jquery.min.js才会生效果。 一个简单的示例:<div class="dropdown"> <button class="btn btn-default drop原创 2016-12-24 10:23:08 · 2897 阅读 · 0 评论 -
bootstrap网格系统
网格系统通过定义容器大小,平分12份(也有平分成24份或32份,但12份是最常见的),再调整内外边距,最后结合媒体查询,就制作出了强大的响应式网格系统。 Bootstrap框架中的网格系统就是将容器平分成12份。工作原理1、数据行(.row)必须包含在容器(.container)中,以便为其赋予合适的对齐方式和内距(padding)。如:<div class="container"><div c原创 2016-12-23 18:35:16 · 826 阅读 · 0 评论 -
bootstrap框架学习笔记二(表单、按钮)
表单基础表单表单中常见的元素主要包括:文本输入框、下拉选择框、单选按钮、复选按钮、文本域和按钮等。 bootstrap对表单内的fieldset、legend、label标签进行了定制。主要将这些元素的margin、padding和border等进行了细化设置。fieldset {min-width: 0;padding: 0;margin: 0;border: 0;}legend {原创 2016-12-22 22:21:53 · 876 阅读 · 0 评论 -
canvas绚丽的时钟效果(下)
虽然这是慕课网上的一个教程,但是看一遍总有好多地方比较朦胧,于是就跟着手敲了一遍代码,去弄懂每一个函数的作用就差不多了。 现在我的时间是15:54分!index.html<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title></head><body style="height:原创 2016-12-07 15:57:30 · 539 阅读 · 0 评论 -
canvas绚丽的时钟效果(上)
canvas是HTML5的特性,是定义在浏览器上的画布。前端好多精美的网页都会用到canvas这一特性。 慕课网上有很多canvas的教程,我学了一个比较基础但是效果非常引人入胜的教程,就是用canvas动画实现倒计时效果。用canvas进行基础的绘画:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <t原创 2016-12-07 15:31:45 · 724 阅读 · 0 评论 -
逻辑运算符的短路运算
&& ||如果两个操作数都不是布尔型如果两个值转换成布尔型都是true,但会第二个操作数如果有一个操作数转换为布尔型为false,返回这个数var z = a * (x/=y) * x;var z = a * x/y * x/y;var z = a * x * x/(y*y);原创 2016-11-29 10:41:19 · 1010 阅读 · 0 评论 -
JS下两种定义函数的区别
两种定义函数的方式:// 字面量定义,表达式 // var fn = function () {// alert(1);// }();// fn();// 关键字来定义function fn() {alert(2)}();第二种方式会报错,第二种的fn是全局函数,在网站复杂时或者开发人员比较多时不适用例外一种形式是在表达式外面加一个括号:// 表面原创 2016-11-28 22:18:01 · 920 阅读 · 0 评论 -
传智CSS笔记
这也是看传智CSS的视频教程记录的笔记!---------------------------------------------------------------------------------------------------选择器的优先级:行内选择器》id选择器》类选择器》标签选择器》通配符选择器》继承样式》默认样式 Display :Display:in原创 2016-11-28 21:37:50 · 533 阅读 · 0 评论 -
传智HTML5笔记
什么是浏览器什么是服务器?服务器:浏览器浏览页面背后的秘密:---浏览器接受用户操作->浏览器封装http请求->链接服务器:DNS解析->发送请求request->服务器接受请求->处理请求->返回相应报文->浏览器接受相应报文->.渲染页面呈现---http协议DNS域名解析:HTML5文档结构:Docty原创 2016-11-28 20:42:13 · 557 阅读 · 0 评论 -
图片比例自适应居中与CSS垂直水平居中
图片比例自适应居中说明最近项目里有这样一个需求:要求是在图片外部的框框是大小一致、图片的长宽比不一致,且图片能够在固定高度的情况下,使得图片的宽度能保持原有的比例,及宽度不压缩,图片始终在外部div的最中间,如下图所示图片宽度大于外部边框的情况下,两边会有一部分看不见原图效果图图片宽度小于外部边框的情况下,两边会留白原图效果图代码在网上找了许多资料,最终使用了下面的方案,效果很OKhtml部原创 2018-04-20 11:10:45 · 9036 阅读 · 0 评论