WEB小牛-CSDN博客

转载 css清除浮动大全

css清除浮动大全，共8种方法。浮动会使当前标签产生向上浮的效果，同时会影响到前后标签、父级标签的位置及 width height 属性。而且同样的代码，在各种浏览器中显示效果也有可能不相同，这样让清除浮动更难了。解决浮动引起的问题有多种方法，但有些方法在浏览器兼容性方面还有问题。下面总结8种清除浮动的方法（测试已通过 ie chrome firefox opera，后面三种方法只做了解就可以了

2016-02-20 15:57:32 318

原创 margin-top 失效的问题

其实关于这个问题，老生常谈了。在这里说说因仅仅是因为想更加深刻的理解一下。<!doctype html><html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <style> *{ margin:0; padding:0;} .box{ width:400px; he

2016-02-19 13:33:12 3474

原创移动端a标签点击图片有阴影处理

移动端我们在点击页面中的一些图片的时候会出现阴影。处理方法只要给a标签加上a { -webkit-tap-highlight-color: transparent; -webkit-touch-callout: none; -webkit-user-select: none;}

2016-02-19 08:52:34 3873

转载 ios系统和某些移动端background-attachment:fixed不兼容性

ios系统和某些移动端background-attachment:fixed不兼容性，没有任何效果，但可以hack一下就可以了，代码如下:ps：想在哪个标签加背景，可以在它class后:before.body:before { content: ' '; position: fixed; z-index: -1; top: 0; right: 0; bottom: 0;

2016-02-18 17:15:10 1538

原创弹窗开启以及关闭（“closest”用法）

代码中关键的一个用法就是closest的用法。我的理解就是“过滤”，当我我们点击屏幕中黑色的部分的时候，检测当前点击的是不是弹框的部分。也就是 target.closest(“#pop”).length == 0 。如果等于0的话就说明不是弹框区域的内容就触发关闭事件。<!doctype html><html lang="en"> <head> <meta charset="UTF-8">

2016-02-03 13:17:35 1823 1

转载 js实现touch移动触屏滑动事件

在开始描述touch事件之前，需要先描述一下多触式系统中特有的touch对象（android和iOS乃至nokia最新的meego系统都模拟了类似的对象）。这个对象封装一次屏幕触摸，一般来自于手指。它在touch事件触发的时候产生，可以通过touch event handler的event对象取到移动端触屏滑动的效果其实就是图片轮播，在PC的页面上很好实现，绑定click和mouseover等事

2016-02-01 09:46:59 10123 2

原创 jQuery-Mobile学习（表单）

form 元素必须有一个 method 和一个 action 属性每个表单元素必须有一个唯一的 “id” 属性。id 必须是整个站点所有页面上唯一的。这是因为 jQuery Mobile 的单页导航机制使得多个不同页面在同一时间被呈现每个表单元素必须有一个标签。设置标签的 for 属性来匹配元素的 id。如果我们不想显示label值得话，就给label加上class ui-hidden-acce

2016-01-18 22:26:47 507

原创页面中最常用的弹框。自适应。适合移动端。

我们经常会很头疼如何实现一个对象自然的居中。正好显示在窗口的中间部分。我也是刚刚好好研究了一份。才发现这其中的奥妙。顿时觉得豁然开朗。前提1：我们讨论的是当弹框的宽度为百分比，高度根据内容自适应，条件下。（我想大家肯定是先想了解这种情况下的内容）思路：其实我们要想实现居中的效果，无非最主要的就是获得弹框定位的左边。我们的弹框一般是相对定位。那么我们如何获得弹框的left和top值呢。那么我们

2016-01-12 22:43:55 12550

原创 jQuery-Mobile学习（弹窗）

很开心能学到这个地方。因为我一直觉得做一个很酷很炫的弹窗是一件很令人开心舒服的事情。从前面的几次学习可以了解，在JQuery-Mobile中data-rel通常用来表示某种调用关系,比如返回之前页面的按钮就是data-rel=“back”.a标签中的href属性值一般可以实现id值或者页面跳转。data-role则一般是定义某个部分的角色。我一般从单词理解。其次我们还学习了data-po

2016-01-11 23:08:55 2318

原创 jQuery-Mobile学习（按钮）

一、按钮样式一般我们常写的三种按钮样式写法分别是给a标签添加样式；给input设置为button值；最后就是直接用button标签。一般我们的按钮都是行内框。JQuery-Mobile里的按钮都是块级元素 <div data-role="page" > <div data-role="header"> <h1>这是页头</h1> </div>

2016-01-07 22:33:40 1075 2

原创 jQuery-Mobile学习（页面）

一、基础样式首先页面三个基础的样式。 <div data-role="page"> <div data-role="header"> <h1>这是页头</h1> </div> <div data-role="main"> <p>这是主体</p> </div> <div

2016-01-07 21:38:56 640

原创 vertical-align 的用法

vertical-align 属性设置元素的垂直对齐方式。 middle是居中，top是顶部，bottom是底部<!doctype html><html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style> p{ border:1px solid blue;} img{ ver

2015-12-24 13:20:05 1150 1

WEB_HW