学习笔记
mumu42
这个作者很懒,什么都没留下…
展开
-
清除浮动的两种方式
方法一:当一个父类标签中的子类标签使用了浮动,而父类标签需要占有和子类标签的空间时,父类标签添加overflow:hidden;属性即可。方法二:我们知道,当上一个标签使用了浮动属性之后,设置了浮动属性标签的下一个标签总是会受到上一个标签浮动属性的影响,而要消除这种影响,只需要在浮动标签的下一个标签(不能是行级标签)设置clear:both;即可。原创 2017-07-29 15:12:49 · 308 阅读 · 0 评论 -
js基础知识
//设置全局变量var $ = function (id) { return document.getElementById(id); };$('idName');//获取元素内容1.元素.innerHTML2.元素.innerText//添加内容1.元素.innerHTML+="<a>a</a>";$("").htm...原创 2018-04-04 18:40:51 · 182 阅读 · 0 评论 -
css设置小于12像素的字体
css设置小于12像素字体:一、html{-webkit-text-size-adjust:none;//旧版本的webkit内核的浏览器是支持,新版的webkit内核的浏览器已经不再支持这个属性}二、.class{transform: scale(0.5);//并不是真的小于12像素,只是在原来的基础上进行缩小了}...原创 2018-04-12 09:38:22 · 6647 阅读 · 0 评论 -
css实现鼠标移入移出动态效果
知识点:transform-origin兼容性:IE10以上原文链接<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title></title> <style> div { position: absolute;转载 2018-05-02 17:20:32 · 8366 阅读 · 0 评论 -
前端开发常用代码片段
作者:WEBINGsegmentfault.com/a/1190000014700549一、预加载图像如果你的网页中需要使用大量初始不可见的(例如,悬停的)图像,那么可以预加载这些图像。二、检查图像是否加载有时为了继续脚本,你可能需要检查图像是否全部加载完毕。你也可以使用 ID 或 CLASS 替换<img> 标签来检查某个特定的图像是否被加载。三、自动修复破坏的图像逐个替换已经破坏的...转载 2018-05-08 10:57:48 · 255 阅读 · 0 评论 -
js使用MD5加密
下载md5引入md5文件:<script src="md5.js"></script><script> var pwd=hex_md5("pwd_string");</script>原文链接转载 2018-05-25 15:56:39 · 2292 阅读 · 0 评论 -
闭包的简单应用
for(var i=0;i<5;i++){ setTimeout(function(){ console.log(i); },i*1000);};输出结果:55555//异步问题(javascript是单线程语言,先同步任务,所有同步任务执行完毕再执行队列中的异步任务)for(var i=0;i<5;i++){ (function(x){ ...转载 2018-05-21 18:05:31 · 138 阅读 · 0 评论 -
轮播图2
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <script type="text/javascript" src="sta转载 2018-07-03 17:04:15 · 176 阅读 · 0 评论 -
类走马灯缓动效果
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style> .proListSub { width: 1190px; margin: 0px auto; po原创 2018-07-04 09:46:20 · 752 阅读 · 0 评论 -
类走马灯效果轮播(jquery)
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style> .proListSub { width: 1190px; margin: 0px auto; po原创 2018-07-05 15:41:52 · 2518 阅读 · 2 评论 -
根据name属性查找到相关的表单元素
html:<form name="a"> <input name="b"/></form>js:console.log(document.a.b);结果:兼容性:无兼容性问题前提条件:必须是表单元素并且必须在form元素下原创 2018-04-17 17:15:45 · 618 阅读 · 0 评论 -
js页面刷新
重新刷新window.location.reload() 关闭当前窗口 window.opener=null;window.open('about:blank','_self');window.close();原创 2018-04-02 16:21:29 · 149 阅读 · 0 评论 -
css基础
一、css精灵图:优点:减少网页的http请求,从而大大的提高页面的性能;CSS Sprites能减少图片的字节二、overflow参数:scroll:必会出现滚动条。auto:子元素内容大于父元素时出现滚动条。visible:溢出的内容出现在父元素之外。hidden:溢出隐藏。三、图片png是便携式网络图片(Portable Network Graphics)...转载 2018-03-21 18:15:05 · 246 阅读 · 0 评论 -
字体图标
字体图标网站:www.iconfont.cn字体文件类型:.woff、.ttf、.svg、.eot例:@font-face {font-family:"myFontName";src: url("…….eot") format('embedded-opentype'),url('…….woff') format('woff'),url('…….ttf') for原创 2017-08-11 20:55:14 · 337 阅读 · 0 评论 -
javaScript:函数
函数:可以重复使用的代码块(不调用,不执行)函数的定义:1、关键字定义:function funName(){//函数体} //调用:funName();2、函数直接量定义:var funName=function(){//函数体} //调用:funName();3、构造函数:var funName=new Function("");原创 2017-08-12 11:40:40 · 165 阅读 · 0 评论 -
html:自定义列表(dl>dt+dd)的使用
以前用的都有用无序列表ul>li比较多,看了授课老师的写的代码才又重新认识了自定义列表,例如以下布局用自定义列表标签就相当方便:只需要定义四个dl标签,在dt标签内添加分别添加相应的图片,在dd标签内添加p标签或者span标签或者其他可以添加文字的标签,再给dt和dd添加浮动属性(float:left;)即可。不过值得注意的是dd标签内可以添加任意其他标签,但是dt标签原创 2017-07-28 19:34:20 · 9417 阅读 · 1 评论 -
屏幕自适应
从事前端开发的工作者都知道,一个网页的宽高通常都是固定的。而如果我们设置了固定的宽高,当屏幕大小发生变化或者用户设备的显示器大小与开发者的设备显示器不一时,用户则需要滑动上下左右滚动条才能浏览整个网页。而如果我们设置宽高为100%同时又设置了背景图或者背景颜色,那么只有浏览器窗口大小就决定了背景图或者背景颜色的填充大小,而网页的超出部分将会默认为白色就会显得非常难看。如下图:正常显原创 2017-07-29 11:37:06 · 304 阅读 · 0 评论 -
HTML:利用border写出三角形的三种方法
第一种方法:需要多大的三角形就设置相应像素的border值,然后将其中三个方向的边框颜色设置为透明或者将边框颜色设置为与背景相同的颜色即可。例如:*{margin: 0;padding: 0;}div{width: 0;border: 50px solid red;border-bottom-color:transparent ;/*设置下边原创 2017-07-28 19:18:37 · 5381 阅读 · 0 评论 -
与scroll相关的兼容性问题
谷歌浏览器写法:document.body.scrollTop火狐、IE浏览器写法:document.documentElement.scrollTop火狐、谷歌、IE9+浏览器写法:window.pageYoffset/window.pageXoffset兼容性写法:var scrollTop = window.pageYOffset ||document.documentE原创 2017-08-21 12:02:12 · 678 阅读 · 0 评论 -
HTML:margin塌陷现象的解决
设置子元素的margin,父元素也具有与子元素相同的margin值,称之为塌陷现象。原创 2017-07-29 13:29:00 · 8862 阅读 · 2 评论 -
隐藏滚动条
隐藏滚动条并且页面无法实现滚动js写法:document.documentElement.style.overflowY = 'hidden';css写法:overflow-y:scroll;隐藏滚动条并且页面依然滚动(有兼容性,只有谷歌浏览器可以使用)::-webkit-scrollbar { width: 0px;}原创 2017-08-30 16:48:24 · 241 阅读 · 0 评论 -
js兼容性问题整合
关于JavaScript中兼容性问题的解决方法的整合原创 2017-08-17 16:48:29 · 270 阅读 · 0 评论 -
vue.js常用的事件修饰符
.stop.prevent.capture.self.once.enter.tab.delete (捕获 “删除” 和 “退格” 键).esc.space.up.down.left.right转载 2018-02-06 15:27:40 · 259 阅读 · 0 评论 -
jquery ui(datepicker快速使用)
一、准备下载需要的jquery_ui.js&jquery_ui.css下载需要的jquery.js建立html文件引入相关的js、css文件添加input标签,并设置相关属性二、API(常用)属性1、dateFormat(设置日期格式:默认(dd-mm-yy))设置:$('.inputClassName').datepicker({dateFormat:'yy-mm-dd'})或者$('....原创 2018-07-12 16:26:17 · 5468 阅读 · 0 评论