- 博客(26)
- 收藏
- 关注
RSS订阅原创 Flex 布局教程：实例篇
转自：http://www.ruanyifeng.com/blog/2015/07/flex-examples.html上一篇文章介绍了Flex布局的语法，今天介绍常见布局的Flex写法。你会看到，不管是什么布局，Flex往往都可以几行命令搞定。我只列出代码，详细的语法解释请查阅《Flex布局教程：语法篇》。我的主要参考资料是Landon Schropp的文章和Solved by Flexbox。...
2018-06-28 15:28:51
127
1
原创 Flex布局教程---语法篇
转自：http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html网页布局（layout）是 CSS 的一个重点应用。布局的传统解决方案，基于盒状模型，依赖 display 属性 + position属性 + float属性。它对于那些特殊布局非常不方便，比如，垂直居中就不容易实现。2009年，W3C 提出了一种新的方案----Flex 布局，可...
2018-06-28 14:25:49
151
原创 图片水平垂直居中对齐的四种做法
转自http://caibaojian.com/img-vertical-middle.html原文链接：http://caibaojian.com/img-vertical-middle.html在前端开发制作中，图片垂直居中对齐是很常见的，有些是固定高度，有些没有固定高度，本文分享我用的四种方法，希望对你有所启发。以下说的做法暂不考虑IE浏览器的兼容性，适用于移动端，对兼容性感兴趣的可以看之前...
2018-06-26 19:17:34
3767
原创 css3变形属性transform，rotate（旋转）,translate（移动）,scale（缩放）,skew（扭曲）,matrix(矩阵)
原文链接原文链接：http://caibaojian.com/transform.html这个很简单，就跟border-radius一样，就是一个参数，同样是针对不同的浏览器有不同的私有属性。w3c上的例子是这样子写的：·div{transform:rotate(7deg);-ms-transform:rotate(7deg); /* IE 9 */-moz-transform:rotat...
2018-06-26 19:12:45
1455
转载 CSS 清除浮动，什么时候需要清除浮动，清除浮动都有哪些方法
转自：https://blog.csdn.net/zengyonglan/article/details/533044872. 清除浮动，什么时候需要清除浮动，清除浮动都有哪些方法 ？ 一.什么时候需要清除浮动？我们对元素进行了浮动(float)时，我们的元素就会脱离文档流，像一只小船一样漂流在文档之上。在 CSS 中，任何元素都可以浮动。浮动元素会生成一个块级框，而不论它本身是何种元素。 flo...
2018-06-26 19:02:14
4174
转载 background-size值为cover和值为100%的区别
background-size：100% 100%;---按容器比例撑满，图片变形；background-size：cover;---把背景图片放大到适合元素容器的尺寸，图片比例不变。IE8及以下版本用滤镜来兼容background-size如下:filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='bg.jpg', sizi...
2018-06-26 19:00:43
386
原创 理解CSS3中的background－size(对响应性图片等比例缩放)
转自：https://www.cnblogs.com/tugenhua0707/p/5260411.html理解CSS3中的background－size(对响应性图片等比例缩放)阅读目录background-size的基本属性给图片设置固定的宽度和高度的固定宽度400px和高度200px－使用background－size:400px 200px缩放设置固定宽度400px和高度200px－使用b...
2018-06-26 18:46:51
9652
3
原创 jQuery选择器总结
原文链接：http://caibaojian.com/jquery-selectors.htmljQuery选择器是jQuery库的一大特色，用这些选择器不但可以省去繁琐的JavaScript 书写方式，还可以节省时间和效率，正是有这些jQuery选择器，才让我们更容易的操作JavaScript的dom。·1).基本选择器·#id 根据给定的ID匹配一个元素。例如：$("#id") ·elemen...
2018-06-26 18:35:43
147
原创 swiper插件的使用demo
1.PC端，swiper2，滑动效果先要引入idangerous.swiper2.7.6.css和idangerous.swiper2.7.6.js（需要先引入jquery类库）；(1)html文件内容：<!-- 如果需要在图片可视区的周围添加一些样式，需要在外层套上一层<div> --><div class="mywrapper"> <!--...
2018-06-26 18:01:13
676
原创 jQuery中prop的用法
添加并移除名为 "color" 的属性：$("button").click(function(){ var $x = $("div"); $x.prop("color","FF0000"); $x.append("The color 属性： " + $x.prop("color")); $x.removeP
2018-06-26 17:57:50
5001
转载 使用jquery获取url及url参数的方法
参考： https://www.cnblogs.com/babycool/p/3169058.html使用jquery获取url以及使用jquery获取url参数是我们经常要用到的操作1、jquery获取url很简单，代码如下：window.location.href;其实只是用到了javascript的基础的window对象，并没有用jquery的知识。2、jquery获取url参数比较复杂，要...
2018-06-26 17:38:36
240
原创 如何获取data-id中的值，data-id的具体用法
转自https://blog.csdn.net/ke3863834/article/details/76944265一般data-id用于一些菜单栏的匹配，例如下面这个：12 //一级菜单 <div class="wrap" id="test"> <ul> <li data-id="a"><span>手机 /
2018-06-26 17:31:48
32632
转载 JS选择器querySelector和~All，三个原生选择器
转自https://blog.csdn.net/major_zhang/article/details/78118823比较高级的万能选择器，比较常用定义：querySelector() 方法返回文档中匹配指定 CSS 选择器的一个元素。注意： querySelector() 方法仅仅返回匹配指定选择器的第一个元素。如果你需要返回所有的元素，请使用 querySelectorAll() 方法替代。...
2018-06-08 23:53:54
4470
原创 js数组去重方法总结
转自：https://www.cnblogs.com/guangyan/articles/6682686.html1 //方法一 2 var arr = [1,23,1,1,1,3,23,5,6,7,9,9,8,5]; 3 function removeDuplicatedItem(arr) { 4 for(var i = 0; i < arr.length-1; i++){ ...
2018-06-08 23:07:53
125
原创 如何写出高性能的DOM
转自：http://34585f3f.wiz03.com/share/s/0Qm5Y_0RRQtc2F-3Zy2piy1K0E4QKp0IAQvZ2PEFvB08u3fM为什么要写高性能DOM？一个网站，在页面上承载最多内容的就是DOM，而且无论是我们通过加载JS、加载图片，他们也是通过写HTML标签来实现的。而我们性能优化要做的无非就是几大块：站点的网络消耗DOM的初始化过程（浏览器）DOM的结...
2018-06-08 21:28:54
264
转载 前端面试题1
0.谈谈对前端安全的理解，有什么，怎么防范前端安全问题主要有XSS、CSRF攻击XSS：跨站脚本攻击它允许用户将恶意代码植入到提供给其他用户使用的页面中，可以简单的理解为一种javascript代码注入。XSS的防御措施：过滤转义输入输出避免使用eval、new Function等执行字符串的方法，除非确定字符串和用户输入无关使用cookie的httpOnly属性，加上了这个属性的cookie字段...
2018-06-08 21:01:58
241
原创 BFC的相关问题
转自：https://www.jianshu.com/p/28e783b44851写页面时会遇到：子元素float父元素的高度不会撑开;在布局时，box1and box2,其中box1 float：left，这是box2会在box1下面，(如果文字过多就会形成文字环绕效果)，但我就是想要box2在box1的右侧;又或是上下两个box的margin重叠。这些问题除了其他一些方法解决外，都可以利用加上...
2018-06-08 21:00:44
223
转载 SublimeText3常用快捷键和优秀插件
SublimeText是前端的一个神器，以其精简和可DIY而让广大fans疯狂。好吧不吹了直入正题 -_-!!首先是安装，如果你有什么软件管家的话搜一下就好，一键安装。然后，有钱的土豪就自己买个吧，穷逼就搜下注册码看下有没有土豪共享咯。既然是神器，肯定有你不知道的东西不是，下面这部分来讲操作。PS：部分图片和文字来自网络，这里只是略微排版方便查阅。测试操作系统：Win10 / Ubuntu 14....
2018-06-07 09:44:22
148
转载 DAO层，Service层，Controller层、View层协同工作机制
DAO层：DAO层主要是做数据持久层的工 作，负责与数据库进行联络的一些任务都封装在此，DAO层的设计首先是设计DAO的接口，然后在Spring的配置文件中定义此接口的实现类，然后就可在模块中调用此接口来进行数据业务的处理，而不用关心此接口的具体实现类是哪个类，显得结构非常清晰，DAO层的数据源配置，以及有关数据库连接的参数都在 Spring的配置文件中进行配置。Service层：Service层...
2018-06-03 20:26:14
358
原创 Java Web会话机制，Cookie和Session详解
一、会话机制 Web程序中常用的技术，用来跟踪用户的整个会话。常用的会话跟踪技术是Cookie与Session。Cookie通过在客户端记录信息确定用户身份，Session通过在服务器端记录信息确定用户身份。 一次会话指的是：就好比打电话，A给B打电话，接通之后，会话开始，直到挂断电话，该次会话就结束了，而浏览器访问服务器，就跟打电话一样，浏览器A给服务器发送请求，访问web程序，该次...
2018-06-03 18:08:33
93
转载 http的无状态无连接到底是什么含义
无连接：服务器处理完客户的请求，并收到客户的应答后，即断开连接。早期这么做的原因是HTTP协议产生于互联网，因此服务器需要处理同时面向全世界数十万、上百万客户端的网页访问，但每个客户端（即浏览器）与服务器之间交换数据的间歇性较大（即传输具有突发性、瞬时性），并且网页浏览的联想性、发散性导致两次传送的数据关联性很低，如果按照上面的方式则需要在服务器端开的进程和句柄数目都是不可接受的，象paranoi...
2018-06-03 18:06:45
257
转载 request.getRequestDispatcher在web内的转向和reponse.sendRedirect()的区别
表示使用转发的方法，把request,response对像，传递给下一个serveltSrequest.getRequestDispatcher("//");把request传到下一个页面；forward使用rational rose软件绘图umlforward是在web服务器发生的。request.getRequestDispatcher("http://www.qq.com").forward...
2018-06-03 17:31:24
2009
转载 bootstrap中table插件具体介绍
bootstrap的table属性已经很熟悉了，最近遇到一个问题，犹豫每个列表加载的数据需求不同，所以需要动态的更换表头。 网上有很多加载表格数据的例子，但是却没有找到如何动态加载表格，再加在数据。 虽然可以一个表格加载一种数据，但是本着学习的态度尝试了下这种方式，结果发现是可以执行的。分享下思路和实现过程，以备日后使用。1、思路：1、写接口，查询出要展示的列。注意接口中必须要有字段中文名称（co...
2018-06-01 17:43:27
779
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人