1. css画长方形颜色各一半怎么画
缓过来了，开讲放射性渐变吧。
一、放射性渐变原理
别人都用ps解释，我却在渐变上独喜欢flash的渐变变形工具。
别人都说径向渐变，flash里面显示的是放射性渐变，我就沿用了放射性渐变的说法。你看出来啦，我曾经是flash的迷妹！
.gif
放射性渐变的核心就是：从中心点出发，辐射到边界处。
设置了四个色块，如图：
.png
用渐变变形工具可以查看
.png
默认第一个色块从中心点出发，沿着半径分布色块，直到边界处。
所以，我们可以理解这里的渐变线是半径。
可以通过改变中心点的位置，边界的大小，半径的长短，三角形的移动实现非对称的渐变等效果。
.png
原谅我没有来动画版本的，自己用flash试试呗！
其实来个椭圆一样妥妥的。
.png
明白了这个基本的原理后，再看MDN上的这篇文章，是不是感觉很好懂了。
至少这幅图好懂了↓
.png
半径就是虚拟渐变射线(virtual gradient ray)，中心点就是色块的起点(0%)，ending shape就是渐变的边界形状。ending shape只能是正圆(circle)或者椭圆(ellipse)。
二、放射性渐变的语法结构// Definition of the ending shape
radial-gradient( circle, … ) /* Synonym of radial-gradient( circle farthest-corner, … ) */
radial-gradient( ellipse, … ) /* Synonym of radial-gradient( ellipse farthest-corner, … ) */
radial-gradient( , … ) /* It draws a circle */
radial-gradient( circle radius, … ) /* A centered circle of the given length. It can't be a percentage */
radial-gradient( ellipse x-axis y-axis, … ) /* The two semi-major axes are given, horizontal, then vertical */
// Definition of the position of the shape
radial-gradient ( … at , … )
// Definition of the color stops
radial-gradient ( …, , … )
radial-gradient ( …, , )
官方的标准语法HTMD复杂呀。
我们只能一点点攻克了。
先了解几个基本概念：
：指的是中心点的位置，这个定位和background-position的定位是一样的，比如“50px 40px”，“30% 44px”，“left center”等值，一个代表x坐标，一个代表y坐标。如果缺省，代表的是正中间(center)。它的取值也是这几种：
：用长度值指定径向渐变圆心的横坐标或纵坐标。可以为负值。
：用百分比指定径向渐变圆心的横坐标或纵坐标。可以为负值。
left：设置左边为径向渐变圆心的横坐标值。
center：设置中间为径向渐变圆心的横坐标值或纵坐标。
right：设置右边为径向渐变圆心的横坐标值。
top：设置顶部为径向渐变圆心的纵标值。
bottom：设置底部为径向渐变圆心的纵标值。
：只能为正圆或者椭圆，正圆表示半径是一样的，椭圆则有x轴、y轴两个半径。默认的值是椭圆(ellipse)。
：沿着渐变线的色彩的值和位置的值。位置的值可以是百分比或者具体的像素，和线性渐变的写法是一样的。比如“#f00 0%”，“red 25%”，“rgba(255,255,255,0.5) 200px”等。
：表示ending shape放射性渐变结束的形状的大小。
常用的有如下几个值：
closest-side：指定径向渐变的半径长度为从圆心到离圆心最近的边；
closest-corner：指定径向渐变的半径长度为从圆心到离圆心最近的角；
farthest-side：指定径向渐变的半径长度为从圆心到离圆心最远的边；
farthest-corner：指定径向渐变的半径长度为从圆心到离圆心最远的角，这个是默认值；
2. css做的一个立方体，旋转的时候怎么让每个面跟着旋转，可以让上面的数据显示始终为正向显示
把要旋转的部分单独提取出来，这样才不会影响到其他，性能也好很多。
3. 旋转正方体
想来大家在初学前端之处，也很好奇，那些炫酷的特效真的可以由自己编写出来嘛，其实是的，现在我来分享一个旋转的正方体。还请大家多多支持。
做一个正方体首先要做出六个面，这就可以定下来基本的形状。让这个正方体旋转起桥昌来，其实就是让各个面保持一个相同的运动轨迹，让他们在x/y/z轴进行一定程度的旋转起来。物体的运动就是一个动画的定义，可以自己定运动周期的时间。
1.首先，定义六个面，需要注意的，保持box1-6关于y及z旋转的角度要相等，槐消消否则会出现旋转后离体的现象。颜色最好使用半透明，这样旋转起来效果更好。
2.现在需要写出一个div，给旋转的立方体一个布局空间。
现在里面已经定义了3d旋转，以及设置了从何处查看一个元素的角度，还规定了旋转的周期。当在 @keyframes 创建动画，把它绑定到一个选择器，否则动画不会有任何效铅知果。
把 "mydhua" 动画捆绑到 div 元素，时长：5 秒：
3.div布局设置完成，六个面也已经写好，下一步就是利用css动画，制作一个动态
动画是使元素从一种样式逐渐变化为另一种样式的效果。
用百分比来规定变化发生的时间，或用关键词 "from" 和 "to"，等同于 0% 和 100%。
0% 是动画的开始，100% 是动画的完成。
为了得到最佳的浏览器支持，可以定义 0% 和 100% 选择器。
这个时候，在body里面就可以直接使用了
此时，你就可以看到一个旋转的立方体了。感兴趣的话，可以试一试呀！
4. css3怎么让立方体随着滑动进行3d旋转
我有自己做好的弊迟 能3d 旋亏老转 的立方体例子，但是如果你需要支持用销卜升鼠标拖动。那么 css3 办不到，要用javascript 鼠标交互事件
5. 使用HTML+CSS做一个正方体
我们创建一个父容器，里面保存正方体六个面
6. html5 css3怎么用无序列表写一个3d立体正方体，目前还没学js，所以求怎么写，来个事例，参
加入正方形宽高为100px，
ulli:nth-child(1){
background-color:red;
transform:translate(-100px)rotateY(90deg);
}
ulli:nth-child(2){
background-color:blue;
transform:translate(100px)rotateY(90deg);
}
ulli:nth-child(3){
background-color:orange;
transform:translateZ(100px);
}
ulli:nth-child(4){
background-color:green;
transform:translateZ(-100px);
}
ulli:nth-child(5){
background-color:black;
transform:translateY(100px)rotateX(90deg);
}
ulli:nth-child(6){
background-color:chocolate;
transform:translateY(-100px)rotateX(90deg);
}空顷蠢间想象力要腊扰好，最开始所有面都重合在一起轮乎旦，要一个个移到指定位置形成个立方体
7. CSS画三角形、圆形、椭圆形总结
CSS画正方形长方形很简单，本文就不说了。
一、三角形
1、CSS画等腰三角形
2、画直角三角形：
二、画圆形
注意：border-radius是width/height的一半（50%）。
画半圆：
半圆的画法是把高度设为宽度的一半，并且也只设置左上角和右上歼指角的半径，且半径为宽度的一半。
画四分之一圆：是把高度和宽度设置为相等，只设置一个圆角，其半径等于高度或宽度。
三、画椭圆
斜杠前面的一组四个值分别表示四个角的水平半径；斜杠后面的一组四个值分别表示四个角的垂直半径。
四、平行氏大配四边形
margin-left是为了使得平行四边形可以全部在浏览器中显示出来
五、梯形
高度为0。有宽度没高度。
六、五边仿局形、六边形
8. css多个立方体并排后能看到背面露出来了
<!DOCTYPE html><html><head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>_</title></head><body><div class="contain">凳清禅 <div class="box"> <div class="face one">正裤 </div> <div class="face two"> </div> <div class="face three"> </div> <div class="face four"> </div> <div class="face five"> </div> <div class="枣尘face six"> </div>
9. 如何使用CSS画一个空心长方形 要代码哦，是使用DIV+CSS
如果你只要一条垂直线就设置这个DIV的边框线样式就可以了，样式代码：border-left:1px #000000 solid 这里的border-left是指这个DIV的左边边框，1px就是线的宽度，#000000是线的键段颜色（这里是黑色），solid是线的样闹亮陆液顷式（这里是实线），整个DIV的代码可以这样写：<div style="width:200px; height:500px; border-left:1px #000000 solid;"></div>
10. css3写魔方里的小方块怎么弄
魔方是由26个小方块组成的。最初的魔方是三阶立方体，26个小方块和一个三维十字连接轴组成。其中包含6个处于渗卖兆面最中心无法移动的块，12个位于棱上的块和8个角块。六个面每个配基有一种颜色，一般来说，标准的魔方的颜色应该是蓝、白、红、绿、黄和橙色，其中蓝白相对、绿黄相对、红橙相对。
在中国，魔方是80年代最抢手的玩具，如同今天孩子们手中的掌上游戏机一样，成为青少年最喜欢的玩具。但是随着改革开放，越来越多的新奇玩具进入了中国，中国的魔方热潮也在渐渐消退。
不过最近几年，中国的非正式魔方社群魔方吧正在努力改变公众对于魔方的看法。魔方不仅仅是小孩子的玩具，更是一种休丛租闲放松的方式，再加上更有刺激和挑战性的竞速、单手拧魔方的玩法，越来越多的人正在重新关注魔方。