[翻译]CSS3 Media Queries(媒体查询)的逻辑

原文:Logic in Media Queries
本文地址:CSS3 Media Queries(媒体查询)的逻辑
if
逻辑查询的语句“if”语句:if 语句在浏览器里是true,就执行 里面的内容;
and
关键词 and

本地存储之localStorage

本地存储的前世今生
说本地存储,大家可能首先会想到cookie,cookie确实让大家在开发的过程中帮了不少忙,但是,由于其存储大小的限制(约4kb),大一些的数据存储就显得有些力不从心了。虽然后来有了ie的userdata、后来的flash、谷歌的Gears,但是终究不是一个标准。

HTML5 canvas介绍,以及它能干什么

canvas能做什么?
canvas是HTML5中的新元素,你可以使用javascript用它来绘制图形、图标、以及其它任何视觉性图像。它也可用于创建图片特效和动画。如果你掌握了完整的命令,你可以用canvas创建丰富的web应用程序。如果你想很好的使用canvas,你首先应该很好的掌握javascript。
这篇文章是一篇基础教程,你能了解一些设计方法。比如用HTML5 canvas 进行图形设计。

8段以后新项目可以用的前端代码片段

做为一名web前端开发人员,我们经常会在是否使用新的技术和一些兼容性问题上纠结。这里有一些很多有用的代码片段,能够极大的提升你的开发进程。
在这片文章中,我将分享8个代码片段,任何人都可以免费使用。这些代码块包含一些标准的HTML5和一些CSS3解决方案以及一些网站布局。你可以将这些代码片段存储在你的本地文件或者Adobe Dreamwear等一些编辑器里,这些代码都是非常有用的!

CSS3中背景图像新增加的repeat属性值space 和 round

在CSS2.1中,background-repeat 属性有四个属性:no-repeat, repeat, repeat-x and repeat-y.
CSS3 新引进了两个新的选项:space 和 round;

background-repeat: space

background-repeat: round

CSS3 background属性讲解之---background-size

在CSS2.1中,背景图像应用到一个容器会保留他们的固定的尺寸。现在,CSS3增加了一个background-size属性允许拉伸(伸缩)或挤压背景图片。

有几种方法可以定义size的大小--查看CSS3 background-size Demo 页面。

一个新的图片替换技术,是时候和-9999px说再见了

-9999 px的图形替换技术已经流行了很久了,通常我们替换一个文本元素或者一个图像,您可以使用下面的代码:

这是一个文本或者一个logo图片  
  
h1  
{  
    background: url("logo.png") 0 0 no-repeat;  
    text-indent: -9999px;  
}  
  

固定在网页某个位置的导航

 最近在项目中用到一个当浏览器滚动时候,网页左侧内容随着浏览器滚动,但当网页在最上部的时候,左侧内容是需要放在原来的位置的。

之前做过一个《固定在屏幕一个地方的漂浮窗口 css fixed兼容IE6》,那个是始终固定在页面某一个位置。

我们现在做的是只有拉动网页滚动条了,左侧内容才会跟着浮动。

其实这个是相当简单的一个js逻辑,首先我们要先求得左侧浮动内容容器距页面顶部的高度,然后监控滚动条事件,当滚动条滚动的区域大于我们要浮动的容器距头部的高度了,就给左侧容器增加一个样式

...

Sublime text 2 编辑器

sublime text 2介绍

sublime text 2

最近这个编辑器在国内前端的人的交流地,可谓是出尽了风头,我也跟着起个哄。

最近也装上了这个编辑器,首页说一下第一印象吧:

  1. 轻量级的软件,只有6M左右;
  2. 打开界面很清爽,没人什么干扰的东西;
  3. 试用后感觉对JS、jq等都有很友好的提示;

很不幸的是这个软件是收费的,不过它也可以让用户无限期试用,在保存的时候会弹出让你注册的提示,点取消就ok了!

...

在web页面中引用css的四种方法

作为一名前端开发工程师,平时在制作页面的时候,我们我们会用到很多中将CSS引入页面的方法,那么,今天我将分享一下这些方法,并讨论那种方法更好一些。