三角形-css
/*箭头向上*/
.arrow-up {
width:;
height:;
border-left:30px solid transparent;
border-right:30px solid transparent;
border-bottom:30px solid #000;
} /*箭头向下*/
.arrow-down {
width:;
height:;
border-left:30px solid transparent;
border-right:30px solid transparent;
border-top:30px solid #0066cc;
} /*箭头向左*/
.arrow-left {
width:;
height:;
border-top:30px solid transparent;
border-bottom:30px solid transparent;
border-right:30px solid yellow;
} /*箭头向右*/
.arrow-right {
width:;
height:;
border-top:30px solid transparent;
border-bottom: 30px solid transparent;
border-left: 30px solid green;
} /*箭头无封口*/
.deg{
width:30px;
height:30px;
border-left:1px solid red;
border-bottom:1px solid red;
margin-left:100px;
transform:rotate(-45deg);
}
css写三角形
三角形-css的更多相关文章
- Effective前端3:用CSS画一个三角形
p { text-indent: 2em } .triangle-container p { text-indent: 0 } img { margin: 15px 0 } 三角形的场景很常见,打开一 ...
- CSS盒模型之三角形
W3上介绍盒模型: 这里教程,但是太过于简单了,http://www.w3.org/community/webed/wiki/CSS/Training/Box_model. 如图,盒模型和背景属性控制 ...
- CSS绘制三角形和箭头,不用再用图片了
前言 还在用图片制作箭头,三角形,那就太lou了.css可以轻松搞定这一切,而且颜色大小想怎么变就怎么变,还不用担心失真等问题. 先来看看这段代码: /**css*/.d1{ width: 0; he ...
- HTML 和 CSS 画三角形和画多边行基本原理及实践
基本 HTML 标签 <div class = 'test'></div> 基本 CSS 代码 .test { width: 100px; height: 100px; bac ...
- 利用纯css写三角形,弧度箭头,吃豆人,气泡。放大镜,标签的源码
1. 向上三角形
- css 折角效果/切角效果
首先我们先创建一个图案为100像素的斜面切角的图案 html <div class="one">12345</div> css .one{ width: 1 ...
- canvas 实现渐变色填充的三角形
实现效果 效果一: 效果二: 实现思路 canvas实现 1. 绘制三角形 // html <canvas id="triangle" width="30" ...
- CSS3新特性,绘制常见图形
前言:最近准备做一个自己的网页,设计稿中导航我准备设计成矩形,也有hover样式展示的矩形,当中一些头像等等.以前除了画圆,好像真没认真画过其他图形,今天就画画我们常见到的几个图形. 在此之前我们有必 ...
- 【转】js面试题,明确自己的不足
https://blog.csdn.net/m0_37631322/article/details/85409716 -------------------- 2018年12月30日 21:05:43 ...
随机推荐
- 微信小程序-图片、录音、音频播放、音乐播放、视屏、文件
图片: wx.chooseImage(OBJECT) 从本地相册选择图片或使用相机拍照. OBJECT参数说明: 注:文件的临时路径,在小程序本次启动期间可以正常使用,如需持久保存,需在主动调用 wx ...
- 禁止从别的应用启动Activity
在Manifest.xml中设置android:exported="false"即可,如: <activity android:name=".MyAty" ...
- linux下关掉teamviewer服务
一.情景介绍 OS: ubuntu14.04 64bit teamviewer版本:10.0.36281 刚才看见已经关掉了teamviewer,但是通过ps看以下进程情况,却还存在该进程,于是: 二 ...
- 后台启动weblogic成功后,在web浏览器上无法访问
后台启动weblogic成功后,在web浏览器上无法访问,可尝试重启服务器.
- shell中$0,$?,$!等变量意义
变量说明: $$ #Shell本身的PID(ProcessID) $! #Shell最后运行的后台Process的PID $? #最后运行的命令的结束代码(返回值) $- ...
- PBOC金融IC卡,卡片与终端交互的13个步骤,简介-第四组(转)
十:联机处理-可选项终端根据卡片行为分析的结果,执行对应的处理.若卡片响应联机,则终端发起联机操作.联机处理使得发卡行后台可以根据基于后台的风险管理参数检查并授权批准或拒绝交易.除了传统的联机欺诈和信 ...
- Python_Day8_面向对象编程进阶
本节内容: 面向对象高级语法部分异常处理 经典类vs新式类 静态方法.类方法.属性方法 类的特殊方法 反射 Socket开发基础 经典类vs新式类 classical vs new style: 经典 ...
- 在重新生成解决方案时,出现的错误:无法将文件“obj\x86\Debug\*.exe”复制到“obj\Debug\*.exe”。文件正由另一进程使用,因此该进程无法访问此文件
此例是VS2010的CS项目. 在重新生成解决方案时,出现的错误. 解决步骤:先关闭解决方案,再在项目文件下的bin\Debug\*.exe删除这类之前生成得.exe文件,再在VS2010下重新生成.
- iOS TextField用法大全
//初始化textfield并设置位置及大小 UITextField *text = [[UITextField alloc]initWithFrame:CGRectMake(20, 20, 130, ...
- js控制 input框中输入数字时,累计求和
$('.cc input').bind('input propertychange', function(){ var total = 0; $("input").each(fun ...