<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

<title>em实现倒三角的提示效果</title>

</head>

<style>

 #menu {width:500px;padding:0;margin:40px auto;list-style-type:none;display:<span href="tag.php?name=tab" onclick="tagshow(event)" class="t_tag">tab</span>le;}

#menu li {width:100px; float:left; line-height:30px}

#menu a {position:relative;display:block; text-decoration:none; background:#cccccc;width:100px; }

#menu a span {display:block; font-weight:bold;color:#000; border-style:solid;border-width:0px 2px 2px 0px; border-color:#fff #fff #06a #fff;text-align:center; }

#menu a em {display:none;}

#menu a:hover {background:#FF0000;}

#menu a:hover span {color:#fff; }

#menu a:hover em {display:block; overflow:hidden; border:6px solid #06a; border-color:#06a #fff; border-width:6px 6px 0 6px; position:absolute; left:50%; top:100%;margin-left:-6px;}

</style>

<body>

   <ul id="menu">

      <li><a href="#"><span>M One</span><em></em></a></li>

      <li><a href="#"><span>M Two</span><em></em></a></li>

      <li><a href="#"><span>M Three</span><em></em></a></li>

      <li><a href="#"><span>M Four</span><em></em></a></li>

    </ul>

</body>

</html>

HTML 三角符号的更多相关文章

  1. border做三角符号

    用border做三角符号以及其他图形 ;; border-width:20px 10px; border-style:solid; border-color:#ff3300 #ff3300 #ffff ...

  2. 使用css实现三角符号

    关于使用css制作三角符号,网上有很多的例子了,在这里只是为了详细的向各位解释一下三角符号的原理 下图,是一个长宽为100px,边框宽度为100px的一个元素,由此可见,在css中上下左右的边框相交处 ...

  3. 纯CSS的三角符号

    项目中经常用到三角形,现在给大家讲下用纯CSS写的下三角实心图形 .triangle{ border-width: 5px 4px 0 4px; border-color: #454A7B trans ...

  4. select自定义下拉三角符号,css样式小细节

    本来没有写文章的习惯,但是闲下来了,整理资料,发现还挺纠结,对前端来说.所以整理下,希望对看到的人有所帮助,毕竟我不是前端开发. 起因,是前端告诉我select 框的三角箭头不能自定义.但是第二次的时 ...

  5. css 绘制对话框三角符号

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  6. 使用html+css实现三角标示符号

    我们平常打开某个网站的时候,常常会发现网页上很多导航或者指示条会使用一个三角符号去指向内容,效果简洁美观,甚至很多前端面试中也会提及如何在网页上实现一个三角符号,这里给出一个很简单使用的实现方式. 首 ...

  7. MathType给公式加三角着重号的方法

    MathType是一款出色的数学公式编辑器,不仅可以兼容word,还与PPT也兼容.它也可以在PPT中编辑出非常漂亮的公式,再加上PPT本身所具有的动画.颜色.显示等功能,在演示数学公式时非常的精美. ...

  8. textarea去掉右下三角号

    /*去掉textarea右下角三角符号*/ resize : none; 修改样式直接覆盖就行,会把默认样式覆盖掉.如border,width,height,border-radius

  9. MathType如何编辑大三角形符号

    MathType中包含的符号超过1000多个,可以满足我们很多学科的使用,尤其是数学中,涉及到很多的符号,常见的就是代数.几何这两大类,当然还有集合之类的符号使用也比较多.我们在用MathType编辑 ...

随机推荐

  1. [LeetCode 题解]：Combinations

    Given two integers n and k, return all possible combinations of k numbers out of 1 ... n. For exampl ...

  2. button的onclick函数一直刷新

    button中的onclick写成函数时需要 <button onclick="return function();"></button> 加一个retur ...

  3. Ubuntu64 apache2+lvs+Keepalived

    安装 apache2, vim, keepalived 和 ipvsadm 打开 vim /etc/keepalived/keepalived.conf 点击 i, 进入编辑状态, 输入: ! Con ...

  4. 序列（DP）（组合数）

    这是一个DP题. 我们设\(f[i][j][k]\)表示\(i\)序列长度中放入了\(j\)个元素,其中\(k\)是限定的众数的个数:状态转移方程是 \[f[k][i][j]=f[k][i-1][j- ...

  5. C#中List调用库函数sort进行升序排序

    private void button1_Click(object sender, EventArgs e) { List<int> demo2 = new List<int> ...

  6. Linux 下安装 resync 介绍

    Linux 下安装 resync 介绍 这是官网,找到对应版本的下载地址. 这里提供Linux_X64的安装包 wget '' https://download-cdn.resilio.com/sta ...

  7. Android app ADB命令

    * 查看设备 adb devices ps这个命令是查看当前连接的设备, 连接到计算机的android设备或者模拟器将会列出显示 若有多台安卓设备,可以通过在adb后面加上 -s <设备id&g ...

  8. linux设置ip别名

    修改文件 # vi /etc/hosts 添加地址和别名 192.168.222.126 s1 ##前面是机器ip,后面是别名 测试 [root@bogon /]# ping s1 PING s1 ( ...

  9. 多张表进行关联查询---->删除某个数据的时候出现还有子记录的提示

    多张表进行关联查询的时候,当某张表里面的一个字段在另外一张表有定义,就相当于一张表是另外一张表的子表:比如现在开发所遇到的一个问题: 这个是在删除sys_user表的里面的数据的时候出现的问题,因为s ...

  10. PHP初步：在Mac OS X Yosemite下搭建Apache＋PHP＋Mysql

    Mac OS X是基于unix的操作系统,很多软件都集成在系统中.所以,对于配置PHP的开发环境相对于windows和Linux更简单. 1. 启动Apache服务器 打开终端(terminal),查 ...