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
投稿猜你喜欢
- 本文实例讲述了Python实现对PPT文件进行截图操作的方法。分享给大家供大家参考。具体分析如下：下面的代码可以为powerpoint文件p
- 这个程序将记数器的数字放在ACCESS数据库中,当然你也能用你希望其它的ODBC数据源.这个程序从URL中读取记数信息.如下:< IM
- 本文实例讲述了PHP查询快递信息的方法。分享给大家供大家参考。具体如下：这里使用快递100物流查询官方文档中只能返回html的接口也可以返回
- Python2.7对于中文编码的问题处理的并不好，这几天在爬数据的时候经常会遇到中文的编码问题。但是本人对编码原理不了解，也没时间深究其中的
看代码吧~func remove(slice []interface{}, elem interface{}) []interface{}{- 图中图准备数据import matplotlib.pyplot as pltfig = plt.figure()x = [1, 2, 3,
- 本文作者系程序猿Daniel F Pupius，这是一篇他发表在Medium上的博文，讲述自己怎么在实际写代码的过程中，发现在效率和质量间做
- @num=1; 把num类型转成nvarchar类型 cast（@num as nvarchar(10)） @str='123
- 有些事情始终是需要坚持下去的。。。今天复习一下之前用到的连续相同数据的统计。首先,创建一个简单的测试表,这里过程就略过了,直接上表(真的是以
- 正常情况下，当我们定义了一个class，创建了一个class的实例后，我们可以给该实例绑定任何属性和方法，这就是动态语言的灵活性。先定义cl
- 本文实例讲述了Python编程之多态用法。分享给大家供大家参考。具体分析如下：什么是多态？顾名思义，多态就是多种表现形态的意思。它是一种机制
- 今天来讲一下一些实现html中表格隔行换色的方法，即每隔一个行表格的背景色就不同，有静态html/css实现的，也有asp动态实现的。这个功
- Python中的三引号，3个单引号及3个双引号实际上3个单引号和3个双引号不经常用，但是在某些特殊格式的字符串下却有大用处。通常情况下我们用
- 废话少说，先上代码File：logger.conf[formatters]keys=default[formatter_default]fo
- 一、前提1、MySQL版本信息：MySQL版本：8.0.27注意：其他版本（主要5.x版本未验证）2、表字段：定义列CREATE TABLE
- 很多jsp程序员都遇到过这样的情况，jsp页面传递参数到servlet，只要参数有中文就是乱码，且大多数是？？？？？？乱码，尝试了网上比较普
- quiver绘制表示梯度变化非常有用，下面是学习过程中给出的两个例子，可以很好理解quiver的用法from pylab import *c
- 一、ASP.NET处理管道Asp.net处理管道的第一步是创建HttpWorkerRequest对象，它包含于当前请求有关的所有信息。Htt
- 刚才帮一位朋友做跳转的时候做的，为了获取完整的url地址，还是花了那么点时间不过现在看来，原来是那么简单，没有网上那么多复杂的东东，相信一定
- 前言业务需求中需要连接两个数据库处理数据，需要用动态数据源。通过了解mybatis的框架，计划 使用分包的方式进行数据源的区分。原理前提：我
