CSS3的五个使用技巧[译]
作者:35公里 来源:锐商企业CMS 发布时间:2009-02-19 13:01:00
标签:css3,技巧,web,浏览器,客户
CSS 3 + HTML 5 是未来的 Web,它们都还没有正式到来,虽然不少浏览器已经开始对它们提供部分支持。本文介绍了 5 个 CSS3 技巧,可以帮你实现未来的 Web,不过,这些技术不应该用在正式的客户项目,它们更适合你的个人博客站点,Web 设计社区,或者不会有客户向你投诉的场合。
1. 圆角效果
CSS3 新功能中最常用的一项是圆角效果,标准 HTML 方块对象是90度方角的,CSS3 可以帮你实现圆角。
-moz-border-radius: 20px;
-webkit-border-radius: 20px;
border-radius: 20px;
甚至单个角也可以实现圆角,不过 Mozilla 和 Webkit 的语法稍有不同。
-moz-border-radius-topleft: 20px;
-moz-border-radius-topright: 20px;
-moz-border-radius-bottomleft: 10px;
-moz-border-radius-bottomright: 10px;
-webkit-border-top-rightright-radius: 20px;
-webkit-border-top-left-radius: 20px;
-webkit-border-bottom-left-radius: 10px;
-webkit-border-bottom-rightright-radius: 10px;
所支持的浏览器:Firefox, Safari , Chrome
用例: Twitter.
请参阅:
2. 图形化边界
顾名思义,图形化边界就是允许使用图片作为对象的边界,语法如下:
border: 5px solid #cccccc;
-webkit-border-image: url(/images/border-image.png) 5 repeat;
-moz-border-image: url(/images/border-image.png) 5 repeat;
border-image: url(/images/border-image.png) 5 repeat;
这里,border: 5px 设定了边界的宽度,然后,每个边界的图片定义告诉浏览器,使用图片的多大一部分来充当边界。边界图片还可以针对每一条边单独设置:
border-bottom-rightright-image
border-bottom-image
border-bottom-left-image
border-left-image
border-top-left-image
border-top-image
border-top-rightright-image
border-right-image
支持的浏览器: Firefox 3.1, Safari , Chrome.
用例: Blog.SpoonGraphics.
请参考:
0
投稿
猜你喜欢
- Oracle数据库提供了几种不同的数据库启动和关闭方式,本文将详细介绍这些启动和关闭方式之间的区别以及它们各自不同的功能。 一、启动和关闭O
- 该语句的作用是:启用或禁用错误处理程序。一般用法如下:On Error Resume NextOn Error GoTo 0如果在您的代码中
- 星爷的一部“国产007”应该是无人不晓,其中一个片段是将“007”向MM展示他的秘密武器。皮鞋可以吹头发,大哥大可以刮胡子……把真实功能隐蔽
- 一、前言:在经过一段时间的存储过程开发之后,写下了一些开发时候的小结和经验与大家共享,希望对大家有益,主要是针对Sybase和SQL Ser
- 现在有一个xml,格式如下: <date> <item> <id> 1 </id> <
- 微软上周发布了一份关于 Windows Internet Explorer 8 浏览器(以下简称为 IE 8)性能优化的白皮书《Window
- 我在网站上设置了邮件列表功能,实现用户自动订阅和发送,但很多用户输入和提交的邮件地址格式都是无效的,无法处理。请问如何解决这一问题?&nbs
- 在asp中获取当前的地址栏网址很简单,使用下面这句语句即能实现获取网站域名Request.ServerVariables("HTT
- Microsoft? SQL Server? 2000 的可用版本如下:SQL Server 2000企业版作为生产数据库服务器使用。支持
- Access SQL 函数 收藏 ▲日期/时间CDate 将字符串转化成为日期 select CDate("2005/
- 你不得不承认,今天网络发展之迅速,信息流动速度之快、量之大,是我们不曾考虑过的,但现在它就真真切切地摆在我们面前。如何接纳信息,怎么处理、消
- 使用 Response.Redirect "aspxhome.asp" 转向方法的HTTP Status Code 为3
- 函数名:chk_Email()'返回值:布尔值(True为通过,False为未通过)'参数:email(需要判断的email
- 呵呵,先说明一下下面的程序大部分收集自网络,因为本人在asp编程中经常使用到随机函数,所以收集了一些这类的函数,并做了些注释,方便使用。首发
- CONVERT将某种数据类型的表达式显式转换为另一种数据类型。由于某些需求经常用到取日期格式的不同.现以下可在SQL Server中将日期格
- JavaScript中的64位加密及解密的两个方法。function base64Encode(text){if (/(
- 知识点: 1、拼接SQL 2、UNION ALL 3、EXEC 其代码如下: 代码如下:--测试示例 declare @sql
- 代码如下:CREATE PROCEDURE page @tblName varchar(255), -- 表名 @strGetF
- 当然,这些并非真正的定律,而只是一些有益的忠告,使你免陷于使用层时可能的困顿中。原来有九条定律的,我们精简掉一条,还有下面的八条:1. 如果
- 最近,为了能在数据库服务器中运行其他应用程序,在保持数据库操作系统版本不变的前提下对数据库服务器进行了软、硬件上的升级。在软件上,将操作系统