网站制作如何实现下拉菜单前面的小三角

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了网站制作如何实现下拉菜单前面的小三角相关的知识,希望对你有一定的参考价值。

正好我这里有素材:下面的代码是右三角,放上去是左三角,直接复制即可。

全css控制,无需使用图片。

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>/*css三角,均是向下f方向*/
<style type="text/css">
i cursor:pointer;
.mark1display:inline-block; width:0px; height:0px;border-width:4px; border-style:dashed; overflow:hidden;border-color:transparent transparent transparent #666;
.menu1display:inline-block; padding:2px 8px; border:1px solid #fff; color:#333;
.menu1:hoverbackground-color:#f5f5f5; border:1px solid #ccc; text-decoration:none;
.menu1:hover .mark1border-style:dashed;border-color:transparent #666 transparent transparent;border-width:4px; margin-bottom:3px;
</style>
</head>
<body>
<a href="javascript:void(0);" class="menu1"><i class="mark1"></i>企业需求</a>
</body>
</html>

主要是通过border-color:transparent transparent transparent #666;来控制三角方向

参考技术A 这个简单你看看它是不是图案的还是代码的,图案的在PS里做就行记得注意分辨率,代码的话这个更简单看看你这个网站直接把它的代码复制过来就行了追问

因为要做个网站要实现类似的功能,图片是其他网站显示的是借鉴的,如何知道它是图片还是代码?

追答

你把那个网站的所有东西下载下来看看有没有图片链接,没有的话就从他的源代码上找

以上是关于网站制作如何实现下拉菜单前面的小三角的主要内容,如果未能解决你的问题,请参考以下文章

如何实现导航菜单栏中的二级下拉菜单?

C#下拉菜单最后一项自定义的实现

Excel 如何实现五级下拉菜单联动

用css怎么写菜单上面的小三角

在QT中怎么实现当单击QLabel时出现一个下拉菜单?并且选择一个项目后,前面打勾? 求高手帮忙!

用三种方式实现导航菜单中的二级下拉菜单