<!DOCTYPE html> <html> <head> <style> #div1 { position: relative; height: 200px; width: 200px; margin: 100px; border: 1px solid black; } #div2 { width:10px; height:10px; position: absolute; border: 1px solid black; background-color: red; transform: rotate(45deg); transform-origin:0 200px; -ms-transform: rotate(45deg); /* IE 9 */ -ms-transform-origin:0 200px; /* IE 9 */ -webkit-transform: rotate(45deg); /* Safari and Chrome */ -webkit-transform-origin:0 200px; /* Safari and Chrome */ } </style> </head> <body> <div id="div1"> <div id="div2"></div> </div> </body> </html> //运行结果是： transform-origin:如果以百分比定义原点那么就是以子集本身宽度的百分比而定义的位置，如果是以 像素单位定义的原点，那么就是以其父级元素为基准点而定义的原点。
