5.26 图形变换练习

Posted 岁月静好123

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了5.26 图形变换练习相关的知识，希望对你有一定的参考价值。

源代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="5.26练习1调用.css" rel="stylesheet" type="text/css" />
<body>
<div class="a1" onmouseover="className=‘aa1‘" onmouseout="className=‘a1‘">  

<div class="a2" onmouseover="className=‘a22‘" onmouseout="className=‘a2‘">
<div class="a6"></div>
</div>
<div class="a3" onmouseover="className=‘a33‘" onmouseout="className=‘a3‘">
<div class="a7"></div>
</div>
<div class="a4" onmouseover="className=‘a44‘" onmouseout="className=‘a4‘">
<div class="a8"></div>
</div>
</div>

</body>
</html>
<script>

</script>


调用
@charset "utf-8";
/* CSS Document */


.a1
{
width:100px;
height:50px;
left:20px;
top:20px;
background-color: #F00;
position:absolute;
overflow:hidden;
}
.aa1
{
width:100px;
height:50px;
left:20px;
top:20px;
background-color: #F00;
position:absolute;
}

.a2
{
width:100px;
height:50px;
left:0px;
top:50px;
background-color: #0F0;
position:absolute;
overflow:hidden;
}
.a22
{
width:100px;
height:50px;
left:0px;
top:50px;
background-color: #0F0;
position:absolute;
}
.a3
{
width:100px;
height:50px;
left:0px;
top:100px;
background-color: #00F;
position:absolute;
overflow:hidden;
}
.a33
{
width:100px;
height:50px;
left:0px;
top:100px;
background-color: #00F;
position:absolute;
}
.a4
{
width:100px;
height:50px;
left:0px;
top:150px;
background-color: #FF0;
position:absolute;
overflow:hidden;
}
.a44
{
width:100px;
height:50px;
left:0px;
top:150px;
background-color: #FF0;
position:absolute;
}

.a6
{
width:100px;
height:200px;
left:100px;
top:0px;
background-color: #0F0;
position:absolute    ;
}
.a7
{
width:100px;
height:200px;
left:100px;
top:0px;
background-color: #00F;
position:absolute    ;
}
.a8
{
width:100px;
height:200px;
left:100px;
top:0px;
background-color: #FF0;
position:absolute    ;
}

 

以上是关于5.26 图形变换练习的主要内容，如果未能解决你的问题，请参考以下文章

利用C语言实现二维图形的变换

5.26 考试修改+总结

Real - time Rendering 实时计算机图形学

Android片段布局完成膨胀

《DSP using MATLAB》Problem 5.24-5.25-5.26

计算机图形学-图形学中的基本变换（缩放平移旋转剪切镜像）