自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

一步步进步的前端

只为了分享工作中的点点滴滴

  • 博客(27)
  • 收藏
  • 关注

原创 box-sizing

box-sizing有两个属性值content-box和border-box,content-box实际上就是宽高不包括内部不白区域和边框宽高;border-box全包。

2014-03-21 15:33:52 530

原创 display:block/inline/inline-block/inline-table/list-item区别

大家都知道 display:block是显示成块状,独占一行;而inline是行内的意思,会根据里面的内容大小而改变;那display:inline-block实际就是inline可以定义宽高,但是重点是我试了一下,ie6、7不支持这个样式。

2014-03-21 10:54:55 5966

原创 给移动端和pc端不同的展现形式

New Document              function browserRedirect() {                  var sUserAgent = navigator.userAgent.toLowerCase();                  var bIsIpad = sUserAgent.match(/ipad/i) == "ipa

2014-01-14 10:51:57 1542

原创 jquery $(window).height()和$(window).width()指的是什么

浏览器可视窗口的高度和宽度。

2014-01-09 16:36:05 2601

原创 固定高度块状漂浮元素上下居中

固定高度块状元素上下居中以为必须借助js才能实现,原来可以.play-button{position: absolute;top: 50%;left: 50%;height: 149px;width: 149px;margin-left: -72px;margin-top: -72px;}各浏览器都支持

2014-01-09 15:34:32 1128

原创 yiyin99

xmlns="http://www.w3.org/1999/xhtml">  http-equiv="Content-Type" content="text/html; charset=utf-8" /> 弈音科技_杭州录音棚/配音/音乐制作/企业歌曲/MV、宣传片制作--弈音科技 content="杭州录音棚, 录歌, 配音, 配乐

2013-12-31 10:41:16 1366

转载 CSS3 Transform

Transform字面上就是变形,改变的意思。在CSS3中transform主要包括以下几种:旋转rotate、扭曲skew、缩放scale和移动translate以及矩阵变形matrix。下面我们一起来看看CSS3中transform的旋转rotate、扭曲skew、缩放scale和移动translate具体如何实现,老样子,我们就从transform的语法开始吧。语法: tra

2013-12-20 11:39:45 688

转载 CSS3 Transition

上一节花了大篇幅整理了CSS3中动画属性中的Transform,今天我们接着一起来看CSS3动画属性中的另一个属性Transition。W3C标准中对css3的transition这是样描述的:“css的transition允许css的属性值在一定的时间区间内平滑地过渡。这种效果可以在鼠标单击、获得焦点、被点击或对元素任何改变中触发,并圆滑地以动画效果改变CSS的属性值。”下面我们

2013-12-20 11:38:34 679

转载 JQuery Mobile事件详解

“jQuery Mobile 在基于本地事件上,创建了一系列的自定义事件,大部分事件是基于触摸设备的使用情况开发的,当然这些事件对于桌面环境也会有适当的处理,开发者可以使用 bind() 函数绑定到需要的页面对象中。值得注意的是,jQuery Mobile 是基于 Ajax 导航的,所以采用 bind() 方法绑定的事件无法作用于 Ajax 产生的网页元素中,因此建议开发者使用动态绑定的方

2013-12-20 10:03:24 3120

转载 jQuery Mobile

因为 jQuery Mobile 使用了渐进增强的设计理念,因而它所支持的系统与平台也很广泛,能提供 A 级支持(支持全部的增强的体验,包括基于 Ajax 的动画页面转场)的有以下平台:Apple iOS 3.2-5.0Android 2.1-2.3 , 3.1, 4.0Windows Phone 7-7.5Blackberry 6.0 , 7Blackbe

2013-12-20 09:49:45 1518

原创 背景色透明rgba

background: rgba(0, 0, 0, 0.5);与background-color:#000; opacity:0.5;之间的差别就是 下面的会传递给子元素,假设这个盒子里有文字,文字就会是半透明的,而上者就杜绝了这个问题,大多是浏览器都支持,但是ie9以下不支持上面的。

2013-12-19 17:15:23 1509

转载 ipad iphone横屏竖屏

iPad是四方型的,应该是可以划分横向和竖向的,那就像怎样让ipad自己能够在从横向变到竖向时,css发生变化呢。经过多方查证media="all and (orientation:portrait)"可以判断出屏幕处于竖向,media="all and (orientation:landscape)"可以判断出屏幕处于横向,知道了这两种就可以更换css了,在head里写入下列两行就能实现css切

2013-12-19 14:04:31 1898

原创 css画个三角形-边框透明

em{position: absolute; top:10px; display:block; font-size:0;}.em1{border:6px solid transparent; _border-color:tomato; /*For IE6-*/ _filter:chroma(color=tomato);/*For IE6-*/border-right:6px solid #B9

2013-12-19 14:03:17 1855

原创 window.onload与$(document).ready()区别

window.onload全部元素都可以操作$(document).ready()当html下载完并解析为DOM树后,代码就可以运行了(并不意味所有关联的文件都已经下载完毕)。所以样式表应放在js前面。

2013-12-19 14:01:37 752

原创 IE6 PNG图片

background:url(png24-video-normal.png) no-repeat;_filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,sizingMethod=scale,src=png24-video-normal.png);_background: 0;

2013-12-19 14:00:31 530

原创 文字省略号

white-space:nowrap; text-overflow:ellipsis;overflow:hidden;省略号问题...ie6也是可以支持省略号的,但是,一定要给宽度,所以不适合移动终端使用。

2013-12-19 13:59:01 615

原创 Jquery中的this与$(this)

this,表示当前的上下文对象是一个html对象,可以调用html对象所拥有的属性,方法 $(this),代表的上下文对象是一个jquery的上下文对象,可以调用jquery的方法和属性值。

2013-12-19 13:51:37 543

原创 加入收藏夹,设为首页代码

把以下代码加入相应位置:加入收藏设为首页

2013-12-19 11:45:24 557

原创 ie6兼容问题-最小高度

height:auto!important;  height:500px;  min-height:500px;min-height:100px;这一句在ie7和FF已经可以正常显示了。。_height:100px这一句在ie6测试显示正常

2013-12-19 11:44:35 826

原创 removeClass、hover、toggle

removeClass当省略参数时,该方法移除元素所有的类。先执行移除类,再执行添加类,以便它不会撤销几乎同时执行的添加类。 hover,toggle是复合事件处理程序,接受两个参数。

2013-12-19 11:38:38 964

原创 noConflict多库冲突解决方法

JQuery.noConflict();把$标示符的控制权过渡给其它库。jQuery(document).ready(function($){})可重新命名jQuery为$,而不必担心冲突。

2013-12-19 11:37:02 733

原创 图片默认等比例大小

img设置成width:100%,高度也会按照原来比例,扩大,缩小。

2013-12-19 11:36:05 1092

原创 box-sizing

box-sizing:content-box;box-sizing:border-box;(css3)一般整体的宽度是内容宽度加上padding值加上边框;而是用box-sizing整体宽度就是你定义的width值,不受padding和border的影响另.form-signin input[type="text"],.form-signin input[typ

2013-12-19 11:34:40 690

原创 ie6 hover 背景图闪动css解决方法

html {         zoom: expression(function(ele){                     ele.style.zoom = "1";                     document.execCommand("BackgroundImageCache", false, true);         }(this));}

2013-12-19 11:23:15 1423

原创 css加号、冒号、波浪号的用法

li:hover+li{ background-color:#000;} 123“+”    始终把样式给下一个,这样就可以做到菜单上下一个菜单项没有边框的效果啦,最求真相,嘿嘿  input:focus{background-color:#03C} p~p{background-color:#03C}兄弟选择器,只选择 后面的兄弟p:first-chi

2013-12-19 11:22:06 7623

原创 ipad 按钮切换时 有闪动效果

今天弄ipad发现切换的时候 切换按钮会有闪一下效果 好像那种被选中的阴影一样, 决定应该去掉它 对比一下其他的网站,发现加了* { -webkit-tap-highlight-color:rgba(0,0,0,0); }这个就好了。

2013-12-19 11:17:38 1147

转载 分享 JS在firefox和IE下差异及解决方案

1.document.formName.item(itemName) 问题说明:IE下,可以使用 document.formName.item(itemName)或 document.formName.elements[elementName];Firefox下,只能使用 document.formName.elements[elementName].解决方法:统一使用document.f

2013-12-19 11:14:27 626

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除