2018年04月_南城夏季

转载 CSS媒体查询

一个媒体查询由一个可选的媒体类型和零个或多个使用媒体功能的限制了样式表范围的表达式组成，例如宽度、高度和颜色。媒体查询，添加自CSS3，允许内容的呈现针对一个特定范围的输出设备而进行裁剪，而不必改变内容本身。语法媒体查询包含一个可选的媒体类型和，满足CSS3规范的条件下，包含零个或多个表达式，这些表达式描述了媒体特征，最终会被解析为true或false。如果媒体查询中指定的媒体类型匹配展示文档所使...

2018-04-19 20:05:03 242

转载微信小程序 swiper组件详解及实例代码

微信小程序 swiper组件常用属性：效果图：wxml123456789101112<swiper indicator-dots="{{indicatorDots}}" autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}} " bindchange="bindchangeTag"> &l

2018-04-18 19:11:42 3594

转载三张图搞懂JavaScript的原型对象与原型链

对于新人来说，JavaScript的原型是一个很让人头疼的事情，一来prototype容易与__proto__混淆，二来它们之间的各种指向实在有些复杂，其实市面上已经有非常多的文章在尝试说清楚，有一张所谓很经典的图，上面画了各种线条，一会连接这个一会连接那个，说实话我自己看得就非常头晕，更谈不上完全理解了。所以我自己也想尝试一下，看看能不能把原型中的重要知识点拆分出来，用最简单的图表形式说清楚。我...

2018-04-16 09:09:30 134

原创 white-space: nowrap用法

white-space: 值描述normal默认。空白会被浏览器忽略。pre空白会被浏览器保留。其行为方式类似 HTML 中的 <pre> 标签。nowrap文本不会换行，文本会在在同一行上继续，直到遇到 <br> 标签为止。pre-wrap保留空白符序列，但是正常地进行换行。pre-line合并空白符序列，但是保留换行符。inherit规定应该从父元素继承 white-s...

2018-04-14 17:46:13 30372

原创 $(document)和$(window)各是什么意思

jquery中的对象$(document) 是当前文档，就是你看到的整个网页$(window) 如果没有框架则就是你浏览的当前浏览器的窗口

2018-04-14 16:50:48 1111

原创 http-equiv 属性http-equiv="Content-Type"

http-equiv 属性提供了 content 属性的信息/值的 HTTP 头。http-equiv 属性可用于模拟一个 HTTP 响应头。值描述content-type规定文档的字符编码。实例：<meta http-equiv="content-type" content="text/html; charset=UTF-8">default-style规定要使用的预定义的样式表。实...

2018-04-13 23:50:19 3652

原创 rem根据屏幕宽度来调整html根元素的font-size

使用rem作为单位写页面：用rem作为页面的宽高单位就可以根据屏幕宽度的变化来及时适应。根据屏幕宽度来调整html根元素的font-size（即rem）需要一段js代码：(function (doc, win) {var docEl=doc.documentElement; //documentElement 属性是根节点resizeEvt='orientationchange' ...

2018-04-13 17:10:01 7950

转载 document.documentElement.style用法

1.document.documentElement.style 属性定义了当前浏览器支持的所有Css属性包括带前缀的和不带前缀的例如：document.documentElement.style.fontSize2.判断浏览器是否支持制定的css属性function support(cssName) { var htmlStyle = document.documentElement.s...

2018-04-12 22:10:09 12379

原创 (function($,window,document){.......})用法

这是jQuery写插件的书写方法。function($,window,document)这三个参数的意思是：①$ 是把jQuery传进来，这样你可以在function中可以继续使用$作为jQuery的引用②window 把当前的window（窗口）对象传进来③document 把当前的dom对象传进来，这样你可以操作dom对象。html的所有元素都属于dom对象的范畴作用：主要传递jque...

2018-04-12 21:58:08 3895

原创 addEventListener("touchend", function ()_

var div=document.getElementById('div');div.addEventListener('touchstart',function(e){ //touchstart:触摸开始的一瞬间，这里的e包含的触摸一瞬间所触摸的元素的信息});div.addEventListener('touchmove',function(e){ //touchmove:触摸进行...

2018-04-03 22:32:34 3824

原创 HTML5触摸事件(touchstart、touchmove和touchend) （转）

　HTML5中新添加了很多事件，但是由于他们的兼容问题不是很理想，应用实战性不是太强，所以在这里基本省略，咱们只分享应用广泛兼容不错的事件，日后随着兼容情况提升以后再陆续添加分享。今天为大家介绍的事件主要是触摸事件：touchstart、touchmove和touchend。　　一开始触摸事件touchstart、touchmove和touchend是iOS版Safari浏览器为了向开发人员传达一...

2018-04-03 22:30:38 150

原创 onscroll 事件

<div> 元素滚动时执行 JavaScript<div onscroll="myFunction()">定义和用法onscroll 事件在元素滚动条在滚动时触发。提示：使用 CSS overflow 样式属性来创建元素的滚动条。...

2018-04-03 09:48:35 933

原创页面添加锚点的三种方式

HTML中的链接，正确的说法应该称作"锚点"，它命名锚点链接（也叫书签链接）常常用于那些内容庞大繁琐的网页，通过点击命名锚点，不仅让我们能指向文档，还能指向页面里的特定段落，更能当作"精准链接"的便利工具，让链接对象接近焦点。便于浏览者查看网页内容。类似于我们阅读书籍时的目录页码或章回提示。在需要指定到页面的特定部分时，标记锚点是最佳的方法。　　锚点链接对SEO的作用　　锚链接是一个非常重要的概念...

2018-04-02 21:47:55 1030

原创 css3 box-orient 属性

水平排列 div 元素的子元素：div{width:350px;height:100px;border:1px solid black;/* Firefox */display:-moz-box;-moz-box-orient:horizontal;/* Safari、Opera 以及 Chrome */display:-webkit-box;-webkit-box-ori...

2018-04-02 15:15:52 208

转载浮动、绝对定位脱离文档流的区别

所谓脱离文档流，即将元素从普通的布局排版中拿走，其他盒子在定位的时候，会当没看到它，两者位置重叠都是可以的。这里，通过讲解浮动脱离文档流（float）和绝对定位脱离文档流（position:absolute）的区别，让大家对这一概念有更深的认识。一、浮动脱离文档流使用float脱离文档流时，其他盒子会无视这个元素，但其他盒子内的文本依然会为这个元素让出位置，环绕在周围。我们先利用下面代码在普通流...

2018-04-01 23:59:45 908

原创 CSS3 transition 属性

transition：[ transition-property ] || [ transition-duration ] || [ transition-timing-function ] || [ transition-delay ]默认值：看每个独立属性适用于：所有元素，包含伪对象:after和:before继承性：无检索或设置对象中的参与过渡的属性[ transition-duration...

2018-04-01 22:17:27 174

原创移动终端H5页面meta标签的设置

2018-04-01 19:54:16 621

weixin_39818813的博客