CSS导航指示箭头
效果图
代码
<!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=utf-8" />
<title>[资源下载]</title>
<style type="text/css">
#tri_box{
width: 400px;height: 100px;border: 1px solid silver;position: relative;margin: 5px auto;border-bottom: 2px solid orange;
}
#tri{
width: 0px;height: 0px;border: 6px solid white;left: 200px;bottom: -14px;margin: 0px;position: absolute;border-top-color: orange;
/*绝对定位，元素之间的位置不会互相影响，而相对定位恰好相反，所以视情况而用。*/
}
</style>
</head>
<body>
<div id="tri_box"><em id="tri"></em></div>
</body>
</html>
CSS导航指示箭头的更多相关文章
- css指示箭头两种实现方法
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 使用纯CSS实现带箭头的提示框
爱编程爱分享,原创文章,转载请注明出处,谢谢!http://www.cnblogs.com/fozero/p/6187323.html 1.全部代码 <!DOCTYPE html> < ...
- CSS导航菜单水平居中的多种方法
CSS导航菜单水平居中的多种方法 在网页设计中,水平导航菜单使用是十分广泛的,在CSS样式中,我们一般会用Float元素或是「display:inline-block」来解决.而今天主要讲解如何让未知 ...
- HTML5 div+css导航菜单
HTML5 div+css导航菜单 视频 音乐 小说 故事 作品 阅读 联系
- Android弹出选项框及指示箭头动画选择
Android弹出选项框及指示箭头动画选择 Android原生的Spinner提供了下拉列表选项框,但在一些流行的APP中,原生的Spinner似乎不太受待见,而通常会有下图所示的下拉列表选项框 ...
- css实现带箭头选项卡
这阵子在做一个web端项目中遇到一个问题,需要实现带箭头的选项卡点击可切换.起初没想太多,直接切一个向上的小箭头图片,外层div设置相同颜色的边框,再用相对定位和绝对定位.这种方法是可行的,但是因为手 ...
- 强烈推荐一款CSS导航菜单
强烈推荐一款CSS导航菜单,用到政府学校类网站上超级不错,有点类似站长网菜单的味道,只不过颜色不一样而已,这种菜单还不是真正意义上的“下拉”菜单,应该叫滑出菜单吧?反正比较不错,不多说了. <! ...
- 使用css画一个箭头
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name ...
- [HTML/CSS]导航栏的下划线跟随效果
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
随机推荐
- VPW协议解析
http://www.dpfdoctor.net/content/?220.html SAE J1850 VPW协议也是OBD II标准中的一种,通常应用于GM车系中. VPW英文全称是Variabl ...
- 解决ArcGIS Android Could not find class 'com.esri.android.map.MapView'问题
环境win7 64bit sp1,eclipse 4.2.1 ,android API 16,ADT 23.0.2,arcgis android sdk 10.2.4 从arcgis-android- ...
- Myeclipse如何整合tomcat
.在本机上安装MyEclipse和Tomcat 5软件程序 2.运行MyEclipse,设置与Tomcat 5服务器的连接,如下图所示: 选择Window--->Preferences,点击进入 ...
- jquery动态创建form并提交到.ashx文件处理
有时候在写web 应用的时候,需要临时动态构造一个form 并提交,form 里面的参数以及action,以及是post请求还是get请求,甚至form 的样式都是可以指定的,用原生的java ...
- 从零开始学android开发-获取控件
mBtnNews = (Button)findViewById(R.id.btn_news);//获取控件
- Linux内核高端内存 转
Linux内核地址映射模型x86 CPU采用了段页式地址映射模型.进程代码中的地址为逻辑地址,经过段页式地址映射后,才真正访问物理内存. 段页式机制如下图. Linux内核地址空间划分 通 ...
- 错误“Unexpected namespace prefix "xmlns" found for tag LinearLayout”的解决方法
编写布局代码时发现xml脚本出现错误“Unexpected namespace prefix "xmlns" found for tag LinearLayout”,原来是一个na ...
- 在asp.net mvc中将checkbox传到后台时总是true的解决方法
我今天在做同城交友网站(www.niyeuwo.com)时发现,不管checkbox是否选 中,传到Controller时总是true,后来在查网上查了资料才知道,原来是jQuery在传值时写错了. ...
- Java微框架：不可忽视的新趋势--转载
原文:http://www.infoq.com/cn/news/2015/06/Java-Spark-Jodd-Ninja?utm_campaign=infoq_content&utm_sou ...
- LeetCode23 Merge k Sorted Lists
题意: Merge k sorted linked lists and return it as one sorted list. Analyze and describe its complexit ...