仓酷云

标题: 给大家带来CSS教程:CSS制造3D立方体 [打印本页]

作者: 因胸联盟 时间: 2015-1-15 23:34
标题: 给大家带来CSS教程:CSS制造3D立方体
标准的选择器不能格式化一个元素内容的第一个字母或者第一行，而伪元素选择器能实现
网页制造poluoluo文章简介：今朝制造出来的效果，只要Firefox3.5，Safari3.2+，GoogleChorme撑持。上面来为人人枚举出相干演示和代码。
无需JavaScript,imagery,canvas大概SVG，就能够使用最新的CSS制造出3D立方体，这切实其实是一件让人不可思议的事变。
今朝制造出来的效果，只要Firefox3.5，Safari3.2+，GoogleChorme撑持。上面来为人人枚举出相干演示和代码。

3DCSS
了局演示
单个静态3D立方体
撑持扫瞄器：Safari3.2+,GoogleChrome,Firefox3.5+
三个滑动的静态3D立方体
撑持扫瞄器：Safari4+,GoogleChrome
怎样制造?
实在利用DIV容器的代码很复杂，以下：
<divclass="cube">
<divclass="topFace">
<div>Content</div>
</div>
<divclass="leftFace">Content</div>
<divclass="rightFace">Content</div>
</div>
CSS来把持
.cube{
position:relative;
top:200px;
}

.rightFace,
.leftFace,
.topFacediv{
padding:10px;
width:180px;
height:180px;
}

.rightFace,
.leftFace,
.topFace{
position:absolute;
}

.leftFace{
-webkit-transform:skewY(30deg);
-moz-transform:skewY(30deg);
background-color:#ccc;
}

.rightFace{
-webkit-transform:skewY(-30deg);
-moz-transform:skewY(-30deg);
background-color:#ddd;
left:200px;
}

.topFacediv{
-webkit-transform:skewY(-30deg)scaleY(1.16);
-moz-transform:skewY(-30deg)scaleY(1.16);
background-color:#eee;
font-size:0.862em;
}

.topFace{
-webkit-transform:rotate(60deg);
-moz-transform:rotate(60deg);
top:-158px;
left:100px;
}

强大的字体控制和排版能力。CSS控制字体的能力比糟糕的FONT标签好多了。

作者: 若天明 时间: 2015-1-17 23:18
这个过程其实就是交流的过程。所有的这些都需要花时间。在面对完全陌生的软件时，就要多花时间对其产生初步的印象。此外，多操作也是非常重要的。

作者: 灵魂腐蚀 时间: 2015-1-24 16:42
Dreamweaver8中文版(dw)是由Macromedia公司开发的一款所见即所得的网页编辑器。和二维动画设计软件FLASH，专业网页图像设计软件FIREWORKS，并称为“网页三剑客”。

作者: 分手快乐 时间: 2015-2-2 11:31
在刚开始接触网页的第一堂课上，听说网页制作会是一门很无聊并且很难听懂的过程，而事实却印证了这样一个事实。

作者: 仓酷云 时间: 2015-2-7 19:23
HTML技术的不断发展和完善，随之而产生了众多网页编辑器，从网页编辑器基本性质可以分为所见即所得网页编辑器和非所见即所得网页编辑器（则原始代码编辑器）

作者: 若相依 时间: 2015-2-23 10:22
Adobe Dreamweaver(前称Macromedia Dreamweaver)是Adobe公司的著名网站开发工具。

作者: 深爱那片海 时间: 2015-3-7 08:29
使用内容管理系统进行开发并实现快速、精确的浏览器兼容性测试。

作者: 乐观 时间: 2015-3-14 20:15
以上大概就是文字图片的一些链接方法，通过学习Dreamweaver、练习让我对dreameaver8有了进一步的认识，他其实是一款很好的建立Web站点和应用程序的软件。它将可视布局工具、应用程序开发功能和代码编辑支持组合在一起，其功能强大，使得各个层次的开发人员和设计人员都能够快速创建界面吸引人的基于标准的网站和应用程序。

欢迎光临仓酷云 (http://www.ckuyun.com/)