![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前端+
phubing
纵使秋风起,人生不言弃。
展开
-
使用 css3 和 html 给网站添加上春节灯笼特效
先上效果图1、复制下面的代码添加到网站的页脚文件。<!-- 灯笼1 --><div class="deng-box"> <div class="deng"> <div class="xian"></div> <div class="deng-a"> <div class="deng-b"&...转载 2020-01-23 22:32:13 · 2151 阅读 · 0 评论 -
网站悬浮窗漂浮
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Jerory's code</title> <style> .float_x { cursor: pointer;...原创 2019-12-10 22:26:38 · 1160 阅读 · 0 评论 -
/u5f20 之类的转中文
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m...原创 2019-12-10 22:25:40 · 8867 阅读 · 0 评论 -
css设置各种中文字体如雅黑、黑体、宋体、楷体等等(未)
.selector{font-family:"Microsoft YaHei",微软雅黑,"MicrosoftJhengHei",华文细黑,STHeiti,MingLiu}css如何设置各种中文字体如雅黑、黑体、宋体、楷体等等说明:加上中文名“微软雅黑”是为了兼容opera。MicrosoftJhengHei为微软正黑体,STHeiti为华文黑体,MingLiu记得1...转载 2019-04-01 20:41:57 · 8404 阅读 · 3 评论 -
基于百度地图,输入地点查找周围环境(地铁、公交、医院、学校等)
不多逼逼,直接上码<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"&原创 2019-01-28 17:28:24 · 8713 阅读 · 0 评论 -
JS获取table中每一个tr的特定input的值
var tableIdArray = document.getElementById("tableId");var tableIdInput = tableIdArray.getElementsByTagName("input");for(var i=0; i<tableIdInput.length; i++){ if( (tableIdInput[i].name).indexOf...原创 2018-12-24 15:17:42 · 4879 阅读 · 0 评论 -
使用LocalStorage存储用户已填写的表单信息(意外刷新后自动填充)
先引入一个js文件:sisyphus.min.js(官网:http://sisyphus-js.herokuapp.com/)在页面的script中找个地方引用:$( function() { $( "#basic_form" ).sisyphus(); // or you can persist all forms data at one command // $( "for...原创 2018-12-11 18:23:52 · 3418 阅读 · 0 评论 -
js操作cookie完成添加表单,存入cookie及读取cookie
<script type="text/javascript"> function saveData(){ var d = new Date(); d.setTime(d.getTime() + 2*60*60*1000); var expires = ";expires="+d.toUTC...转载 2018-12-11 17:19:00 · 2130 阅读 · 0 评论 -
百度统计:_trackEvent函数的使用方法
不重复写,放上链接:https://segmentfault.com/a/1190000002581832原创 2018-12-17 15:32:11 · 5441 阅读 · 1 评论 -
JS判断当前浏览器是否为IE内核
第一种:if(window.addEventListener){ alert("not ie"); }else if(window.attachEvent){ alert("is ie"); }else{ alert("这种情况发生在不支持DHTML的老版本浏览器(现在一般都支持)") }第二种:if(document.all){ al...转载 2018-12-06 11:32:54 · 4887 阅读 · 2 评论 -
webpack4.x最详细入门讲解
前言本文主要从webpack4.x入手,会对平时常用的Webpack配置一一讲解,各个功能点都有对应的详细例子,所以本文也比较长,但如果你能动手跟着本文中的例子完整写一次,相信你会觉得Webpack也不过如此。 一、什么是webpack,为什么使用它?二、一个简单的打包例子2.1 准备工作首先新建一个空文件夹,用于创建项目,在终端中进入文件夹,如下我在桌面建了一个名为we...转载 2018-11-23 11:51:48 · 251 阅读 · 0 评论 -
JS倒数5秒后跳转
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>倒计时五秒</title> <script> //使用匿名函数方法 function countDown(){ var time转载 2019-02-18 15:33:12 · 1455 阅读 · 3 评论 -
公示公告信息弹窗提示(一天只弹一次)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><met原创 2019-03-13 10:09:38 · 8920 阅读 · 2 评论 -
小程序登录步骤图解
最近也做了好几个项目,都用到了微信登录以及自己做的小程序,都会涉及登录,遂记录一下关于微信登录的流程,以便备注原创 2019-09-25 21:18:06 · 333 阅读 · 0 评论 -
百度地图开发之:带检索功能的信息窗口
<!DOCTYPE html><html><head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /&...原创 2019-08-16 09:29:57 · 1970 阅读 · 0 评论 -
网页端调用百度地图,自定义标注图标方法
最近做网页端地图导航的时候,需要用到自定义标注,这里记录一下(大牛轻喷)<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="initial-scale=1.0,user-scalabl...原创 2019-07-18 09:35:50 · 1645 阅读 · 3 评论 -
JSONP请求后台示例
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="Access-Control-Allow-Origin" content="*"> <title>jQuery实现JSONP</ti...原创 2019-06-11 19:21:15 · 685 阅读 · 0 评论 -
html内容超出了div的宽度如何换行让内容自动换行
在显示评论列表的时候因为有固定宽,但是显示的内容超出的了div的宽,在这种情况下我们需要将其换行,实现的css代码如下在工作中评论内容测试遇到评论着的评论内容为:“dddddddddddddddddddddddddddddddddddddddddddddddddd”,错误的评论,在显示评论列表的时候因为有固定宽,但是显示的内容超出的了div的宽,在这种情况下我们需要添加css为:...转载 2019-04-22 12:00:56 · 692 阅读 · 0 评论 -
如何使用Bootstrap中的字体、图标等
除了glyphicons 还可以如下方式引入图标:http://www.bootcss.com/p/buttons/Buttons是一个高度可定制的、免费并且开源的按钮 CSS 样式库。<!-- Buttons 库的核心文件 --><link rel="stylesheet" href="css/buttons.css"><!-- 当需要使...转载 2019-04-08 14:56:45 · 2021 阅读 · 0 评论 -
SpringBoot+PageHelper+Bootstrap+Thymeleaf 实现分页功能
本文针对那种想要快速实现功能,而不是研究原理的,那你就直接复制我的东西,运行就好。如果想深入学习的同学请另行百度。第一种Spring Boot + Thymeleaf 使用PageHelper实现分页这种实际上就是单独使用分页插件来实现分页功能。好处是,分页条你可以自行排版,不受页面约束。(前端使用的是thymeleaf)我使用的是spring boot 2.1.11.RELEA...转载 2019-04-08 14:53:30 · 12884 阅读 · 13 评论 -
Angular-checked方法使用
场景:在进入修改商品页面的时候,前端获取从后端返回的数据,并将这些数据展示在修改商品的页面上,在使用AngularJS的情况下如何判断并勾选?也即:什么时候勾选复选框?(1)取决于数据库中的某张表的某个字段,例如在数据库中存储的是这样的: [{"attributeName":"网络","attributeValue":["移动3G","移动4G"]},{"attributeNam.原创 2018-11-22 15:33:28 · 1187 阅读 · 0 评论 -
IE8下,JS不识别indexOf的解决办法
把这段代码放在你的indexOf方法之前:(在页面中定义IndexOf方法)if (!Array.prototype.indexOf){ Array.prototype.indexOf = function(elt /*, from*/){ var len = this.length >>> 0; var from = N...转载 2018-11-22 11:31:46 · 1039 阅读 · 0 评论 -
HTML-CSS浮动元素详解
Posted on 2016-07-08 11:18 王者归来! 阅读(202) 评论(0)编辑 收藏浮动定位是指1.1将元素排除在普通流之外,即元素将脱离标准文档流1.2元素将不在页面占用空间1.3将浮动元素放置在包含框的左边或者右边1.4浮动元素依旧位于包含框之内2. 浮动的框可以向左或向右移动,直到它的外边缘碰到包含框或另一个浮动框的边框为止经常使转载 2016-09-25 10:24:08 · 1689 阅读 · 0 评论 -
HTML5终极备忘大全(图片版+文字版)
一、前言兼图片备忘下图是我从testking网站上的Ultimate HTML5 Cheatsheat这篇文章中备忘图片(已大小优化,因为图片较高,故滚动显示)。但是,上面毕竟是图片格式(原图上兆),而且还是英文的,所以自己觉得有必要将上面的内容文字化,同时做下简单的中文翻译。整理一番,于是就有下面的些内容。二、文字备忘之标签HTML5中新增的标签定义文章转载 2016-09-25 10:00:07 · 243 阅读 · 0 评论 -
CSS float 浮动属性
本篇主要介绍float属性:定义元素朝哪个方向浮动。目录:1. 页面布局方式:介绍文档流、浮动层以及float属性。2. float:left :介绍float为 left 时的布局方式。3. float:right :介绍float为 right 时的布局方式。4. 相邻元素含有float属性:介绍相邻元素含有float属性时的布局方式。 1. 页面布局方式转载 2016-09-25 09:58:36 · 326 阅读 · 0 评论 -
CSS基础(七):z-index详解
概念z-index 属性设置元素的堆叠顺序。拥有更高堆叠顺序的元素总是会处于堆叠顺序较低的元素的前面。 层级关系的比较1. 对于同级元素,默认(或position:static)情况下文档流后面的元素会覆盖前面的。2. 对于同级元素,position不为static且z-index存在的情况下z-index大的元素会覆盖z-index小的元素,即z-index越大优先级越高转载 2016-09-24 22:16:19 · 343 阅读 · 0 评论 -
CSS中margin和padding的区别
本文导读:padding margin都是边距的含义,关键问题得明白是什么相对什么的边距.padding是控件的内容相对控件的边缘的边距.margin是控件边缘相对父空间的边距.在CSS中margin是指从自身边框到另一个容器边框之间的距离,就是容器外距离。在CSS中padding是指自身边框到自身内部另一个容器边框之间的距离,就是容器内距离。 下面讲解 padding和margin常转载 2016-09-24 21:47:17 · 239 阅读 · 0 评论 -
outline使用方法,outline与border的区别
在浏览器里,当鼠标点击或使用Tab键让一个链接或者一个radio获得焦点的时候,该元素将会被一个轮廓虚线框围绕。这个轮廓虚线框就是 outline 。outline 能告诉用户那一个可以激发事件的html元素获取了焦点,对钟爱键盘操作的用户尤其有意义。一个清晰悦目的outline设计能提高使用表单的用户体验。 另一方面,outline 也有些讨厌的地方,比如使用CSS设计的Tab(标签页)时,转载 2016-09-24 21:37:19 · 4029 阅读 · 0 评论 -
html Frame、Iframe、Frameset 的区别
首先讲解Frameset与Frame之间的区别。用来划分框架,每一个框架由标记。必须在之内使用,代码如下:在上面的例子当中,把页面分为左右两个部分,左侧框架中的页面是admin_left.htm,右侧框架中的页面是admin_center.htm。注意:标记的框架顺序为从左至右或从上到下。两者的差别如下: ● 为框架标记,说明该网页文档为框架组成,并设定文档中转载 2016-09-24 11:16:58 · 272 阅读 · 0 评论 -
DIV与SPAN之间有什么区别
DIV 和 SPAN 元素最大的特点是默认都没有对元素内的对象进行任何格式化渲染。主要用于应用样式表(共同点)。两者最明显的区别在于DIV是块元素,而SPAN是行内元素(也译作内嵌元素)。 详解:1.所谓块元素,是以另起一行开始渲染的元素,行内元素则不需另起一行,测试一下下面的代码你会有更形象的理解:测试紧跟前面的"测试"显示这里会另起一行显示 2.块元素和行内元素也不是一成不转载 2016-09-24 11:11:56 · 401 阅读 · 0 评论 -
DIV+CSS中标签ul ol li dl dt dd用法
ul ol li dl dt dd都是DIV+CSS做网页长用的东西,相当于一棵树的树技,下面就了解一下这些东西的全体用法,本人用dd,dt,dd用得很少,懂得结合使用对做架构是很有好处的哦!DIV CSS网页布局中常用的列表元素ul ol li dl dt dd释义,块级元素div尽量少用,和table一样,嵌套越少越好ol 有序列表。………………转载 2016-09-24 11:08:40 · 793 阅读 · 0 评论 -
一周极客热文:程序员给女朋友用HTML5制作的3D相册(附源码)
一个高大上的HTML5作品,是利用HTML5 canvas制作的3D图片展示。据说是程序员给自己女朋友做的。谁说程序员不懂浪漫!源码下载:CSDN下载频道或来自杨林枫的整理。一、 提升开发效率的十个工具Git——试一试。Stack Overflow——满足了它的活跃用户的虚荣心,而那些没有帐户的用户会不断的涌进来,找到他们满意的答案,并且点击推荐的广告。Office 365——转载 2016-11-05 13:40:20 · 15047 阅读 · 0 评论 -
Java日志框架slf4j、jcl、jul、log4j1、log4j2、logback大总结
1 系列目录jdk-logging、log4j、logback日志介绍及原理commons-logging与jdk-logging、log4j1、log4j2、logback的集成原理slf4j与jdk-logging、log4j1、log4j2、logback的集成原理slf4j、jcl、jul、log4j1、log4j2、logback大总结2各种jar包总结转载 2016-10-29 16:25:11 · 548 阅读 · 0 评论 -
Servlet
一、Servlet简介 Servlet是sun公司提供的一门用于开发动态web资源的技术。 Sun公司在其API中提供了一个servlet接口,用户若想用发一个动态web资源(即开发一个Java程序向浏览器输出数据),需要完成以下2个步骤: 1、编写一个Java类,实现servlet接口。 2、把开发好的Java类部署到web服务器中。 按照一种约定俗成的称呼习惯,通转载 2016-10-31 15:34:55 · 237 阅读 · 0 评论 -
jquery 实时监听输入框值变化
$('.div :input').live('input propertychange', function(){ var inputValue = $('#输入框id').val(); if(inputValue != null && inputValue != ""){ $('操作块的id').show(); }else{ $('操作块的id').hide();...原创 2018-10-24 15:34:32 · 1267 阅读 · 0 评论 -
html meta标签使用总结
meta标签作用META标签是HTML标记HEAD区的一个关键标签,提供文档字符集、使用语言、作者等基本信息,以及对关键词和网页等级的设定等,最大的作用是能够做搜索引擎优化(SEO)。PS:便于搜索引擎机器人查找、分类,互联网应用应该要注意。大网站都是怎么写?在了解这个标签之前,我查找了各个主流网站他们的对于Meta的设置,如下:京东首页的Meta设置:<meta ...转载 2018-10-19 15:22:27 · 167 阅读 · 0 评论 -
AngularJs错误http://errors.angularjs.org/1.2.9/$injector/unpr?p0=...
Error: [$injector:unpr] http://errors.angularjs.org/1.2.9/$injector/unpr?p0=contentCategoryServiceProvider%20%3C-%20contentCategoryServiceF/<@http://localhost:9101/plugins/angularjs/angular.min.j...原创 2018-09-18 21:15:23 · 2689 阅读 · 1 评论 -
点击弹窗提示,3秒后关闭窗口并跳转新开窗口
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"><原创 2018-09-07 16:35:23 · 10004 阅读 · 1 评论 -
鼠标移过图片的特效
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> div{ width: 300px; height:原创 2018-09-17 10:38:23 · 282 阅读 · 0 评论 -
关于select框下设置了disabled导致前台有值,但后台接收不到的情况记录
一、背景在项目(传统JSP)需要改版页面的时候,进入页面前先获取后台传过来的数据,但一部分数据需要设置不可编辑,select框是不支持readonly的,故将select加disabled,此时则引起了一些问题,后台取不到加了disabled属性的值。二、解决方案可能由于自己的前端偏弱(其实是以前没有好好学习),来看看W3C对disabled的说明定义和用法:disabled 属性规定应该禁用 ...原创 2018-07-14 11:03:35 · 2651 阅读 · 0 评论