<html>

　　<div class="con"></div>

</html>

<style>

　　.con{width:0; height:0; border-width:10px; border-style:solid; border-color:#f40 #f40 transparent transparent;}

</style>

如何运用CSS写小三角的更多相关文章

  1. CSS通过边框border-style来写小三角

    <!DOCTYPE html> /*直接复制代码即可在浏览器验证*/ <html> <head lang="en"> <meta char ...

  2. css实现小三角（原理）

    效果图如图1所示:(简单示范,有点丑,莫介意) PS:兼容IE,FF , chrome ,360安全浏览器 先讲下原理吧,如图2所示: 这个div的样式如下所示: div{ width: 0px; h ...

  3. css的小三角实现的方式

    先上一个简单的例子哈: 此时的方向向下. 如果想方向向上的话用:border-top:0;border-bottom:4px solid; 1. width:0 height:0 border宽度,颜 ...

  4. css制作小三角

    视觉稿中经常有些小三角,如下图.每次用图片做太不方便了,我们看看用css实现的效果(支持ie6,7哦) <style> /*border实现三角*/ /*箭头向上*/ .arrow-top ...

  5. CSS的小三角

    上三角▲ width: 0; height: 0; line-height: 0; font-size: 0; border-width: 10px; border-style: solid; bor ...

  6. 用CSS制作小三角提示符号

    今天在项目中遇到了如下图的切图要求. 对,重点就是那个小三角提示符号. html 结构如下 <div class="wrap"> <div class=" ...

  7. 纯css制作小三角

    在网站制作的过程中常涉及一些小图标,以前大部分会采用小图片.但有了css3后很多变得方便了,比如要在li列表的每行文字的前面加个小三角,可以这么写: <!DOCTYPE html> < ...

  8. CSS实现小三角小技巧

    <style> .box{ width: 20px; height: 20px; background-color: #424; border: 10px solid #9C27B0; b ...

  9. CSS生成小三角

    前言:小三角的应用场景:鼠标移动到某个按钮上面,查看信息详情时,信息详情弹出框有时候会需要一个小三角. 代码如下: <div id='triangle'></div> #tri ...

随机推荐

  1. windows查看端口占用以及关闭相应的进程

    开始--运行--cmd 进入命令提示符 输入netstat -ano 即可看到所有连接的PID 之后在任务管理器中找到这个PID所对应的程序如果任务管理器中没有PID这一项,可以在任务管理器中选&qu ...

  2. MySql常用日期函数(转载)

    /*date_add(date,interval expr type)和date_sub(date,interval expr type)执行日期运算. date 是一个 datetime 或date ...

  3. OC----面向对象

    创建一个类 comm+n 实例变量的可见度 @public,@protect@private @public  // 共有的,在类的内部和外部都可以进行访问 @protected   // 受保护的, ...

  4. 用Apache生产csr申请证书

    一. 安装Apache: 1.安装完成后将apache安装目录下 conf 文件夹中的"openssl.cnf"文件复制到bin文件夹中: 2.配置Apache支持ssl: 打开A ...

  5. Session与Cookie概念

    摘:一.Session机制session是一种服务器端的状态管理技术,服务器使用一种类似于散列表的结构(也可能就是使用散列表)来保存信息.当程序需要为某个客户端的请求创建一个session的时候,服务 ...

  6. Python开发程序：选课系统-改良版

    程序名称: 选课系统 角色:学校.学员.课程.讲师要求:1. 创建北京.上海 2 所学校2. 创建linux , python , go 3个课程 , linux\py 在北京开, go 在上海开3. ...

  7. 如何让tomcat不记录catalina.out这个日志文件

    tomcat日志记录配置在conf/logging.properties中 有这5类日志 catalina,localhost,manager,admin(控制台),host-manager 还有8个 ...

  8. JSTL 自定义标签

    编写描述标签的tld文件,把这个文件放到web-inf/目录下,才能在jsp页面上调用自定义的标签 package test.yz; import java.io.IOException; impor ...

  9. 探索模拟angular的双向绑定

    前言 本次探索的demo是基于jquery写的,毕竟jquery提供了强大的选择器,用惯了就离不开它了!angular的双向绑定实在是有点精深,本次探索只实现了文本的双向绑定. View-Model ...

  10. Fatal error: Call to undefined function curl_init()问题

    最近分别在win7和Win8.win10 上分别安装php 高版本!都遇到了这个问题! 一.win7系统, apache2.2/apache2.4, php5.2升级到5.4. 这个比较容易: 1. ...