logo

关于-webkit-animation

2013/5/11 2:06:54 | Tag: -webkit-animation, CSS, 动画 | Hits: 417 | Comments: 0

-webkit-animation:仍旧是一个复合属性,

语法:-webkit-animation: name duration timing-function delay iteration_count direction;

包括以下几个属性:

(1)-webkit-animation-name 
这个属性的使用必须结合@-webkit-keyframes一起使用
eg:
@-webkit-keyframes fontchange{
0%{font-size:10px;}
30%{font-size:15px;}
100%{font-siez:12px;}
}
百分比的意思就是dura

10个网页设计师必备的CSS技巧

2012/8/7 18:59:59 | Tag: css, web | Hits: 996 | Comments: 0


CSS是网页设计师的基础,对CSS的了解能使他们能够设计出更加美观别致的网页。使用CSS技巧来巧妙地处理CSS是非常令设计师着迷的事情。在CSS的深海世界里有很多有意思的东西,你只需要找到最适合你的就好。当然我们不可能一下子就记住所有CSS的规则和语法,但为了以后的发展我们还是应该记住那些非常有用的CSS技巧。今天我们精心准备了10条对网页设计师最有用的CSS技巧,如果你想设计出独一无二脱颖而出的网页你必须得好好注意了。

1. @font-face
一种用其他服务器上的字体的好方法。很明显,如果你不能在托管服务器上找到你需要的字体,你可以在样式中使用这个方法来引入你需要的字体。

