SS'Blog - SS'Blog

PHP THAT DOESN'T HURT. CODE HAPPY & ENJOY THE FRESH AIR.

HAPPY NEW YEAR !

Laravel
StudyScript.com

@font-face 字体图标

@font-face语句是css中的一个功能模块,用于实现网页字体多样性的模块(设计者可随意指定字体,不需要考虑浏览者电脑上是否安装)。而由于网页中使用的字体类型,也是各浏览器对字体类型有不同的支持规格。 字体格式类型主要有几个大分类:TrueType、Embedded Open Type 、Ope ······
阅读全文

JS和CSS优化工具Minify

Minify 是一个 PHP5 的应用,可让网站更加符合 Yahoo 的:Rules for High Performance Web Sites.  Minify可以按需对JavaScript以及CSS文件进行合并、压缩以及缓存,以加快页面的载入速度。安装minify极其简单,只需在网站根 ······
阅读全文

DNS预解析技术dns-prefetch

在WEB开发中DNS优化分两点:一是减少DNS的请求次数。第二个就是进行DNS预先获取:为加快DNS域名解析速度,dns-prefetch会对网页所有链接先做域名解析 当访问一个网站如 www.studyscript.com 时,需要将这个域名先转化为对应的 IP 地址,这是一个非常耗时的过程。DN ······
阅读全文

Retina显示图片设置

