div+css 画三角形
<style type="text/css">
.rightdirection
{
width:0;height:0;
line-height:0;
border-width:20px;
border-style:solid;
border-color:transparent transparent transparent #A9DBF6;
}
.bottomdirection
{
width:0;height:0;
line-height:0;
border-width:20px;
border-style:solid;
border-color: #A9DBF6 transparent transparent transparent;
}
.leftdirection
{
width:0;height:0;
line-height:0;
border-width:20px;
border-style:solid;
border-color: transparent #A9DBF6 transparent transparent;
}
.topdirection
{
width:0;height:0;
line-height:0;
border-width:20px;
border-style:solid;
border-color: transparent transparent #A9DBF6 transparent;
}
.topdirection1
{
width:0;height:0;
line-height:0;
border-width:20px;
border-style:solid;
border-color: #A9DBF6 transparent transparent #A9DBF6 ;
}
</style>
<div class="rightdirection"></div>
<p>
<div class="bottomdirection"></div>
<p>
<div class="leftdirection"></div>
<p>
<div class="topdirection"></div> <br/><br/><br/><br/>
<div class="topdirection1"></div>
/****字体倾斜***/
.telta span{ color: #fff; font-weight: bold; position: absolute; margin-top: -5px; margin-left: -9px; -webkit-transform:rotate(-45deg); }
div+css 画三角形的更多相关文章
- css画三角形原理解析
<div id="div1"></div><div id="div2"></div><div id=&qu ...
- div+css画一个小猪佩奇
用DIV+CSS画一个小猪佩奇,挺可爱的,嘻嘻. HTML部分(全是DIV) <!-- 小猪佩奇整体容器 --> <div class="pig_container&quo ...
- 纯css画三角形
纯css画三角形与border元素相关 设置border的属性 width: 100px; height: 100px; border-style: solid; border-width: 100p ...
- CSS画三角形引发的一些思考
今天刷知乎时看到了一个问题,有谁能详细讲一下css如何画出一个三角形?怎么想都想不懂? - 知乎.很巧,刚入前端坑的我前不久也遇到过这个问题,今天再来谈一谈这个问题则是因为知乎的一些答案引发了我的 ...
- HTML 和 CSS 画三角形和画多边行基本原理及实践
基本 HTML 标签 <div class = 'test'></div> 基本 CSS 代码 .test { width: 100px; height: 100px; bac ...
- Div+Css画太极图源代码
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>D ...
- 如何用CSS画三角形
很多时候页面都需要一个或者多个小型三角形!多数人直接用PS扣个图片预览 下面用CSS简单画几个最终效果如下图 <div class="border-all-color"> ...
- 用css画三角形
当我们给某个图片做一个弹出层的时候,假设要让我们的弹出层显示一个小箭头,能够用css来画 用div来演示 div{ border:12px solid; berder-color:transparen ...
- CSS 画三角形、圆
<div class="square"></div> <style> .square { height: 0px; width: 0px; bo ...
随机推荐
- stack栈和Queue队列
1.push将对象插入 System.Collections.Generic.Stack<T> 的顶部. Stack st = new Stack(); //栈是先进后出 st.Push( ...
- Systemd入门教程:实战篇(转)
作者: 阮一峰 日期: 2016年3月 8日 上一篇文章,我介绍了 Systemd 的主要命令,今天介绍如何使用它完成一些基本的任务. 一.开机启动 对于那些支持 Systemd 的软件,安装的时候, ...
- 设计模式之桥接模式(php实现)
github地址:https://github.com/ZQCard/design_pattern /** * 桥接模式 * 优点: * 1.分离抽象接口及其实现部分.提高了比继承更好的解决方案. * ...
- centos7 安装LNMP(php7)之 nginx php-fpm yum安装以及配置文件修改
PHP7.1.6整体参考 https://www.zhihu.com/question/50615606/answer/145699091 http://www.bubuko.com/infodeta ...
- 理解Hbase RowKey的字典排序;HBase Rowkey的散列与预分区设计
HBase是三维有序存储的,是指rowkey(行键),column key(column family和qualifier)和TimeStamp(时间戳)这个三个维度是依照ASCII码表排序的. HB ...
- 矩阵压缩写法 scipy spark.ml.linalg里都有,CRS,CCS
CRS 表示:Compressed Row Storage CCS 表示:Compressed Column Storage CRS的表示参考: https://blog.csdn.net/buptf ...
- OpenGL矩阵类(C++) 【转】
http://www.cnblogs.com/hefee/p/3816727.html OpenGL矩阵类(C++) 概述 创建&初始化 存取器 矩阵运算 变换函数 实例:模型视图矩阵 实例: ...
- python中pickle简介
2017-04-10 pickle是用来加工数据的,可以用来存取结构化数据. 例如: 一个字典a = {'name':'Timmy','age':26},用pickle.dump存到本地文件,所存数据 ...
- ant create-path 报不允许匹配[xX][mM][1L]错误
将build.xml配置文件的第一行 <?xml version="1.0" encoding="UTF-8"?> 空格去掉
- ubuntu 12.04上安装wn725n无线网卡驱动
系统版本:$uname -a Linux yuliang-Veriton-M670G 3.11.0-17-generic #31~precise1-Ubuntu SMP Tue Feb 4 21:25 ...