@font-face { 
font-family: Blackout; 
src: ur

-webkit-filter是神马?

2012/8/3 17:30:45 | Tag: Chrome, filter, Safari, WebKit | Hits: 940 | Comments: 0

这些滤镜效果最初是用于SVG的,W3C引入到CSS中,然后制定了CSS Filter Effects 1.0,现在webkit率先支持了它。
现在规范中支持的效果有:
grayscale 灰度
sepia 褐色
saturate 饱和度
hue-rotate 色相旋转
invert 反色
opacity 透明度
brightness 亮度
contrast 对比度
blur 模糊
drop-shadow 阴影

嗯,有些和CSS3重复了,不过,具体要怎么用还要看具体情况,至少我们可以用不同的方法实现同样的效果——比如透明度。

用法是

19个基于 HTML5 和 CSS3 开发的优秀应用程序

2012/1/20 23:27:03 | Tag: HTML, CSS, WEB | Hits: 1079 | Comments: 0

今天,本文向大家展示19个基于 [url=http://www.html5cn.org/]HTML5[/url] 和 [url=http://www.html5cn.org/portal.php?mod=list&catid=16]CSS3[/url] 开发的优秀[url=http://www.html5cn.org/portal.php?mod=list&catid=20]应用[/url]程序。[url=http://www.cnblogs.com/lhb25/category/146076.html]HTML5[/url]可以说是近十年来 Web 标准最巨大的飞跃,它的使命是将 Web 带入一个成熟的应用平台,而 CSS3 同样给 WEB 开发带来了革命性的影响,以前很多需要[url=h

CSS3弹性盒模型

2011/11/20 20:43:07 | Tag: CSS3, HTML, WEB | Hits: 1065 | Comments: 0

Css3引入了新的盒模型——弹性盒模型,该模型决定一个盒子在其他盒子中的分布方式以及如何处理可用的空间。这与XUL(火狐使用的用户交互语言)相似,其它语言也使用相同的盒模型,如XAML  、GladeXML。

使用该模型,可以很轻松的创建自适应浏览器窗口的流动布局或自适应字体大小的弹性布局。本文的例子使用以下的HTML代码:


1.<body>

2.  <div id="box1">1</div>

3.  <div id="box2">2</div>

4.  <div id="box3">3</div>

关于CSS的一些

2010/11/23 16:42:13 | Tag: css, html, 前端, web | Hits: 1421 | Comments: 0

[url=http://www.qianduan.net/]http://www.qianduan.net/[/url]  前端观察

[url=http://leaverou.me/scripts/css3learn.html]http://leaverou.me/scripts/css3learn.html[/url]

[url=http://caniuse.com/#cats=CSS3]http://caniuse.com/#cats=CSS3[/url]

[url=http://www.codenique.com/html/image_maps/]http://www.codenique.com/html/image_maps/[/url]
   

商业价值杂志:HTML5将带来什么

2010/9/14 11:34:05 | Tag: HTML5, WEB | Hits: 1349 | Comments: 0

2010年上半年的苹果与Adobe的冲突,使HTML5的存在一夜之间被很多人所知晓。在乔布斯的煽动下,这一已经在科技界潜行数年的下一代 Web标准,被迅速拎到了台面上,苹果、谷歌、微软这科技界三巨头,连同众多业界明星,似乎突然对HTML5变得情有独钟,利益集团的之间的争夺,成了这 个技术最好的催化剂。

  HTML5的火热似乎暗合了“合久必分,分久必合”的旧理。愈发多样化的互联网应用与现有平台割据之间的矛盾,产生了对标准统一Web标准的迫切需求,而HTML5正是担负这一使命的最佳候选——现在看来,也是唯一候选。

  显然,它的重要性不言而喻。而围绕着这一标准的争夺,势必会激起科技界的惊涛骇浪。

  HTML即超文本标记语言或超文本链接标示语言,是目前网络上应用最为广泛的语言,也是制作网页的主要语言。诞生于1993年的HTML

Meta标签是否还有用

2010/4/28 10:43:02 | Tag: Meta, SEO, Web | Hits: 1439 | Comments: 0

Meta标签指的是网页HTML文件里面的一些文件标签。其中最重要的是:标题标签Title Tag,描述标签Description Tag和关键词标签Keyword Tag。

其他比如象作者,软件版本等等,可以不用管了,在搜索引擎优化当中,没有什么价值。当然,其他标签也不妨碍什么。你愿意的话,可以放上你想放的信息,但是不能太多。因为前面标签放的太多,就会把你的网页正文内容推到文件的后面去了。这对于优化排名很不利。

大概4,5年以前,搜索引擎还都把这些标签看的很重要。因为这些标签的内容,就是站长自己所自称的这个网页是关于什么的。但是随着搜索引擎排名算法被更多的了解以后,人们开始把不相关的关键词堆砌到这些标签里面,希望能在热门关键词搜索中得到好的排名。

几年前,最大的搜索引擎Alta Vista的没落,很大程度

怎样写标题标签Title Tag?

2010/4/28 10:42:00 | Tag: Title, Tag, SEO, Web | Hits: 1428 | Comments: 0

在网页的优化上,最重要的因素之一就是网页的标题标签Title Tag。

通常在写标题标签时,应该考虑到以下几个因素:

1)所以的网页都应该有适合自己的独特的Title Tag。有很多网站都犯了一个很初级的错误,也就是所有网页都用同一个标题,比如说“欢迎参观ABC公司”。可能设计师在设计网页的时候,都是把整个模板复制来复制去。所以HTML文件里面的head信息也都被复制过去,而没有再改动。

实际上每一个网页虽然都属于同一个网站,但肯定会是在谈不同的东西,可能是你的产品,可能是你的服务。不同的网页必须要写出针对这个网页具体内容的标题标签。

2)标题标签应该对用户有足够的吸引力。当你的网页在搜索引擎被列出时,网页的标题就是来自于标题标签。用户在判断应该点击哪一个网站时,很大程度上就取决于你的标题写的怎么样?是

IE6死后让网页设计者高兴的10件事

2010/2/24 11:50:22 | Tag: IE6, IE, Web, CSS | Hits: 1497 | Comments: 0

关键字:
  很多人以为IE6已经死了,也许只有设计师这样认为,现实世界中IE6的使用者大有人在,不过不会维持很久,IE8已经推出,微软对IE8的推广不遗余力,同时,不少人从IE转到别的浏览器,总有一天,IE6会被弃之如敝履,没有人愿意再提起,那时,有 10件事会大快人心。



  使用 CSS 2 的 child 选择器

  不必再写一大堆规则在某个对象的子对象中筛选,CSS2 的子选择器(child selectors)可以选择某个对象下直接的子对象。

  放心使用 24 位 PNG 图片(透明不再是问题)

  不必象以前那样在不同背景方案下设计不同的图片边缘反锯齿方案,

Copyright 2013 © SkyIMG.cn. All Rights Reserved. | 京ICP备05063919号