<!doctype html>
<html>
<head>
<title></title>
<meta charset="utf-8">
<style>
#d1{
width:0px;
height:0px;
border:20px solid transparent;
border-top-color:#0f0;
}
</style>
</head>
<body>
<div id="d1"></div>
</body>
</html>

网页显示效果：

css border属性做小三角标的更多相关文章

  1. 利用边框border的属性做小符号

    前两天学习中,发现网站上的一个小符号,以为是插入的img,但找来找去也未发现img的地址.最后问了同学,才得知是用border属性做出来的. 符号如右:  其css代码如下: .fuhao { pos ...

  2. CSS创建三角形（小三角）的几种方法

    你可以在很多地方看到三角形(小三角):tooltips提示框.下拉菜单.甚至在loading载入动画里.不管你喜欢还是不喜欢,这些小元素对各UI元素之间的联系关系式很重要的. 有一些不同的方法来设计并 ...

  3. css直接写出小三角

    在开发移动端项目时,总是遇到很多小三角,之前一直用图片,感觉好麻烦,今天尝试了直接用CSS写出小三角!先看看如何写出各种小三角! /*箭头向上*/ .arrow-up { ; ; border-lef ...

  4. CSS border 属性和 border-collapse 属性

    border 简写属性在一个声明设置所有的边框属性. 可以按顺序设置如下属性: border-width border-style border-color 如果不设置其中的某个值,也不会出问题,比如 ...

  5. CSS-border属性制作小三角

    1--三角向上下左上.右上.右下.左下这四个方向突出的样式 向左上角突出: border-color: transparent transparent transparent #FFCC00; bor ...

  6. css实现一个缺口小三角

    .square{ width:; height:; margin:0 auto; border:6px solid transparent; border-bottom: 6px solid red; ...

  7. Sass mixin 使用css border属性画三角形

    To be finished. //triangle@mixin css-triangle ($direction: "down", $size: 20px, $color: #0 ...

  8. CSS border三角、圆角图形生成技术简介

    http://www.zhangxinxu.com/wordpress/?p=794 一.前言 利用CSS的border属性可以生成一些图形,例如三角或是圆角.纯粹的CSS2的内容,没有兼容性的问题, ...

  9. CSS：不可思议的border属性

    原文:Magic of CSS border property 译文:不可思议的CSS border属性 译者:dwqs 在CSS中,其border属性有很多的规则.对于一些事物,例如三角形或者其它的 ...

随机推荐

  1. python --enable-shared

    https://github.com/docker-library/python/issues/21 例如编译安装python3.5.2,脚本如下: wget https://s3.cn-north- ...

  2. raspbian调整分辨率

    参考 https://www.raspberrypi.org/documentation/configuration/config-txt.md 设置示例,设置成800*600 tvservice - ...

  3. DevExpress 隐藏Ribbon中barbuttonItem的SuperTip（2）

    在form界面增加 toolTipController 工具 然后将 ribbonControl.ToolTipController 的属性设置成 toolTipController toolTipC ...

  4. appium java 环境搭建

    appium是一款open source 移动自动化测试框架,既支持Android 也支持IOS. appium 基于webdriver协议执行测试脚本. 今天,如炒剩饭,介绍一下搭建appium A ...

  5. Eclipse 一些小知识

    快速查找未完成事项 eg: // TODO 通过模板格式化代码 Window --> Preferences --> Java --> Editor  --> Template ...

  6. Java Graphics2D 画出文字描边效果

    在CSDN看到的,在此记下. (http://bbs.csdn.net/topics/390703095) import javax.swing.*; import java.awt.*; impor ...

  7. js的类型及调试下的辨识

    <script> var s1 = '11'; var s2 = 11; var s3 = true; console.log("我的类型是"+typeof(s1)+& ...

  8. JSON resource 启示

    好久没写博客了,刚走完20000步,不废话了,先吐为快. 上面的en-us.json 是一个简单得不能再简单的json对象,当你写下"key-2": "duplicate ...

  9. teamviewer "TeamViewer Daemon is not running

    执行下面的命令问题解决: # teamviewer --daemon enable enable Sat Jan :: CST Action: Installing daemon () for 'up ...

  10. [Spring] AOP, Aspect实例解析

    最近要用到切面来统一处理日志记录,写了个小实例练了练手: 具体实现类: public interface PersonServer { public void save(String name); p ...