三角型的常见写法,及三角的旋转
<style>
div{
margin:50px;
}
.triangle{
width:0;
height:0;
border-width:30px;
border-style:solid;
border-color:red blue yellow green;
overflow:hidden;
}
.triangle1{
border-width:30px;
border-color:#000 transparent transparent transparent;
border-style:solid dashed dashed dashed;
width:0;
height:0;
overflow:hidden;
}
.triangle2{
border-width:20px;
border-color:#000 #000 transparent transparent;
border-style:solid solid dashed dashed;
width:0;
height:0;
overflow:hidden;
}
.triangle3{
background: none repeat scroll 0 0 #E7E7E7;
color: #666666;
font: 12px/28px normal;
height: 28px;
position: relative;
width: 66p
}
.triangle3:after{
background: none repeat scroll 0 0 blue;
color: red;
content: ".";
height: 12px;
position: absolute;
right: -3px;
top: 7px;
transform: rotate(45deg);
width: 12px;
}
.triangle4{
color:#000;
}
.outWrap{
border: 1px solid #000;
width: 60px;
height: 30px;
line-height: 30px;
border: 1px solid #000;
}
.wrap b{
border-width: 6px;
border-color: #999 #fff #fff;
border-style: solid;
height: 0;
line-height: 0;
display: inline-block;
vertical-align: text-bottom;
font-size: 0;
transition: transform 0.2s ease-in 0s;
width: 0;
}
.wrap:hover b{
border-color: red #fff #fff #fff;
transform:rotate(180deg);
transform-origin:50% 30%;
}
</style>
</head>
<body>
<!--利用border实现三角-->
<div class="triangle"></div>
<!--90度方向三角-->
<div class="triangle1"></div>
<!--45度方向三角-->
<div class="triangle2"></div>
<!--利用矩形转一个角度,此处内容点要与背景色一致-->
<div class="triangle3"></div>
<!--利用html中的特殊字符▲■◆等-->
<div class="triangle4">▲</div>
<!--三角的旋转-->
<div class="outWrap">
<a class="wrap">
222
<b></b>
</a>
</div>
相关推荐
旋转三角形旋转三角形旋转三角形旋转三角形旋转三角形旋转三角形旋转三角形旋转三角形旋转三角形旋转三角形旋转三角形旋转三角形旋转三角形旋转三角形旋转三角形旋转三角形旋转三角形旋转三角形旋转三角形旋转三角形...
对内存中的点集(或简单几何图形)进行平移、缩放、绕指定的中心点旋转等几何变换; 将变换后点集(或简单几何图形)的坐标值存储到文件中。 通过图形界面提供对变换参数的设置(如沿x轴平移100个单位,绕...
由用户输入三角形的三个顶点及屏幕上任意一点p的坐标(由于界面问题应输入第一象限坐标),在屏幕上画出该三角形及相对于点p顺时针旋转一定的角度(角度也由用户输入)后的图形。
是关于opengl 下的动态三角形旋转,有颜色的变换,三维动态旋转
webgl旋转三角形生成。后续webgl基础随笔持续更新。git地址:https://github.com/11zouzouzou
OpenGL三角形旋转源码(一个可以运行的实例,有需要的朋友可以下载)
相似三角形常见模型及经典型例题讲解.doc
2020年八年级数学下册解法技巧:常见三角形的旋转模型(北师大含解析).pdf
三角形的旋转与平移可以形象地描述三角形转变为平行四边形的过程,为平行四平形的面积公式推导提供直观理解!
Android OpenGLS20 绘制一个三角形 旋转
三角形旋转全等常见模型.doc
三角形旋转全等常见模型.docx
css3三角形布局transform旋转列表图片三角形布局代码 css3三角形布局transform旋转列表图片三角形布局代码
OpenGL ES 2.0 开发一个旋转三角形 注释超级详细 配套解析博客 : http://blog.csdn.net/shulianghan/article/details/17020359
在c++中用opengl 编写实现四个三角形旋转
相似三角形常见模型和经典型例题讲解.doc
相似三角形常见模型与经典型例题讲解.doc
特殊三角形常见题型.pdf