简单的javascript方法1绝对简单的方法,就是使用retina.js脚本来控制调用Retina图像。简单点说,retina.js会自动检查你图片目录中的”@2x“图像,然后在Retina设备下替换普通的图片。CSS修改方法123456@media only screen and (-webki ······
阅读全文

方便json数据查看页面调试--扩展程序JSONView

为了方便浏览器在测试代码时查看json查看数据,推荐一款浏览器插件神器。: 浏览器中可以查看从服务器端传回来的json数据,这些数据可能没有经过格式化的,也或者是经过了unicode编码,没有缩进,没有换行等等,造成阅读有一定困难。 JSONView可以自动对json数据转码,缩进,格式化 ······
阅读全文

浏览器调试工具

前端开发调试工具、样式使用、js脚本使用情况、使用率。 谷歌浏览器前端开发调试神器 http://www.cnblogs.com/moonvan/archive/2011/12/09/2282710.html ······
阅读全文

让谷歌浏览器支持本地json

出于安全考虑谷歌浏览器会限制本地json 在快捷方式后面加--disable-web-security(注意前面要有个空格) C:\Users\Administrator\AppData\Local\Google\Chrome\Application\chrome.exe --disab ······
阅读全文

设置多显示器显示

按“win”字键+“P” 即可。(复制、扩展、投影仪) 分频器无法识别为两个显示器。                                ······
阅读全文

输出文章内容不解析html,原样输出html标签

文章内容有时要输入显示一些html如样式、脚本、html标签等,浏览器渲染读取出保存的含有html标签的内容时会把它当成页面内的标签处理,造成无法显示标签而变成了页面的构成元素标签。解决办法是页面输出内容时,把内容用htmlspecialchars()函数处理后在输出到界面。关于htmlspecia ······
阅读全文

瀑布流思路与源码

瀑布流:          Jquery瀑布流布局              body, ul, li, h3 {             margin: 0;             padding: 0;             list-style: none;     ······
阅读全文

css3 基本使用

px是相对与显示器分辨率:屏幕1366px*768px,字体设置12px. 因此用px来定义字体,就无法用浏览器字体放大的功能。 em是相对当前对象内文本的尺寸,任意浏览器的默认字体高都是16px。所有未经调整的浏览器都符合:1em=16px;未调整的0.75em=12px (12px/16px) ······
阅读全文

清除浮动

推荐清除浮动代码:   .clearfix:after {content: "\0020"; display: block; height: 0; clear: both; visibility: hidden;  }   /*“\0020”空格,unicode的16进制表示*/ .clearf ······
阅读全文

多窗口跨页操作window.opener用法

window.opener 就是通过window.open打开窗体的父窗体 A通过window.open打开B窗口,那么B中window.opener就是指A窗口,通过window.opener可以去访问操作A页面文档或脚本等。例:B.window.opener = A.window跨页操作常 ······
阅读全文

Media媒体查询支持参数参考

width:浏览器可视宽度。 height:浏览器可视高度。 device-width:设备屏幕的宽度。 device-height:设备屏幕的高度。 orientation:检测设备目前处于横向还是纵向状态。 aspect-ratio:检测浏览器可视宽度和高度的比例。 ······
阅读全文

Session与Cookie

简介:session机制:session是保存在服务器端的,无论设置session有效时间多久,用户一关浏览器session就失效即断开连接就失效,在连接会生成新的sessionID。cookie机制:cookie运行在客户端,但是用户清理了cookie的话此功能就会失效。删除客户端中的cookie ······
阅读全文

调试面板设置table的td宽度等不起作用

由于table的渲染机制,所以调试面板修改样式,视图中并不能展示修改的. 要重新加载才可以! 即去改变文件样式,而不是在调试面板改,之后重新加载 ······
阅读全文

DOM操作,代码优化

文档对象模型(DOM)是一个独立于特定语言的应用程序接口。在浏览器中,DOM接口是以JavaScript语言实现的,通过JavaScript来操作浏览器页面中的元素,这使得DOM成为了JavaScript中重要的组成部分。在富客户端网页应用中,界面上UI的更改都是通过DOM操作实现的,并不是通 ······
阅读全文

google谷歌浏览器中td宽度不起作用解决办法

若要google谷歌浏览器中所有td宽超出屏幕需加:table-layout:fixed; word-break:break-all; word-wrap:break-word; width:100%;否则设置td宽度不起作用  table td{width: 600px;}      ······
阅读全文

阻塞浏览器js代码运行与模态窗口

alert、confirm等都属于特殊的模态窗口,执行这些语句会阻塞浏览器 Javascript 代码的运行。 例如:  var test = confirm( "Are you OK ? " ) ; 执行了 confirm( "OK?" )  弹出一个确认框后,javascript 就不再执 ······
阅读全文

字符编码application/x-www-form-urlencoded

关于application/x-www-form-urlencoded等字符编码的解释说明 在Form元素的语法中,EncType表明提交数据的格式 用 Enctype 属性指定将数据回发到服务器时浏览器使用的编码类型。 下边是说明: application/x-www-form-urlencode ······
阅读全文

让IE6/7支持css的inline-block属性

IE6和IE7不支持行内块级属性display:inline-block; 可以先让块元素变为内联,再使用(zoom:1 或float属性等)触发块元素layout: display: inline-block; _zoom:1; *display: inline; ······
阅读全文

IE6、7、8兼容到IE9,IE6、7、8支持css3

支持圆角  http://www.divcss5.com/css-texiao/texiao571.shtml   css3pie支持css3新属性:http://css3pie.com/ HTML5 Shiv 支持html5新标签:http://html5shiv.googlecode ······
阅读全文

前端工程精粹之--js和css设置版本号,解决缓存问题

待:http://www.infoq.com/cn/articles/front-end-engineering-and-performance-optimization-part1  给css文件加个版本号:其实每次修改css文件后还要修改css的文件名有点麻烦,那么我们可以在加载css ······
阅读全文

iframe、frameset、frame解析

Iframe是Inline Frame的缩写,即内联框架。区别:frameset是在窗口区域进行框架分割,iframe则是在页面中创建一个框架区域。iframe框架可以不靠边,但frameset框架一定会靠边. 而iframe是在整个页面中嵌入一个页面,就像在网页中插入图片一样,位置和大小可以 ······
阅读全文

IE8下脚本JavaScript错误

IE8下脚本有错误则会影响到其它代码,整个js文件可能都不能用。 如p标签无clss属性,用jQuery去获取他,则会造成整个js文件不可用。 须判断:if($(" p ").attr(" class"))                                 ······
阅读全文

检测IE浏览器版本

做网页有时候会用到JS检测IE的版本,下面是检测Microsoft Internet Explorer版本的三种代码! 第一种: var browser=navigator.appName var b_version=navigator.appVersion var version= ······
阅读全文

jQuery事件重复注册

jquery click事件中嵌套click会重复注册内部的click事件,导致重复执行。 比如 $(...).click(function(){     $(...).click(function(){     ...//多次执行      });  });  //解决方法一:每次执行完 ······
阅读全文

table中关于ie8 兼容

IE8与其他浏览器不同处:tr默认分配table/tbody的高度:当有一个tr时,tr高度为table/tbody的高度 ; 当两个tr时,评分table/tbody高度; 所以:table/tbody高度不能设置死,可以设置max-height给table设置滚动条:table设置高度,超出后不 ······
阅读全文

自定义滚动条

一下火狐不支持,仅google浏览器支持,其它浏览器令设 div { width: 200px; height: 200px; overflow: auto; border: 1px solid #007aff; }  ::-webkit-scrollbar { width: 14px; heig ······
阅读全文

scrollTo(x,y)、scrollBy(x,y)、

以IE浏览器为准,其它浏览器清查找相关手册。window.scrollTo(x,y);x,滚动条横向滚动x距离;y,滚动条纵向滚动y距离。前提高度设置高点出现滚动条。实例(滚动条纵向滚动200px): function tang(){       window.scrollTo(0,200)  ······
阅读全文

html文档的加载顺序

                                       浏览器加载和渲染html的顺序1. IE下载的顺序是从上到下,渲染的顺序也是从上到下,下载和渲染是同时进行的。2. 在渲染到页面的某一部分时,其上面的所有部分都已经下载完成(并不是说所有相关联的元素都已经下载完)。3. 如 ······
阅读全文

HTML、SHTML、XHTML、DHTML、XML、JavaScript、JS、HTML DOM、CSS有什么区别

HTML、SHTML、XHTML、DHTML、XML、JavaScript、JS、HTML DOM、CSS有什么区别谁知道HTML,CSS,JS之间的关系——网友充满人性的解释html是网页的结构,CSS是网页的表达形式,JS是脚本语言;形象一点说就是,html相当于人里面的器官,组成了人体;而CS ······
阅读全文

文字/单词换行

word-break:break-all 和 word-wrap:break-word 都是能使其容器如DIV的内容自动换行。 它们的区别就在于:word-break:break-all 例如div宽200px,它的内容就会到200px自动换行,如果该行末端有个英文单词很长(congratul ······
阅读全文

css打印设置

一、添加打印样式 1. 为屏幕显示和打印分别准备一个css文件,如下所示: 用于屏幕显示的css: 用于打印的css:2. import方式:       @import url("css/printstylesheet.css") print;  3. 直接把屏幕显示样式和打印样式写在一个cs ······
阅读全文

IE9 字体不居中

在IE9看见自己使用line-height设置垂直居中文字不能垂直居中,这是与你设置字体有关,通常大家习惯设置font-family:Arial, Helvetica, sans-serif;font-family:Arial, "宋体",Helvetica, sans-serif;设置字体时候注意 ······
阅读全文

浏览器模式

浏览器模式:切换文本/档模式: 改变浏览器渲染引擎(js/css)默认情况下,IE8的浏览器模式为IE8。用户可以通过单击地址栏旁边的兼容性视图按钮( )来手动切换到不同的浏览器模式。在IE8中,IE8兼容性视图会以IE7文档模式来显示网页,同时会向服务器发送IE7的用户代理字符串。“文档模式”用于 ······
阅读全文

页面打印功能

Exmple://点击按钮 document.getElementById("printBtn").onclick = function(){            window.print();//打印      document.printForm.submit();//提交表单,用于计算打 ······
阅读全文

判断浏览器

浏览器判断//函数  function getBrowser() {      if(navigator.userAgent.indexOf("MSIE")>0) {          return "MSIE";     }      if(isFirefox=navigator.use ······
阅读全文

表单

表单在网页中主要负责数据采集功能。通过提交表单,向服务器传输数据内容,实现用户与服务器交互。 工作机制:用户在表单项里输入内容 - → 浏览器将用户输入数据打包发送给服务器 --→ 服务器接收数据并转由后台程序处理(比如php)。 form表单属于html,php只是用来将form表单提交上来的数据 ······
阅读全文

HTML的head头标签内属性参数

含移动端各种参数:http://fex.baidu.com/blog/2014/10/html-head-tags/1)html上加入     发确保网页的效果 2)    加上以下语句可使网页在苹果设备上运行更好                3)加入这句话可以定义iphone的添加 ······
阅读全文

html-HTTP协议

http响应常用状态码200  正常 302、307 临时重定向 指定被请求的文档已被移动到别处,此文档的新URL在location响应头中给出。 304 未修改 表示客户机缓存的版本是最新的,客户机可以继续使用它,无需到服务器请求。 404 找不到 服务器上不存在客户机所请求的资源 500 ······
阅读全文

window对象

window对象即是我们打开的浏览器的窗口,浏览器打开页面中的所有属性和方法都是window对象或window下其它对象属性的。如果浏览器html页面有包含iframe或者frame框架,那么这个iframe是另一个独立的window对象,相当于另一个打开的浏览器页面。 因此,window ······
阅读全文

禁用鼠标滚轮、鼠标中键,滚动条不显示

function xx(){     window.onmousewheel=function(){return false}//鼠标滚轮、鼠标中键     document.body.style.overflow="hidden"//滚动条不显示 } ······
阅读全文

支持onload事件的对象和标签

当页面加载的时候可以调用某些函数 例如function a(){ console.log(""123) }  window.onload = a; 在页面加载的时候就可以调用函数a了 还可以 window.onload = =function() { a();  b(); }来调 ······
阅读全文

字体

LION终端的默认字体就是helvetica,Helvetica Neue在MAC里也有 苹果默认的中文字体是“华文黑体”  Windows自带字体 新細明體:PMingLiU 細明體:MingLiU 標楷體:DFKai-SB 黑体:SimHei 宋体:SimSun 新宋体:NSi ······
阅读全文

web语义化

Web语义化是指使用语义恰当的标签,使页面有良好的结构,页面元素有含义,能够让人和搜索引擎都容易理解。如果可以在合适的位置使用恰当的标签,那么写出来的页面语义明确,结构清晰,搜索引擎也可以认出哪些是页面重要内容,予以较高的权值。h1~h6这几个标签在搜索引擎中权值非常高,用它们作页面标题就是一个简单 ······
阅读全文

浏览器中图片下默认间距

浏览器默认情况下,图片下会有间距空白,处理方法:将img定义为display:block定义父容器为font-size:0推荐使用vertical-align的方式,它的值可以是text-top | text-bottom | middle等 ······
阅读全文

MIME---Multipurpose Internet Mail Extensions : 多用途互联网邮件扩展类型

在HTTP中,MIME类型被定义在Content-Type header中。MIME(Multipurpose Internet Mail Extensions)多用途互联网邮件扩展类型就是设定某种扩展名的文件用一种应用程序来打开的方式类型,当该扩展名文件被访问的时候,浏览器会自动使用指定应用程序来 ······
阅读全文

window与document,outHeight()、height()

window:当前浏览器窗口(当前框架iframe),依赖客户端屏幕大小变化。document:文档-整个网页,依赖于网页内内容。 使用(均不包含滚动条): $(window).height();  //获取当前框架iframe可视浏览器内网页内容高度。依赖于屏幕大小 $(document).hei ······
阅读全文

图片始终居中不拉伸不变小

img标签图片始终剧中切不拉伸,根据屏幕变小逐步隐藏两边:     Title              .bannerbox {             width:100%;             position:relative;             overflow: ······
阅读全文

window对象下的location对象,获取当前网站域名

location的search属性使用 window.location.search.slice(1) 用例: a.html页面1212链接到的index.html页面的脚本文件输出:console.log(window.location.search.slice(1));//会输出a ······
阅读全文