文章导航PC6首页软件下载单机游戏安卓资源苹果资源

pc软件新闻网络操作系统办公工具编程服务器软件评测

安卓新闻资讯应用教程刷机教程安卓游戏攻略tv资讯深度阅读综合安卓评测

苹果ios资讯苹果手机越狱备份教程美化教程ios软件教程mac教程

单机游戏角色扮演即时战略动作射击棋牌游戏体育竞技模拟经营其它游戏游戏工具

网游cf活动dnf活动lol周免英雄lol礼包

手游最新动态手游评测手游活动新游预告手游问答

您的位置:首页网页设计HTML/CSS  → 5个实例让你轻松了解CSS3新属性

5个实例让你轻松了解CSS3新属性

时间:2010/2/11 11:11:00来源:本站整理作者:我要评论(0)

5个实例让你轻松了解CSS3新属性:

一、基本代码结构
在开始这个教程之前,我们先把基本的代码结构编写好,我将结合这些代码来讲解介绍。
我们需要如下div代码元素
1、#round,讲解css3圆角效果时使用;
2、#indie,讲解个性圆角效果时使用;
3、#opacity,讲解css3实现透明的新方法;
4、#shadow,在不使用photoshop情况下,如何创建投影效果;
5、#resize,介绍一个新的css3属性,调整缩放元素。

XHMTL代码如下:

  1. <!DOCTYPE html PUBLIC ”-//W3C//DTD XHTML 1.0 Transitional//EN” ”http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
  2. <html xmlns=“http://www.w3.org/1999/xhtml”>
  3. <head>
  4. <meta http-equiv=“Content-Type” content=“text/html; charset=utf-8″ />
  5. <title>An Introduction to CSS3; A Nettuts Tutorial</title>
  6. <link href=“style.css” rel=“stylesheet” type=“text/css” />
  7. </head>
  8. <body>
  9. <div id=“wrapper”>
  10. <div id=“round”> </div>
  11. <div id=“indie”> </div>
  12. <div id=“opacity”> </div>
  13. <div id=“shadow”> </div>
  14. <div id=“resize”>
  15. <img src=“image.jpg” alt=“resizable image” width=“200″ height=“200″>
  16. </div>
  17. </div>
  18. </body>
  19. </html>

相关视频

    没有数据

相关阅读 个性化jQuery和CSS3菜单源码CSS实现Tab技巧CSS复位-CSS Reset代码举例IE6绝对定位的bug及其解决办法CSS样式表创建美妙绝伦的网站几个最常用和实用的CSS技巧将网站(主页)变成黑白DW设计网页时组织CSS的建议

文章评论
发表评论

热门文章 没有查询到任何记录。

最新文章 页面进入效果表单 XHTML校验需要注意的6个细节CSS样式表创建美妙绝伦的网站了解XHTML DHTML SHTML之间的区别HTML小技巧的一些小技巧

人气排行 容易被误解的overflow:hiddenCSS中dashed和dotted的区别CSS水平和垂直居中的几种实现方法DIV+CSS自适应高度兼容IE6,ie7,ie8和FF的解css优先级问题如何用CSS实现图片圆角化处理超链接target=_blank的使用方法Ctrl+H键的用法